第11讲 人机交互技术精

1、n谁来设计软件的用户界面？谁来设计软件的用户界面？n用户眼中的好软件用户眼中的好软件n好的用户界面应具备的特性好的用户界面应具备的特性n界面设计美学界面设计美学n用户界面的主要思想用户界面的主要思想n界面设计的原则界面设计的原则n“好好”的软件意味着的软件意味着“实用、易用、美观实用、易用、美观”n如果软件的功能不实用（不能为用户解决问题），那么如果软件的功能不实用（不能为用户解决问题），那么不管该软件是否易用和美观，用户一般都不愿意购买该不管该软件是否易用和美观，用户一般都不愿意购买该软件，除非用户没有选择余地。软件，除非用户没有选择余地。n如果两个软件的功能和价格都相似，那么用户会挑选更如

2、果两个软件的功能和价格都相似，那么用户会挑选更加易用的那个软件。加易用的那个软件。n如果两个软件的功能、价格、易用性都差不多，那么用如果两个软件的功能、价格、易用性都差不多，那么用户会选择更加美观的那个软件。户会选择更加美观的那个软件。n谁来评价谁来评价“好或差好或差”n用户才真正有资格说软件用户才真正有资格说软件“好或坏好或坏”。如果用户对软件。如果用户对软件很不满意，开发人员不要有逆反情绪：从哪里找来的笨很不满意，开发人员不要有逆反情绪：从哪里找来的笨蛋用户！蛋用户！ 软件行业很少发生那么感动人的场景：软件行业很少发生那么感动人的场景：用户热切地握着开发人员的手，连声称用户热切地握着开发人

3、员的手，连声称赞赞“你们开发的软件真是好用、真是漂你们开发的软件真是好用、真是漂亮啊亮啊”。可是我们看到的大多是相反的。可是我们看到的大多是相反的场景：用户满腹牢骚，开发人员垂头丧场景：用户满腹牢骚，开发人员垂头丧气。气。n开发机构宣扬开发机构宣扬“以客户为中心以客户为中心”，但是却撇开客户只顾，但是却撇开客户只顾忙碌地开发软件，做出客户不会用的东西。忙碌地开发软件，做出客户不会用的东西。n很多软件开发人员不能够一次性地完成某些开发任务，很多软件开发人员不能够一次性地完成某些开发任务，主要原因不是技术水平低下，而是他们主要原因不是技术水平低下，而是他们没有真正理解用没有真正理解用户的需求户的需

4、求，也没有站在用户角度看待软件。如果用户不，也没有站在用户角度看待软件。如果用户不满意软件的功能和界面，那么开发人员将被迫重新开满意软件的功能和界面，那么开发人员将被迫重新开发。重新开发的代价显然要比修改发。重新开发的代价显然要比修改Bug大得多。大得多。n如果软件企业能够真正重视并且下功夫提升如果软件企业能够真正重视并且下功夫提升“需求分需求分析析”和和“用户界面设计用户界面设计”的能力，通常会显著地提升软的能力，通常会显著地提升软件生产率和客户的满意度。件生产率和客户的满意度。n能够按照用户的希望和需要，提供不同详能够按照用户的希望和需要，提供不同详细程度的系统响应信息细程度的系统响应信息

5、n与其它软件系统应有标准的界面与其它软件系统应有标准的界面n用户可以根据需要制定和修改界面方式用户可以根据需要制定和修改界面方式 为使用户界面具有一定的灵活性，需要付出代为使用户界面具有一定的灵活性，需要付出代价，而且有可能降低软件系统的运行效率价，而且有可能降低软件系统的运行效率n适度复杂性和可靠性适度复杂性和可靠性n用户界面的规模和组织的复杂程度就是界用户界面的规模和组织的复杂程度就是界面的复杂性。面的复杂性。n在完成预定功能的前提下，应使用户界面在完成预定功能的前提下，应使用户界面越简单越好。但不是把所有功能和界面安越简单越好。但不是把所有功能和界面安排成线性序列就一定简单。排成线性序列

6、就一定简单。n用户界面的可靠性是指无故障使用的间隔用户界面的可靠性是指无故障使用的间隔时间。时间。n用户界面应能保证用户正确、可靠地使用用户界面应能保证用户正确、可靠地使用系统，保证有关程序和数据的安全性。系统，保证有关程序和数据的安全性。n界面美观性界面美观性 优美的界面可以令人赏心悦目，界面的美不仅是它的外观漂亮，更在于其丰富的内涵。 界面美的内涵在于其有效表达思想的能力，这也是衡量美的一种标准，它的主要构成因素是： 合适性、吸引力和风格。 n桌面隐喻：桌面隐喻：是指在用户界面中用人们熟悉的是指在用户界面中用人们熟悉的桌面上的图形清楚地表示计算机可以处理的桌面上的图形清楚地表示计算机可以处

7、理的能力。能力。n图形用户界面中的图例可以代表对象、动作、属图形用户界面中的图例可以代表对象、动作、属性或其他概念。图形具有一定的文化和语言独立性或其他概念。图形具有一定的文化和语言独立性，可以提高搜索目标的效率。性，可以提高搜索目标的效率。n隐喻的分类：隐喻的分类：n直接隐喻：隐喻本身就带有操纵的对象直接隐喻：隐喻本身就带有操纵的对象如如Word绘图工具中的图标绘图工具中的图标n工具隐喻：代表所使用的工具工具隐喻：代表所使用的工具如存盘操作的磁盘如存盘操作的磁盘图标、打印操作的打印机图标等图标、打印操作的打印机图标等n过程隐喻：通过描述操作的过程来暗示该操作过程隐喻：通过描述操作的过程来暗示

8、该操作如如Word中的撤销和恢复图标。中的撤销和恢复图标。n隐喻的主要缺点：隐喻的主要缺点：n需要占用屏幕空间需要占用屏幕空间n难以表达和支持比较抽象的信息难以表达和支持比较抽象的信息n晦涩的隐喻不仅不能增加可用性，反而会晦涩的隐喻不仅不能增加可用性，反而会弄巧成拙。弄巧成拙。n所见即所得（所见即所得（What You See Is What You Get，WYSIWYG）n在在WYSIWYG交互界面中显示的用户交互行为与交互界面中显示的用户交互行为与应用程序最终产生的结果是一致的，人们可以对应用程序最终产生的结果是一致的，人们可以对于最后的输出结果有直观的认识。于最后的输出结果有直观的认识

9、。n弊端弊端：n如果屏幕的空间或颜色的配置方案与硬件设备所提供如果屏幕的空间或颜色的配置方案与硬件设备所提供的配置不一样，在两者之间就很难产生正确的匹配。的配置不一样，在两者之间就很难产生正确的匹配。n完全的完全的WYSIWYG也可能不适合某些用户的需要。也可能不适合某些用户的需要。 n直接操纵：是指可以把操作的对象、属性、直接操纵：是指可以把操作的对象、属性、关系显式地表示出来，用光笔、鼠标、触摸关系显式地表示出来，用光笔、鼠标、触摸屏或数据手套等指点设备直接从屏幕上获取屏或数据手套等指点设备直接从屏幕上获取形象化命令与数据的过程。形象化命令与数据的过程。n直接操纵的特性：直接操纵的特性：n

10、直接操纵的对象是动作或数据的形象隐喻直接操纵的对象是动作或数据的形象隐喻n形象隐喻应该与其实际内容相近，使用户能通过屏幕上的隐形象隐喻应该与其实际内容相近，使用户能通过屏幕上的隐喻直接想象或感知其内容。喻直接想象或感知其内容。n用指点和选择代替键盘输入用指点和选择代替键盘输入n有两个优点：一是操作简便，速度快捷；二是不用记忆复杂有两个优点：一是操作简便，速度快捷；二是不用记忆复杂的命令。的命令。n按钮的设计原则：按钮的设计原则：n具有交互性，应该有具有交互性，应该有3到到6种状态效果：种状态效果：n点击时的状态点击时的状态n鼠标放在上面但未点击的状态鼠标放在上面但未点击的状态n点击前鼠标未放在

11、上面时的状态点击前鼠标未放在上面时的状态n点击后鼠标未放在上面时的状态点击后鼠标未放在上面时的状态n不能点击时的状态不能点击时的状态n独立自动变化的状态独立自动变化的状态n按钮应具备简洁的图示效果，应能够让使用者产按钮应具备简洁的图示效果，应能够让使用者产生功能上的关联反应。属于一个群组的按钮应该生功能上的关联反应。属于一个群组的按钮应该风格统一，功能差异大的按钮可以有所区别。风格统一，功能差异大的按钮可以有所区别。n屏幕显示信息是由计算机系统向用户提供的屏幕显示信息是由计算机系统向用户提供的反馈信息，屏幕显示界面的设计应能展现这反馈信息，屏幕显示界面的设计应能展现这些信息。些信息。 n设计屏

12、幕布局时应该使各功能区重点突出，应遵设计屏幕布局时应该使各功能区重点突出，应遵循如下几条原则：循如下几条原则：n平衡原则：屏幕上下左右平衡平衡原则：屏幕上下左右平衡n预期原则：屏幕上所有对象处理一致化，使对象的操预期原则：屏幕上所有对象处理一致化，使对象的操作结果可预期作结果可预期n经济原则：提供足够信息量的同时要注意简明、清晰经济原则：提供足够信息量的同时要注意简明、清晰n顺序原则：按照需要排列顺序顺序原则：按照需要排列顺序n规则化：画面应对称，显示应尽量统一规范规则化：画面应对称，显示应尽量统一规范n菜单在图形界面的应用程序中使用得非常普菜单在图形界面的应用程序中使用得非常普遍，是软件界面

13、设计的一个重要组成方面，遍，是软件界面设计的一个重要组成方面，描述了一个软件的大致功能和风格。描述了一个软件的大致功能和风格。n菜单中的选项在功能上与按钮相当，一般具有下菜单中的选项在功能上与按钮相当，一般具有下列一种或几种类型的选项：命令项、菜单项和窗列一种或几种类型的选项：命令项、菜单项和窗口项。口项。n菜单的结构一般有：菜单的结构一般有：n单一菜单单一菜单n线状序列菜单线状序列菜单n树状结构菜单树状结构菜单n网状结构菜单网状结构菜单n在处理大量相关数据的场合下，需要输入一在处理大量相关数据的场合下，需要输入一系列的数据，这时填表输入界面是最理想的系列的数据，这时填表输入界面是最理想的数据

14、输入界面。数据输入界面。n填表输入界面的特点：填表输入界面的特点： n有明确的提示，使用户可以不需要学习、训练，也不有明确的提示，使用户可以不需要学习、训练，也不必记忆有关的语义、语法规则。必记忆有关的语义、语法规则。n填表输入界面充分地利用屏幕空间。填表输入界面充分地利用屏幕空间。 n在填表输入方式中，可以充分利用上下文信息，帮助在填表输入方式中，可以充分利用上下文信息，帮助用户完成输入用户完成输入 。n举例：观察以下填表输入界面，说出修改意举例：观察以下填表输入界面，说出修改意见。见。n统一了标签和按钮的设计，使它们看起来更像控统一了标签和按钮的设计，使它们看起来更像控件；件； n所有栏目

15、的标题文本靠左对齐；所有栏目的标题文本靠左对齐； n使用灰色背景代替原有白色背景。使用浅黄色作使用灰色背景代替原有白色背景。使用浅黄色作标题行的底色，代替原有灰色；标题行的底色，代替原有灰色； n顶部的标签从右边移动到左边；顶部的标签从右边移动到左边； n底部的按钮被重新排列。底部的按钮被重新排列。 颜色设计颜色设计n以用户为中心以用户为中心n将界面置于用户的控制之下将界面置于用户的控制之下n减轻用户的记忆负担减轻用户的记忆负担n良好的直觉特性良好的直觉特性n保持界面的一致性保持界面的一致性n用户应该总是感觉在控制软件而不是感觉被用户应该总是感觉在控制软件而不是感觉被软件所控制软件所控制n用户

16、用户-而不是计算机或软件而不是计算机或软件-开始动作开始动作n采取交互式和易感应的窗口采取交互式和易感应的窗口n从用户的视角出发，使用用户的语言从用户的视角出发，使用用户的语言n后台运行长进程时，保持前台的交互性后台运行长进程时，保持前台的交互性n容忍用户探索中出错容忍用户探索中出错n提供用户自定义设置提供用户自定义设置 n用熟悉的隐喻为用户的任务提供直接而直观用熟悉的隐喻为用户的任务提供直接而直观的界面的界面 n唤醒用户的知识和经验唤醒用户的知识和经验 n支持用户认知而不是记忆支持用户认知而不是记忆 n与常见软件保持一致与常见软件保持一致 n一致性为用户提供熟悉可预测的环境一致性为用户提供熟

17、悉可预测的环境n用户能够将已有的知识应用到新的任务中，用户能够将已有的知识应用到新的任务中，从而更快地接受新事物从而更快地接受新事物 n统一的命令术语统一的命令术语n一致的操作环境一致的操作环境n一致的功能和响应一致的功能和响应n一致的隐喻一致的隐喻n交互交互n布局布局n色彩色彩n图标图标n联机帮助联机帮助n错误处理错误处理n尽量提供对所有功能的键盘访问尽量提供对所有功能的键盘访问 n尽量提供对所有功能的鼠标访问尽量提供对所有功能的鼠标访问 n不可逆的操作要求用户确认不可逆的操作要求用户确认 n耗时的操作给出反馈耗时的操作给出反馈 n可视的状态转换反馈可视的状态转换反馈 n鼠标右键仅用于快捷菜

18、单鼠标右键仅用于快捷菜单 n快捷键的习惯一致性快捷键的习惯一致性 n避免水平滚动条避免水平滚动条n平衡原则平衡原则n整齐有序、整体平衡整齐有序、整体平衡n协调原则协调原则n划分一致的功能区划分一致的功能区n对比原则对比原则n预期原则预期原则n屏幕上所有对象的动作可预期屏幕上所有对象的动作可预期n顺序原则顺序原则n根据需要排列对象显示的顺序根据需要排列对象显示的顺序示例分析示例分析专业软件一般都要提供反馈操作信息的窗口区域。n合理利用颜色，实现内容与形式的协调合理利用颜色，实现内容与形式的协调n采用柔和中性的颜色，支持用户定制采用柔和中性的颜色，支持用户定制n颜色设计一致颜色设计一致n尽量用单色

19、尽量用单色n一屏的色彩种类少于一屏的色彩种类少于7种种n对象颜色的选取符合习惯（如果有的话）对象颜色的选取符合习惯（如果有的话）n重要对象选取醒目颜色重要对象选取醒目颜色n为区分对象，首先按亮度、其次按颜色为区分对象，首先按亮度、其次按颜色n背景色选取浅色调背景色选取浅色调n暖色调接近观众，冷色调远离观众暖色调接近观众，冷色调远离观众n图标是可视地表示实体信息的简洁、抽象的图标是可视地表示实体信息的简洁、抽象的符号。符号。n设计图标时应该着重考虑视觉冲击力，要使用简设计图标时应该着重考虑视觉冲击力，要使用简单的颜色，利用眼睛对色彩和网点的空间混合效单的颜色，利用眼睛对色彩和网点的空间混合效果，做出精彩图标。果，做出精彩图标。n设计图标时须遵守的原则和方法：