第10讲人机交互技术精

第10讲

用户界面设计第一部分用户界面设计谁来设计软件的用户界面？用户眼中的好软件好的用户界面应具备的特性界面设计美学用户界面的主要思想界面设计的原则谁来设计软件的用户界面？毫无疑问，应当由用户界面设计师用户界面设计不完全等于美工如果软件企业里没有专职的用户界面设计师，那么请产品经理甚至软件工程师和美工人员共同设计用户界面。相比较而言，让软件开发人员学会用户界面设计，要比美工人员学会软件开发容易得多。对软件开发工程师进行用户界面设计的培训，然后让软件开发工程师负责应用软件用户界面的设计和实现，请美工人员做锦上添花的美化工作。谁来设计软件的用户界面？很多人有疑虑，让软件开发工程师从事用户界面设计，他们能做好吗？回答是肯定的，只要软件工程师不自我封闭，追求上进，那么他肯定能够学会用户界面设计，绝对比他原先做的用户界面好。软件工程师的智商都不低，只要他不懒惰，勤于学习、实践和思考，那么他就能够成为某些领域的行家乃至专家。用户眼中的好软件“好”的软件意味着“实用、易用、美观”如果软件的功能不实用（不能为用户解决问题），那么不管该软件是否易用和美观，用户一般都不愿意购买该软件，除非用户没有选择余地。如果两个软件的功能和价格都相似，那么用户会挑选更加易用的那个软件。如果两个软件的功能、价格、易用性都差不多，那么用户会选择更加美观的那个软件。谁来评价“好或差”用户才真正有资格说软件“好或坏”。如果用户对软件很不满意，开发人员不要有逆反情绪：从哪里找来的笨蛋用户！应当站在用户的立场看待软件开发机构宣扬“以客户为中心”，但是却撇开客户只顾忙碌地开发软件，做出客户不会用的东西。很多软件开发人员不能够一次性地完成某些开发任务，主要原因不是技术水平低下，而是他们没有真正理解用户的需求，也没有站在用户角度看待软件。如果用户不满意软件的功能和界面，那么开发人员将被迫重新开发。重新开发的代价显然要比修改Bug大得多。如果软件企业能够真正重视并且下功夫提升“需求分析”和“用户界面设计”的能力，通常会显著地提升软件生产率和客户的满意度。好的用户界面应具备的特性可使用性使用的简单性用户界面中的术语标准化和一致性拥有HELP帮助功能快速的系统响应和低的系统成本用户界面应具有容错能力灵活性能够按照用户的希望和需要，提供不同详细程度的系统响应信息与其它软件系统应有标准的界面用户可以根据需要制定和修改界面方式为使用户界面具有一定的灵活性，需要付出代价，而且有可能降低软件系统的运行效率。适度复杂性和可靠性用户界面的规模和组织的复杂程度就是界面的复杂性。在完成预定功能的前提下，应使用户界面越简单越好。但不是把所有功能和界面安排成线性序列就一定简单。用户界面的可靠性是指无故障使用的间隔时间。用户界面应能保证用户正确、可靠地使用系统，保证有关程序和数据的安全性。界面美观性界面美的内涵优美的界面可以令人赏心悦目，界面的美不仅是它的外观漂亮，更在于其丰富的内涵。界面美的内涵在于其有效表达思想的能力，这也是衡量美的一种标准，它的主要构成因素是：

合适性、吸引力和风格。图形用户界面的主要思想桌面隐喻：是指在用户界面中用人们熟悉的桌面上的图形清楚地表示计算机可以处理的能力。图形用户界面中的图例可以代表对象、动作、属性或其他概念。图形具有一定的文化和语言独立性，可以提高搜索目标的效率。隐喻的分类：直接隐喻：隐喻本身就带有操纵的对象——如Word绘图工具中的图标工具隐喻：代表所使用的工具——如存盘操作的磁盘图标、打印操作的打印机图标等过程隐喻：通过描述操作的过程来暗示该操作——如Word中的撤销和恢复图标。图形用户界面的主要思想隐喻的主要缺点：需要占用屏幕空间难以表达和支持比较抽象的信息晦涩的隐喻不仅不能增加可用性，反而会弄巧成拙。不好的隐喻图形用户界面的主要思想所见即所得（WhatYouSeeIsWhatYouGet，WYSIWYG）在WYSIWYG交互界面中显示的用户交互行为与应用程序最终产生的结果是一致的，人们可以对于最后的输出结果有直观的认识。弊端：如果屏幕的空间或颜色的配置方案与硬件设备所提供的配置不一样，在两者之间就很难产生正确的匹配。完全的WYSIWYG也可能不适合某些用户的需要。图形用户界面的主要思想直接操纵：是指可以把操作的对象、属性、关系显式地表示出来，用光笔、鼠标、触摸屏或数据手套等指点设备直接从屏幕上启动命令与数据的过程。直接操纵的特性：直接操纵的对象是动作或数据的形象隐喻形象隐喻应该与其实际内容相近，使用户能通过屏幕上的隐喻直接想象或感知其内容。用指点和选择代替键盘输入有两个优点：一是操作简便，速度快捷；二是不用记忆复杂的命令。界面设计的三大原则以用户为中心将界面置于用户的控制之下减轻用户的记忆负担良好的直觉特性保持界面的一致性1.用户中心用户应该总是感觉在控制软件而不是感觉被软件所控制用户--而不是计算机或软件--开始动作采取交互式和易感应的窗口从用户的视角出发，使用用户的语言后台运行长进程时，保持前台的交互性容忍用户探索中出错提供用户自定义设置2.减轻记忆负担用熟悉的隐喻为用户的任务提供直接而直观的界面唤醒用户的知识和经验，一看就知道支持用户“认知”而不是记忆与常见软件保持一致3.一致性一致性为用户提供熟悉可预测的环境用户能够将已有的知识应用到新的任务中，从而更快地接受新事物统一的命令术语一致的操作环境一致的功能和响应一致的隐喻界面设计的一般详则交互布局色彩图标联机帮助错误处理1交互的设计原则尽量提供对所有功能的键盘访问尽量提供对所有功能的鼠标访问不可逆的操作要求用户确认耗时的操作给出反馈可视的状态转换反馈鼠标右键仅用于快捷菜单快捷键的习惯一致性避免水平滚动条2版式布局的设计原则平衡原则整齐有序、整体平衡协调原则划分一致的功能区对比原则预期原则屏幕上所有对象的动作可预期顺序原则根据需要排列对象显示的顺序示例分析专业软件一般都要提供反馈操作信息的窗口区域。页面被用户关注的程度不同3色彩的设计原则合理利用颜色，实现内容与形式的协调采用柔和中性的颜色，支持用户定制颜色设计一致尽量用单色一屏的色彩种类少于7种对象颜色的选取符合习惯（如果有的话）重要对象选取醒目颜色为区分对象，首先按亮度、其次按颜色背景色选取浅色调暖色调接近观众，冷色调远离观众图标的设计图标是可视地表示实体信息的简洁、抽象的符号。设计图标时应该着重考虑视觉冲击力，要使用简单的颜色，利用眼睛对色彩和网点的空间混合效果，做出精彩图标。设计图标时须遵守的原则和方法：图标的图形应该和目标的外形相似，尽量避免过于抽象。可在图标中附加上简要的文本标注，使用户明确图标的含义。设计图标应尽可能简单（三维的图标虽然醒目但也能使人分心），符合常规的表达习惯，保持图标含义的前后连贯。5联机帮助的设计原则对用户的操作随时给出必要的帮助提供帮助信息而不是数据帮助信息的内容简洁易懂帮助信息的形式包括图表、动画和声音等帮助信息有统一的风格为不同类型的用户提供不同的帮助功能帮助不能影响用户的工作任务，联机帮助结束后应该返回用户的工作任务6错误处理的设计原则检测用户的错误，并提供简明的错误处理手段报错信息以可视化的形式出现报错信息语气友善报错信息尽可能准确报错信息简洁明了、通俗易懂报错信息风格一致提供保护功能和恢复(Undo)功能示例分析软件人员经常编写出“劣质”的消息框，例如措词生硬、幼稚、蹩脚，甚至有文字、语法错误；消息文本、图形标志和命令按钮在语义上不一致。

好的差的7按钮的设计按钮的设计原则：具有交互性，应该有3到6种状态效果：点击时的状态鼠标放在上面但未点击的状态点击前鼠标未放在上面时的状态点击后鼠标未放在上面时的状态不能点击时的状态独立自动变化的状态按钮应具备简洁的图示效果，应能够让使用者产生功能上的关联反应。属于一个群组的按钮应该风格统一，功能差异大的按钮可以有所区别。8屏幕布局的设计屏幕显示信息是由计算机系统向用户提供的反馈信息，屏幕显示界面的设计应能展现这些信息。设计屏幕布局时应该使各功能区重点突出，应遵循如下几条原则：平衡原则：屏幕上下左右平衡预期原则：屏幕上所有对象处理一致化，使对象的操作结果可预期经济原则：提供足够信息量的同时要注意简明、清晰顺序原则：按照需要排列顺序规则化：画面应对称，显示应尽量统一规范9菜单界面的设计菜单在图形界面的应用程序中使用得非常普遍，是软件界面设计的一个重要组成方面，描述了一个软件的大致功能和风格。菜单中的选项在功能上与按钮相当，一般具有下列一种或几种类型的选项：命令项、菜单项和窗口项。菜单的结构一般有：单一菜单线状序列菜单树状结构菜单网状结构菜单10填表输入界面的设计在处理大量相关数据的场合下，需要输入一系列的数据，这时填表输入界面是最理想的数据输入界面。填表输入界面的特点：有明确的提示，使用户可以不需要学习、训练，