用户界面设计原则教案资料.doc

用户界面设计原则精品资料良好的用户界面一般都符合下列的用户界面规范: 1. 易用性原则按钮名称应该易懂，用词准确，没有摸棱两可的字眼，要与同一界面上的其他按钮易于区分，如能望文知意最好。理想的情况是用户不用查阅帮助就能知道该界面的功能并进行相关的正确操作。易用性细则：完成相同或相近功能的按钮用Frame 框起来，常用按钮要支持快捷方式。完成同一功能或任务的元素放在集中位置，减少鼠标移动的距离。按功能将界面划分局域块，用Frame 框起来，并要有功能说明或标题。界面要支持键盘自动浏览按钮功能，即按Tab 键的自动切换功能。界面上首先应输入的信息和重要信息的控件在Tab 顺序中应当靠前，位置也应放在窗口上较醒目的位置。同一界面上的控件数最好不要超过10 个，多于10 个时可以考虑使用分页界面显示。分页界面要支持在页面间的快捷切换，常用组合快捷键Ctrl+Tab默认按钮要支持Enter 操作，即按Enter 后自动执行默认按钮对应操作。可输入控件检测到非法输入后应给出说明信息并能自动获得焦点。Tab 键的顺序与控件排列顺序要一直，目前流行总体从上到下，同时行间从左到右的方式。复选框和选项框按选择几率的高底而先后排列。复选框和选项框要有默认选项，并支持Tab 选择。选项数相同时多用选项框而不用下拉列表框。界面空间较小时使用下拉框而不用选项框。选项数较少时使用选项框，相反使用下拉列表框。专业性强的软件要使用相关的专业术语，通用性界面则提倡使用通用性词眼。对于界面输入重复性高的情况，该界面应全面支持键盘操作，即在不使用鼠标的情况下采用键盘进行操作。 2. 规范性原则 通常界面设计都按Windows 界面的规范来设计，即包含“菜单条、工具栏、工具箱厢、状态栏、滚动条、右键快捷菜单”的标准格式，可以说：界面遵循规范化的程度越高，则易用性相应的就越好。小型软件一般不提供工具箱。 规范性细则：常用菜单要有命令快捷方式。完成相同或相近功能的菜单用横线隔开放在同一位置。菜单前的图标能直观的代表要完成的操作。菜单深度一般要求最多控制在三层以内。工具栏要求可以根据用户的要求自己选择定制。相同或相近功能的工具栏放在一起。工具栏中的每一个按钮要有及时提示信息。一条工具栏的长度最长不能超出屏幕宽度。工具栏的图标能直观的代表要完成的操作。系统常用的工具栏设置默认放置位置。工具栏太多时可以考虑使用工具箱。工具箱要具有可增减性，由用户自己根据需求定制。工具箱的默认总宽度不要超过屏幕宽度的1/5。状态条要能显示用户切实需要的信息，常用的有：目前的操作、系统状态、用户位置、用户信息、提示信息、错误信息、使用单位信息及软件开发商信息等，如果某一操作需要的时间较长，还应该显示进度条和进程提示。滚动条的长度要根据显示信息的长度或宽度能及时变换，以利于用户了解显示信息的位置和百分比。状态条的高度以放置五好字为宜，滚动条的宽度比状态条的略窄。菜单和工具条要有清楚的界限；菜单要求凸出显示，这样在移走工具条时仍有立体感。菜单和状态条中通常使用5 号字体。工具条一般比菜单要宽，但不要宽的太多，否则看起来很不协调。右键快捷菜单采用与菜单相同的准则。 3. 帮助设施原则 系统应该提供详尽而可靠的帮助文档，在用户使用产生迷惑时可以自己寻求解决方法。 帮助设施细则：帮助文档中的性能介绍与说明要与系统性能配套一致。打包新系统时，对作了修改的地方在帮助文档中要做相应的修改，做到版本统一。操作时要提供及时调用系统帮助的功能。常用F1。在界面上调用帮助时应该能够及时定位到与该操作相对的帮助位置。也就是说帮助要有即时针对性。最好提供目前流行的联机帮助格式或HTML 帮助格式。用户可以用关键词在帮助索引中搜索所要的帮助，当然也应该提供帮助主题词。如果没有提供书面的帮助文档的话，最好有打印帮助的功能。在帮助中应该提供我们的技术支持方式，一旦用户难以自己解决可以方便的寻求新的帮助方式. 4. 合理性原则 屏幕对角线相交的位置是用户直视的地方，正上方四分之一处为易吸引用户注意力的位置，在放置窗体时要注意利用这两个位置。 合理性细则：父窗体或主窗体的中心位置应该在对角线焦点附近。子窗体位置应该在主窗体的左上角或正中。多个子窗体弹出时应该依次向右下方偏移，以显示窗体出标题为宜。重要的命令按钮与使用较频繁的按钮要放在界面上注目的位置。错误使用容易引起界面退出或关闭的按钮不应该放在易点位置。横排开头或最后与竖排最后为易点位置。与正在进行的操作无关的按钮应该加以屏蔽。对可能造成数据无法恢复的操作必须提供确认信息，给用户放弃选择的机会。非法的输入或操作应有足够的提示说明。对运行过程中出现问题而引起错误的地方要有提示，让用户明白错误出处，避免形成无限期的等待。提示、警告、或错误说明应该清楚、明了、恰当并且应避免英文提示的出现。5. 美观与协调性原则 界面应该大小适合美学观点，感觉协调舒适，能在有效的范围内吸引用户的注意力。 美观与协调性细则：长宽接近黄金点比例，切忌长宽比例失调、或宽度超过长度。布局要合理，不宜过于密集，也不能过于空旷，合理的利用空间。按钮大小基本相近，忌用太长的名称，免得占用过多的界面位置。按钮的大小要与界面的大小和空间要协调。避免空旷的界面上放置很大的按钮。放置完控件后界面不应有很大的空缺位置。字体的大小要与界面的大小比例协调， 通常使用的字体中宋体9-12 较为美观，很少使用超过12号的字体。前景与背景色搭配合理协调，反差不宜太大，最好少用深色，如大红、大绿等。常用色考虑使用Windows 界面色调。如果使用其他颜色，主色要柔和，具有亲和力与磁力，坚决杜绝刺目的颜色。大型系统常用的主色有#E1E1E1、#EFEFEF、#C0C0C0等。界面风格要保持一致，字的大小、颜色、字体要相同，除非是需要艺术处理或有特殊要求的地方。如果窗体支持最小化和最大化或放大时，窗体上的控件也要随着窗体而缩放；切忌只放大窗体而忽略控件的缩放。对于含有按钮的界面一般不应该支持缩放，即右上角只有关闭功能。通常父窗体支持缩放时，子窗体没有必要缩放。如果能给用户提供自定义界面风格则更好，由用户自己选择颜色、字体等。 6. 菜单位置原则 菜单是界面上最重要的元素，菜单位置按照按功能来组织。 菜单设置细则：菜单通常采用“常用-主要-次要-工具-帮助”的位置排列，符合流行的Windows 风格。常用的有“文件”、“编辑”，“查看”等，几乎每个系统都有这些选项，当然要根据不同的系统有所取舍。下拉菜单要根据菜单选项的含义进行分组，并切按照一定的规则进行排列，用横线隔开。一组菜单的使用有先后要求或有向导作用时，应该按先后次序排列。没有顺序要求的菜单项按使用频率和重要性排列，常用的放在开头， 不常用的靠后放置；重要的放在开头，次要的放在后边。如果菜单选项较多，应该采用加长菜单的长度而减少深度的原则排列。菜单深度一般要求最多控制在三层以内。对常用的菜单要有快捷命令方式，组合原则见8。对与进行的操作无关的菜单要用屏蔽的方式加以处理，如果采用动态加载方式即只有需要的菜单才显示最好。菜单前的图标不宜太大，与字高保持一直最好。主菜单的宽度要接近，字数不应多于四个，每个菜单的字数能相同最好。主菜单数目不应太多，最好为单排布置。 7. 独特性原则 如果一味的遵循业界的界面标准，则会丧失自己的个性。在框架符合以上规范的情况下，设计具有自己独特风格的界面尤为重要。尤其在商业软件流通中有着很好的迁移默化的广告效用。 独特性细则：安装界面上应有单位介绍或产品介绍，并有自己的图标或徽标。主界面，最好是大多数界面上要有公司图标或徽标。登录界面上要有本产品的标志，同时包含公司图标或徽标。帮助菜单的“关于”中应有版权和产品信息。公司的系列产品要保持一直的界面风格，如背景色、字体、菜单排列方式、图标、安装过程、按钮用语等应该大体一致。应为产品制作特有的图标并区别于公司图标或徽标 8. 快捷方式的组合原则 在菜单及按钮中使用快捷键可以让喜欢使用键盘的用户操作得更快一些 在西文Windows 及其应用软件中快捷键的使用大多是一致的。 菜单中：面向事务的组合有：Ctrl-D 删除；Ctrl-F 寻找 ；Ctrl H 替换；Ctrl-I 插入 ；Ctrl-N 新记录 ；Ctrl-S 保存 Ctrl-O 打开。列表：Ctrl-R ，Ctrl-G 定位；Ctrl-Tab 下一分页窗口或反序浏览同一页面控件；。编辑：Ctrl-A 全选；Ctrl-C 拷贝；Ctrl-V 粘贴；Ctrl-X 剪切；Ctrl-Z 撤消操作；Ctrl-Y 恢复操作。文件操作：Ctrl-P 打印；Ctrl-W 关闭。系统菜单：Alt-A 文件；Alt-E 编辑；Alt-T 工具；AltW 窗口；AltH 帮助。MS Windows 保留键：Ctrl-Esc 任务列表 ；Ctrl-F4 关闭窗口； Alt-F4 结束应用；Alt-Tab 下一应用 ；Enter 缺省按钮/确认 操作 ；Esc取消按钮/取消操作；Shift-F1 上下文相关帮助 。按钮中： 可以根据系统需要而调节，以下只是常用的组合。 Alt-Y 确定(是）；Alt-C 取消；Alt-N 否；Alt-D 删除；Alt-Q 退出；Alt-A 添加；Alt-E 编辑；Alt-B 浏览；Alt-R 读；Alt-W 写。这些快捷键也可以作为开发中文应用软件的标准，但亦可使用汉语拼音的开头字母。9. 排错性考虑原则 在界面上通过下列方式来控制出错几率，会大大减少系统因用户人为的错误引起的破坏。开发者应当尽量周全地考虑到各种可能发生的问题，使出错的可能降至最小。如应用出现保护性错误而退出系统，这种错误最容易使用户对软件失去信心。因为这意味着用户要中断思路，并费时费力地重新登录，而且已进行的操作也会因没有存盘而全部丢失。 排错性细则：最重要的是排除可能会使应用非正常中止的错误。应当注意尽可能避免用户无意录入无效的数据。采用相关控件限制用户输入值的种类。当用户作出选择的可能性只有两个时，可以采用单选框。当选择的可能再多一些时，可以采用复选框，每一种选择都是有效的，用户不可能输入任何一种无效的选择。当选项特别多时，可以采用列表框，下拉式列表框。在一个应用系统中，开发者应当避免用户作出未经授权或没有意义的操作。对可能引起致命错误或系统出错的输入字符或动作要加限制或屏蔽。对可能发生严重后果的操作要有补救措施。通过补救措施用户可以回到原来的正确状态。对一些特殊符号的输入、与系统使用的符号相冲突的字符等进行判断并阻止用户输入该字符。对错误操作最好支持可逆性处理，如取消系列操作。在输入有效性字符之前应该阻止用户进行只有输入之后才可进行的操作。对可能造成等待时间较长的操作应该提供取消功能。特殊字符常有；”，：“”、|+=）-(_*&%$#!，。?/还有空格。与系统采用的保留字符冲突的要加以限制。在读入用户所输入的信息时，根据需要选择是否去掉前后空格。有些读入数据库的字段不支持中间有空格，但用户切实需要输入中间空格，这时要在程序中加以处理。 10. 多窗口的应用与系统资源原则 设计良好的软件不仅要有完备的功能，而且要尽可能的占用最底限度的资源。在多窗口系统中，有些界面要求必须保持在最顶层，避免用户在打开多个窗口时，不停的切换甚至最小化其他窗口来显示该窗口。在主界面载入完毕后自动卸出内存，让出所占用的WINDOWS 系统资源。关闭所有窗体，系统退出后要释放所占的所有系统资源 ，除非是需要后台运行的系统。尽量防止对系统的独占使用。 了解了良好的用户界面的规范，那么我们测试工作该如何下手？该注意那些方面呢？ 1. 一致性 如果你可以在一个列表的项目上双击后能够弹出对话框，那么应该在任何列表中双击都能弹出对话框。要有统一的字体写号、统一的色调、统一的提示用词、窗口在统一的位置、按钮也在窗口的相同的位置。 2. 设置标准并遵循它 可以参数一些工业标准，如IBM的界面设计规范或MS的设计规则，它提供了90你所需要的规范。 3. 设置向导 如果用户使用了一个功能后，不知道如何做下一个，他们就会放弃。如果*作流程和手工工作流程一致，用户就会努力去完成它。最好的方式来引导用户就是在桌面上设置一个流程向导。 4. 提示信息必须恰当且规范 提示信息必须容易理解并且口径统一，比如“您输入了错误的数据”、“用户数据不能超过8位”。一致的措词，提示信息还应该出现在一致的位置，如弹出提示窗口、窗口的上方或窗口的下方。对用户的称呼应该统一，比如有时提示“用户输入了错误的数据”，有时提示“您输入了错误的数据”，有时又提示“使用者输入了错误的数据”，这样会使用户无所适从。 5. 借鉴好的程序 多了解同类软件的界面，并加以分析与了解，直到能够区别好的用户界面与差的用户界面。但不能够简单的模仿别人的界面，而使得自己的软件没有特色 6. 功能的统一有一些很常用的功能，如添加、修改、删除、查看，同一个软件中，这些功能应该有相同的处理方法。 7. 变灰的功能 有时有些功能不可用，最好不要删除这些按钮若项目，而是使他们变灰为不可用状态，这样有助于用户理解整个程序的功能。 8. 默认按钮 使用不具有破坏功能的默认按钮，在每个窗口中，为了方便用户，一般都定义了一个默认按钮，当用户敲回车键时可以快速执行某功能，但有时用户会不小心按错回车键，这时候执行了默认功能后，不能产生不可还原的操作，比如删除或保存。 按照上面的规范和测试的细则检验过被测试的软件。相信软件界面上能显得更加规范和容易被用户所接受。用户界面测试用例指标检查项测试人员评价合适性和正确性用户界面是否与软件的功能相融洽？是否所有界面元素的文字和状态都正确无误？容易理解对于常用的功能，用户能否不必阅读手册就能使用？是否所有界面元素（例如图标）都不会让人误解？是否所有界面元素提供了充分而必要的提示？界面结构能够清晰地反映工作流程？用户是否容易知道自己在界面中的位置，不会迷失方向？有联机帮助吗？风格一致同类的界面元素是否有相同的视感和相同的操作方式？字体是否一致？是否符合广大用户使用同类软件的习惯？及时反馈信息是否提供进度条、动画等反映正在进行的比较耗时间的过程？是否为重要的操作返回必要的结果信息？出错处理是否对重要的输入数据进行校验？执行有风险的操作时，有“确认”、“放弃”等提示吗？是否根据用户的权限自动屏蔽某些功能？是否提供Undo功能用以撤销不期望的操作？适应各种水平的用户所有界面元素都具备充分必要的键盘操作和鼠标操作吗？初学者和专家都有合适的方式操作这个界面吗？色盲或者色弱的用户能正常使用该界面吗？国际化是否使用国际通行的图标和语言？度量单位、日期格式、人的名字等是否符合国际惯例？个性化是否具有与众不同的、让用户记忆深刻的界面设计？是否在具备必要的“一致性”的前提下突出“个性化”设计？合理布局和谐色彩界面的布局符合软件的功能逻辑吗？界面元素是否在水平或者垂直方向对齐？ 界面元素的尺寸是否合理？行、列的间距是否保持一致？是否恰当地利用窗体和控件的空白，以及分割线条？窗口切换、移动、改变大小时，界面正常吗？界面的色调是否让人感到和谐、满意？重要的对象是否用醒目的色彩表示？色彩使用是否符合行业的习惯？仅供学习与交流，如有侵权请联系网站删除 谢谢11