人机交互--交互风格.ppt

1、2020/8/15,1,交互风格,理解交互框架 处理复杂性 交互风格,2020/8/15,2,理解交互框架,执行/评估活动周期 交互框架,2020/8/15,3,理解交互框架,框架是提供理解或定义某种事物的一种结构 我们可以用这些框架: 定义设计过程的结构 帮助我们找出在设计过程中的主要问题 帮助我们标定问题领域,2020/8/15,4,执行/评估活动周期 (EEC),Donald Norman (1990) The Design of Everyday Things 活动结构的四个部分: 目标Goals: 首先想做什么最为重要，这就是所谓目标 执行Execution: 必须执行某个活动 客观

2、因素World: 在执行活动中，人们必须考虑的客观因素 评估Evaluation: 最后，需要衡量活动执行的结果与目标之间存在的差距,2020/8/15,5,执行/评估活动周期 (EEC),2020/8/15,6,执行/评估活动周期 (EEC),目标不对活动进行详细的说明 目标和意图不必是一对一的关系 “Delete text” goal Intention that involves the Edit menu Intention that involves the Delete key 每个意图调用一系列的活动 Goal Intention Actions Execution,2020/8

3、/15,7,执行/评估活动周期 (EEC),评估结果 预知活动后的状态 解释感知的状态 评估新的状态与目标的差距 Perceive Interpret Evaluate,2020/8/15,8,执行/评估活动周期 (EEC),活动的7个过程,2020/8/15,9,执行/评估活动周期 (EEC),七个阶段形成一个循环 循环可以在任何一个点开始 某些目标是数据驱动的，当某个事件环境确定后才开始这个循环 另外一些是目标驱动的，只有当某个目标确定后才开始执行这个循环,2020/8/15,10,执行的隔阂,如何设计界面允许我们执行交互所需要的活动？ Goal = save a file Intenti

4、on = use the file menu Action = click the save option 文件菜单里面是否有save选项呢?,2020/8/15,11,评估隔阂,界面设计原则(Norman, 1990): 确定设计的功能是什么 确定哪些活动是允许的？ 确定从意图到实际活动的转换 执行相关的活动 确定系统是否在期望的运行状态 确定系统状态到解释的映射 确定系统现在处于什么状态,2020/8/15,12,交互框架,Abowd and Beale 把系统加进去扩展了EEC System (S)使用系统的内核语言（关系到系统状态的计算属性） User (U)使用用户的任务语言（关系到

5、用户状态的心理属性） Input (I)使用输入语言 Output (O)使用输出语言,2020/8/15,13,交互框架,输出,输入,核心,任务,O,I,S,U,表现,观察,定义,执行,2020/8/15,14,交互框架/ EEC,执行阶段 定义用户阐述某个目标，然后通过输入语言进行协调和连接 执行由输入语言转换成内核语言（系统将要执行的操作） 表现使用输出语言把内核语言的执行结果表示出来 评估阶段 观察用户解释屏幕上的执行结果并协调结果和目标间的关系,2020/8/15,15,处理复杂性,认知模型 映射 语意和联想距离 交互风格,2020/8/15,16,认知模型,认知模型是确定一个事情被

6、如何结构化和如何工作的逻辑和可信估计的感知再现 透明的对象暴露了他们的功能 Bicycles 不透明的对象隐含了他们的功能 Computers,2020/8/15,17,认知模型,不科学的它们往往基于猜想和近似 不完整的它们没有必要描述整个系统，仅仅是对用户相关部分的建模 不稳定的它们没有彻底的形成，在上下文环境中演化和完善 不一致的它们不是通过整体的分析得到的，许多部分可能与其它部分不协调 个人的它们是针对某个特定的个人，而不是一个适用于所有情况的普遍概念,2020/8/15,18,认知模型,与用户认知模型相协调的设计容易使用户接受 我们如何确定与用户的认知模型相关的信息呢 如果设计模型没有

7、通过清晰接口把消息传递给用户，或者是以往的经验偏离了认知模型，这样就会产生问题 网络的新用户往往把搜索引擎当作进入网站的入口,2020/8/15,19,映射,映射的概念是描述两个事物直接的联系 合适的映射可以增加交互的可用性 随意的映射 改进 自然的映射 尽可能的使用自然的映射,2020/8/15,20,语意和联想距离,语意距离 界面元素的含意与人们希望完成的工作之间的差距离 联想距离 界面元素的物理表现和他的实际的含意之间的距离,2020/8/15,21,功效,用户界面的功效可以直观的理解: 方向盘可以用来表示旋转，门铃可用用来按 这种类似的关系可以提供对于运行结果的预测，并且帮助建立可用的

8、认知模型,2020/8/15,22,功效,功效的混淆 当我们建立一个对象工作的概念恰恰不是我们假设他应该具有的方式时 文本框作为标签使用 Norman 认为功效是对象和用户之间的关系而不是对象的属性,2020/8/15,23,功效,功效可能是针对某些人也可能是针对另外人的 为盲人设计的就不适合于普通人 功效可以用来指导可用性设计 设计者必须确定用户当前需要的功效与用户的期望之间不存在矛盾,2020/8/15,24,交互方式,Command Line命令行 Menu-Based Interface基于菜单的界面 Form Fill-In填表界面 Question and Answer问答界面 D

9、irect Manipulation直接操纵界面 Metaphors隐喻 Web NavigationWeb导航 Three-Dimensional Environments三维环境 Zoomable Interface可伸缩的界面 Natural Language自然语言界面,2020/8/15,25,交互风格- 命令行,命令行界面具有较高的效率和强大的功能 许多命令简洁 快速高效 命令可以同时应用多个对象 快速输入 某些命令有多个参数可以被设置和修改 精确和灵活,2020/8/15,26,交互风格- 命令行,命令行和 执行评估活动循环EECA 意图形成、动作的表述、执行过程十分复杂 对计算

10、机的内部处理需要相当精确的认知模型 命令行与交互框架 将用户的任务语言翻译成输入语言的过程需要内核语言的知识 输出语言对新用户来说比较困惑，尤其是缺乏形象的反馈,2020/8/15,27,交互风格- 命令行,命令行语言和联想距离 因为只能提供命令行窗口的表示，除了包含字符打印方式的功能效过外，没有提供其他功能性的提示,2020/8/15,28,交互风格- 命令行,优点: 适合重复的命令 对于专家用户是有优势的 提供直接存储系统的功能 有效而强大 没有以下图形控制阻塞 较少的视觉复杂性 占用系统内存少,2020/8/15,29,交互风格- 命令行,缺点: 较难记忆 陡峭的学习曲线 高错误频率 强

11、烈依赖与记忆 使初学者信心丧失,2020/8/15,30,交互风格- 菜单界面,菜单驱动的界面为用户呈现顺序的层次功能列表菜单 文本的 用数字健进行选择 图形化的 用箭头和指点设备进行选择,2020/8/15,31,交互风格- 菜单界面,菜单是建立在认知过程中而不是通过记忆来操作 不需要记忆命令 命令在可能的选择列表中选择 列表提供了约束 对小屏幕要适当 (iPod),2020/8/15,32,交互风格- 菜单界面,菜单界面与执行评估活动循环EEAC 菜单约束可以帮助用户形成合适的意图和说明合适活动序列,2020/8/15,33,交互风格- 菜单界面,联想距离 菜单选择建立了较小的联想距离 认

12、知模型 菜单结构直接影响到用户的认知模型 功效 菜单元素提供功效,2020/8/15,34,交互风格- 菜单界面,菜单类型 SingleSequential Hierarchal Star networkWeb network,2020/8/15,35,交互风格- 菜单界面,优点: 低的记忆需求 容易理解 容易消除错误 对初学者是适合的 缺点: 严格、不灵活的导航 对于大规模的菜单导航是低效的 占用过多的屏幕资源 专家用户的低效性,2020/8/15,36,交互风格- 填表界面,类似于菜单界面，用屏幕展现了界面信息 与菜单界面的不同 主要是聚集信息而不是遍历树形的层次结构 通过线性的行为来获取

13、信息,2020/8/15,37,交互风格- 填表界面,填表界面能够使用户始终熟悉表单的长度和结构 多个表单可以用下面方式表现： 单个滚动的屏幕 多个连接页 表单元素必须逻辑的分组 包括 “You Are Here” 标识,2020/8/15,38,交互风格- 填表界面,表单的填充内容是清晰和完整无误的 用户必须理解需要什么样的数据和用什么样的数据格式 日期信息格式 1/29/2005, 29/1/2005, or January 29, 2005?,2020/8/15,39,交互风格- 填表界面,优点: 不需要太多的记忆 容易理解 在有限的空间里可以汇集大量的信息 为输入的信息提供了一个上下文

14、 缺点: 需要有效的输入格式检查 需要熟悉界面的控制 乏味的错误修改过程,2020/8/15,40,交互风格- 问答,问答界面也称作向导 对专家用户有限制 对初学者很容易 他们可以不知道所需要的信息,用户必须能够进行回退操作，同时不能影响目前机器的状态,2020/8/15,41,交互风格- 问答,Microsoft Add Network Place Wizard (a) Add Network Place wizard. (b) Select a service provider. (c) Address of the network place.,2020/8/15,42,交互风格- 问答

15、,优点: 不需要太多的记忆 容易理解 简单的线性的表示 对初学者使用容易 缺点: 需要用户提供合法性验证 需要熟悉用户的控制 乏味的错误修正,2020/8/15,43,交互风格- 直接操纵,Ben Shneiderman (1982) 请求的对象、行为与有意义的隐喻之间有很大的联系 物理操作或按钮的操作代替复杂的语法 快速，渐进、可逆的操作对于感兴趣的对象来说都是可见的,2020/8/15,44,交互风格- 直接操纵,直接操纵的三个阶段 - Cooper, Reimann (2003) 自由阶段在用户未做任何操作之前屏幕的结果 捕获阶段用户采取选择或拖拉操作之后屏幕的结果 结束阶段用户操作完成

16、之后的屏幕的结果,2020/8/15,45,交互风格- 直接操纵,直接操纵 和 EEAC 各种可能的意图是连贯的 用户对同一活动有多种不同的选择 初学者可能被复杂的选择序列迷惑 大多数的操作可以考虑各种不同的操作序列 用户可以双击其相应的文件图标，这样就可以打开相应的应用程序。 用户可以在图标上点击右键并选择打开选项。 用户可以左键点击其文件图标，并在文件菜单中选择打开选项。 用户可以拖放文件图标到应用程序的图标上,2020/8/15,46,交互风格- 直接操纵,优点: 容易学习 不需要太多的记忆 容易undo 对用户的作用快速的反馈 使用户可以使用空间的暗示 对初学者容易 缺点: 不能进行自

17、我注释 占用大量屏幕资源 高图形系统需求,2020/8/15,47,交互风格- 隐喻,GUI利用现实世界中对象的可视化关系，帮助用户理解复杂的操作过程(metaphors隐喻) 人们可以用隐喻描述一个复杂的概念和过程 现实世界中的对象的功效也可以转化称隐喻世界中的直接操作 按钮的突出显示 当前的GUI使用哪些隐喻? 桌面，文件夹,2020/8/15,48,交互风格- 隐喻,Microsoft Windows XP Apple OS X,2020/8/15,49,交互风格- 隐喻,隐喻的含意必须与现实世界中的含意相一致,不能提供人们希望的行为的隐喻引起人们的混要和挫折 Macintosh tra

18、shcan,2020/8/15,50,交互风格- 隐喻,不能刻意的去使用隐喻,隐喻潜在的问题 过渡使用隐喻 当工具与年世界中的某种事物不存在紧密相关性时，隐喻本身就会存在其局限性 不清晰的隐喻 隐喻带有事物内在的含义和联系,2020/8/15,51,交互风格- Web导航,两种基本的交互风格 基于链接的导航 容易产生理解的联想的距离 模糊的链接标签可以产生评估的距离 搜索 容易产生理解距离 不合适的搜索引擎算法导致执行的距离 好的架构的搜索引擎对于认知模型的发展会有一定的优势,2020/8/15,52,交互风格- 3D环境,3D交互在客观世界是自然的一种交互 3D 环境在游戏中是非常普通的 强

19、大的 3D环境对处理器要求是敏感的,2020/8/15,53,交互风格- 3D环境,3D 导航 涉及两种类型的运动 平移 在一个平面上运动 旋转 绕一个轴的运动,Yaw,Pitch,2020/8/15,54,交互风格- 3D环境,Web3D 使用向量描述减少文件的大小 Virtual Reality Modeling Language (VRML) 使用多边形参数 Transparency（透明） Texture maps（纹理映射） Shininess（光照） X3-D is XML based - Web3D.org 提供很好的灵活的控制,2020/8/15,55,交互风格- 3D环境,Desktop 3D 当前的GUI 2D是占主导地位的 在2D屏幕上的展现的3D环境是很难漫游的 三维漫游是十分困难的并且容易陷入迷惑中,2020/8/15,56,交互风格- 可缩放的界面,ZoomWorld (Jeff Raskin) is based on the zooming interface paradigm (ZIP) Zoom