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