第十章用户界面设计

第十章用户界面设计1、什么是用户界面设计•用户界面是人与计算机之间搭建的一个有效的交流媒介。•开发人员遵循一系列的界面设计规则，定义界面对象和界面动作，并把对象、动作和规则统一到操作屏幕上，实现一个布局合理、操作方便、友好的用户界面。北方工业大学教学信息管理系统网站模糊不清，设计混乱的界面2、界面设计源于需求分析阶段•仔细记录用户对软件界面的–布局要求–操作要求–色彩要求•还要了解使用者的年龄、受教育程度、专业和爱好等信息3、界面设计三条“黄金原则”•TheoMandel提出了三条界面设计原则：–置用户于控制之下：用户界面能够对用户的操作作出恰当的反应，并帮助用户完成需要的工作。–减少用户的记忆负担：系统应该“记住”有关的信息，通过缺省项、快捷方式或界面视觉减少用户的记忆负担。–保持界面的一致：用户应该以一致的方式展示和获取信息。10.1易用性是界面设计的核心1）按功能将界面划分为块，每块要有功能说明或标题。相近功能的界面元素，像命令按钮、选择按钮等元素，应集中放置或者用组框将它们括起来，减少鼠标移动的距离。2）对于同一种功能应该提供多种操作方式：鼠标、快捷键或者声音等等。3）界面要支持键盘浏览按钮功能，即按Tab键的自动切换功能。Tab键的顺序与控件排列顺序要一直，一般是从上到下、从左到右。4）按照信息的输入顺序，以及信息的重要程度安排控件，重要的信息应放在窗口较醒目的位置。5）一个界面的控件数最好不超过10个，多于10个时应该考虑使用分页或多标签页显示。6）分页界面要支持在页面间的快捷切换，常用组合快捷键Ctrl+Tab。7）默认按钮要支持Enter操作，即按Enter后自动执行默认按钮对应的操作。8）当检测到非法输入后应给出说明并能自动获得焦点。9）复选项和单选项应按选择机率排列，支持默认选项和Tab选择。10）当选项个数较少并且固定时，应采用选项框而不用下拉列表框。但是如果界面空间较小时，应该使用下拉框而少用选项框。11）当软件的功能很多，特别是分支复杂的情况下，应该提供方便的导航功能，引导用户顺利完成需要的一系列功能。如下图所示。12）界面用词要规范。10.2界面必须一致•最忌讳每换一个屏幕，用户就要换一套操作命令与操作方法。1）完成相同或相近功能的菜单项用横线隔在同一组内。2）菜单深度一般要求控制在三层以内。3）图标能直观地代表要完成的操作。4）工具栏可以由用户自己定制，其中的每个按钮要有瞬时提示信息，工具栏的长度不能超出屏幕宽度。常用的工具栏有默认位置。5）状态条显示用户需要的信息：目前的操作、系统状态、用户位置、提示信息、错误信息等，如果某一操作需要的时间较长，还应该显示进度条和进程提示。6）滚动条的长度要根据显示信息的长度或宽度及时变换，滚动条的宽度比状态条的略窄。7）菜单条和工具条要有清楚的界限。8）右键快捷菜单采用与菜单相同的准则。10.3界面提供帮助1）提供及时调用系统帮助的功能，常用F1键。2）调用帮助时，能够定位到与该操作相对应的位置，即帮助要有即时性和针对性。3）提供关键词搜索帮助的功能。4）在帮助中提供技术支持方式，一旦用户难以自己解决问题时，可以方便地寻求其他帮助方式。5）帮助中应该提供超级链接和返回功能。10.4界面设计合理性1）屏幕布局合理，不过于密集或稀疏，合理地利用空间。2）主窗体位置和比例合适。3）子窗体位置应该在主窗体的左上角或正中。多个子窗体弹出时应该依次向右下方偏移，以显示出窗体标题为宜。4）重要的命令按钮与使用较频繁的按钮要放在界面瞩目的位置。按钮大小应该与界面大小成比例、大小一致，按钮上文字不要太长，要避免在空旷的界面上放置很大的按钮。5）关闭窗体的按钮不应该放在易点位置，经验表明横排开头或最后与竖排最后的按钮为易点位置。6）与正在进行的操作无关的控件应该加以屏蔽，通常用灰色表示无效控件。7）界面风格要保持一致，字的大小、颜色、字体要相同，除非是需要艺术处理或有特殊要求的地方。字体通常使用宋体9-12，很少使用超过12号的字体。8）一个界面中最好不要超过3种颜色。前景与背景色搭配要协调，反差不宜太大，主色要柔和，通常使用浅色调，如浅灰、白色等，具有亲和力。重要操作组件则以彩度较高的颜色来表达，但是区域不可太大，否则看起来显得很混乱。9）如果能给用户提供自定义界面风格更好，由用户自己选择颜色、字体等。10）对可能造成数据无法恢复的操作必须提供确认操作，给用户放弃选择的机会。11）非法的输入或操作应有准确的提示说明。12）对运行过程中出现问题要有提示，让用户明白错误出处，避免形成无限期等待。13）允许用户中断当前的工作，转去执行其他任务，结束后再回到中断点继续工作。14）由于不同的用户可能有不同的需求，软件可以根据需要设置“下一步”、“完成”等操作步骤，面对不同层次的用户提供多种选择。例如卡巴斯基反病毒软件的安装界面，用户在安装此软件时，可以根据自己的需要选择不同功能，并且可以方便地实现“上一步”、“下一步”或“取消”等的跳转。10.5界面的独特性1）软件启动首页应该为高清晰度图像，如果需要在不同的平台上运行，则应该考虑格式转换。应该醒目地标注公司标志、产品商标、软件名称、版本号、网址、版权声明和序列号等信息。2）帮助菜单的“关于”中应有版权和产品信息。3）公司的系列产品要保持一致的界面风格，如背景色、字体、菜单排列方式、图标、安装过程、按钮用语等应该大体一致。公司的标志、物品分类、新手上路……版权声明……10.6界面的容错性•用户在操作软件过程中可能会有误操作，如果每次的误操作都导致系统退出，会使用户对软件失去信心。•这意味着用户要中断思路，并重新登录；•已进行的操作因没有存盘而全部丢失。•界面设计者应当尽量周全地考虑到各种可能发生的问题，尽量排除可能会使软件非正常中止的错误。•1）对用户的输入提供必要的提示，避免用户录入无效的数据。2）采用相关控件限制用户输入值的类型。3）当用户的选择是多选一时，可以采用单选框，否则采用复选框，当选项非常多时，可以采用下拉式列表框。这样可以保证用户的每种选择都是有效的，不可能输入任何无效的选择。4）对可能引起致命错误或系统出错的输入字符或动作要加限制或屏蔽。5）对错误操作最好支持可逆性处理，如取消系列操作。6）对可能造成等待时间较长的操作应该提供取消功能。10.7界面与系统响应时间响应时间长度界面设计0-10秒鼠标显示为沙漏，显示系统仍在执行10到18秒显示处理进度18秒以上显示处理窗口，或显示进度条一个长时间的处理完成时应给予完成提醒信息4界面设计案例—输入界面设计点评•图书信息的内容比较多，为了便于业务人员操作，在界面上将信息分组：书名与作者、版本及载体项、分类项等等。•为了区分必填项，在界面上增加了红色的“*”标识。•有些数据项不必让用户输入，在界面上以带下画线的数据项表示。•为了界面美观，尽可能将数据项对齐，宋体,大小9pt，数据项名称意思清晰。•从图中可以看出图书信息的数据项很多，需要用滚动条来回操作，对用户来讲还是比较繁琐的。改进的方法可以将组框的左上角设计一个“＋”，单击时展开组框的数据项，组框的左上角显示“－”，单击符号“－”，收起组框。•最下面设计了四个操作按钮，间距相等，意思明确，略有不足的是操作按钮上应该设计热键。业务人员日复一日的操作非常辛苦，用鼠标操作比键盘操作要繁琐，因此设计操作热键是非常必要的。查询界面点评•查询界面是应用软件最常见的界面，一般要求是查询条件清晰、简洁，查询结果内容丰富、布局合理。•上图是简单的数据查询界面，设计上考虑了几个细节：1）查询结果除了列出每个出版社的出版计划外，还列出年度书号核发总量，已经核发的总量、剩余书号总量；2）计算结果的页数，可以前后翻页或直接转到指定的页。3）显示的结果列表可以通过双击表头对查询结果排序。4）界面的左上角设计了一个快速搜索栏，可以快速在结果中定位搜索的内容。复杂查询点评•复杂查询通常用在不确定的情况，在应用系统中非常多见。用户可以根据需要自由组合查询条件。例如，查询图书2000年1月1日以来出版的“三农”图书，在“三农”选项框前打勾，在起始时间栏填写日期，在“条码下载”、“已审核”等选项前打勾，系统根据查询的条件在数据库中搜索，并显示数据。审核界面设计点评•在企业信息管理系统中，经常有审核的操作。审核操作经常是根据基层用户上报的数据，结合一些具体的审核规范和标准，填写审核结果：“同意”或“不同意”。•界面的左边显示待审核的信息，这部分的底色是浅灰色，表示只能查看不能修改。界面的右上部是四个标签页：管理信息、出版者信息、辑册信息、重版信息，为审核人员提供辅助信息。•在界面的右下部分设计了核发结果和核发意见栏，核发结果用下拉列表列出了常用的核发结果，核发意见栏是核发人员填写意见的栏目。•操作按钮设计采用最短距离法。•问题：左边的图书信息布署比较乱，最好把虚线去掉，用组框分割信息，组框可以关闭和打开。•所有的操作按钮和标签页应该设计操作快捷键。我的桌面•我的桌面是指使用者进入系统后的第一个界面，系统根据登录者的身份自动配置出最佳的操作界面。所谓最佳是指：当前最重要的操作、最需要的信息、最重要的消息都显示在界面上，隐去没有操作权限的菜单和按钮，不需要的信息。•通常系统的菜单要根据角色配置，显示的信息要根据用户ID号，只显示当前用户可见的信息。最好能够将系统对该用户的提示信息显示在相应的窗口，用户及时了解该做什么。