交互设计：第2讲 了解用户

交互设计

信息架构任务流程结构形式信息可视化Web界面软件界面手机界面功效体验物理负荷认知负荷记忆负荷视觉负荷美舒服刺激……全息界面投影界面手势、姿态功能分配技术实现自然交互实体交互GUINUIPage04“情理之中，意料之外”应具备的能力和知识

设计思维设计表达设计心理学

人机工程

实验设计

统计计算逻辑思维

社会学

计算机能力

可用性测试工业设计方法交叉学科交互设计师Page02用户研究员Page02视觉设计师Page02Page02产品经理用户研究交互设计视觉设计热词统计分析Page02产品经理用户研究员经过整理和去重将四个职位的技能关键字合并为74个技能，通过聚类分析，将技能生成职位技能树。交互设计师视觉设计师Page02matlabmatlabmatlabmatlab用户研究员视觉设计师产品经理交互设计师▪需求分析、可用性分析与评估、用户研究•用户研究分析、设计心理学、

人机实验、数据统计分析、可用性测试•软件SAS、SPSS、RStudio、Kxen、SAP、眼动仪用户研究▪色彩设计，布局设计，图标设计、风格设计、造型设计。▪素描、色彩、三大构成、视觉传达、设计符号学、•软件Photoshop、Illustrator、Flash、Dreamweaver视觉设计▪产品战略和发展的规划需求的挖掘和分析推动产品目标的实现产品定义及设计、沟通▪用户研究、品牌战略▪软件：SPSS、PPT产品经理信息架构设计、任务分析、流程图、原型设计、评估测试、设计整合▪交互设计、web用户界面设计、设计方法、系统设计、用户界面设计与评估▪软件：Axure、PPT和AE、熟悉Css、Javascript,HtmlPleaseEnteryourtitlePage02视觉表现和构型能力-审美（素描、色彩、构成……）逻辑分析能力数据处理能力一定的编程能力

创新设计整合设计评估沟通能力设计知识美术知识

心理学知识计算机知识社会学知识

设计学知识交互知识发散思维视觉设计逻辑思维用户研究设计思维界面设计交叉学科Page02从业人员知识结构设计表达课程（素描、色彩、构成、视觉传达、设计表现、广告设计）

设计理论、设计方法（设计方法、设计史、设计基础、系统设计）

工程图学产品结构设计产品造型材料与工艺

产品开发设计机械产品创新设计产品概念设计综合造型基础Css、HtmlJavascript,Unity3DWeb用户界面设计移动用户界面设计游戏界面设计

统计分析设计心理学可用性测试交互设计理论人机工程

用户研究度量与评估方法JAVA数据结构数据库技术与应用计算机图形学计算机网络基础新技术概论单片机原理电路基础机电一体化基础机械设计基础计算机辅助设计①计算机辅助设计②数字化设计与成型Page03北京邮电大学课程体系可视化软交互可感化硬交互CMU人机交互课程设计InteractionDesignFundamentals交互设计基础涵盖了基础课，包括布局，版式，色彩，素描，学生将熟练掌握这些技能，并且通过课程作业练习设计和表达能力Interaction

Design

Studio交互设计探讨交互和界面设计问题。本课程将重点放在交互设计过程，包括基本设计原理，信息架构和导航，头脑风暴方法、快速原型构建DesigningOnlineCommunities在线社区设计（网页设计）IntroductiontoProduct

Design产品设计MobileServiceInnovation移动服务创新设计HCIMethods人机交互方法HCIProcessandTheory人机交互过程和理论人机交互研究性质课程，探索的典型的HCI跨学科研究过程和方法。本课程将项目为导向，让学生研究与项目有关的主题Page06User-CenteredResearchandEvaluation用户为中心的研究和评估SocialWeb:Content,Communities,andContext社交网络：内容，社区和语境ApplicationsofCognitiveScience认知科学应用HumanFactors人因工程CMU人机交互课程设计用研（心理学、社会学）Page06教材主要参考书[1]人机交互：以用户为中心的设计与评估AlanDixJannetFinlay著；蔡利栋等译；电子工业出版社；[2]AboutFace3交互设计精...作者：（美）库伯，刘松涛

等译出版社：电子工业出版社；[3]

细节决定交互设计的成败张亮电子工业出版社。2009.3[4]产品设计和用户体验马化腾[5]DesigningInterfaces中文版，译者:蒋芳作者:JeniferTidwell出版社:

电子工业出版社；

[6][美]DougA.Bowman

等著，张风军等译，三维用户界面——理论与实践；

电子工业出版社;第2讲了解用户

交互设计——产品和系统行为的设计

面向行为的设计——处理并满足用户目标——目标导向设计关注与描述“可能的用户行为”，

定义“系统如何配合与响应”这些用户行为。1.了解人的局限性身体的局限性、精神的局限性

根据人类的能力和缺点来设计人机界面，不仅能帮助用户完成工作，而且能使他成为一个愉快和高效的人。

你不可能设计一个界面，要求用户同时操作相隔3米的两个开关。

人机工程学指导我们设计那些和我们有物理接触的产品——更关注尺度的设计。

1.1人的生理特性研究一般相信人类从外界所获得的信息有近80%是通过眼睛得到的.到目前为止还没有任何一个巨型机系统或超级并行计算机系统或网络工作站机群的认知速度与能力能与人的视觉系统相匹敌人的视觉系统是非常敏感和严格的，任何不满足物理学或光学定律的运动视景，任何同步不好的视频序列都会被轻而易举地发现，也都会对视觉系统带来额外的刺激

视觉感知的特点

1.1.1视觉的局限性1.1.1视觉的局限性视敏度、暗适应视错觉莱亚错觉大小恒常性艾宾豪斯错觉1.1.1视觉的局限性对比敏感度

颜色感觉深度知觉视觉搜索：序列、显著性

预期1.1.1视觉的局限性视敏度、暗适应设计视觉搜索我们对特征的表征注意比对特征缺失的注意要更有效(容易看到有的,不容易注意到无的).用户在打开邮箱时，注意首先集中在优先级高（重要且未读）的邮件上，避免了一些广告邮件垃圾邮件对注意的干扰普通邮箱中邮件是按日期排列的，用户打开邮箱时，往往要在大量的邮件中寻找所需查看的邮件，无法迅速将注意集中在所需邮件上感知F型浏览行为（1）总注视次数（频率）

（2）平均注视驻留时间：（3）注视点序列：（4）第一次到达目标兴趣区的时间（5）每个感兴趣区域的凝视比率（时间比）：被试眼睛注视特定显示元素(设计者感兴趣区域)的时间比例。

（6）每个感兴趣区域注视点数

注视次数越多，表明低绩效的搜索，可能源于显示元素的糟糕的布局。反映的是提取信息的难易程度。注视点在兴趣区之间的转换，能够度量用户设计布局的合理性。用户设计布局合理性度量的一个重要指标。驻留时间反映信息提取的难度,频次反映显示区域的重要性。反映元素的重要性,越重要的元素则有更多频次的注视。视觉搜索有特色的小应用乒乓球运动员发球落点判断过程中视觉搜索的眼动特征不同水平排球运动员对视野中央和外周信息加工的眼动规律新驾驶员和熟练驾驶员视觉搜索模式比较研究Web页面视觉搜索与浏览策略的眼动研究多目标视觉追踪的注意策略及其眼动模式不同认知风格视觉搜索空间不对称性的眼动研究交通环境及驾驶经验对驾驶员眼动和工作负荷影响的研究项目突显方式对视觉搜索策略的影响很多发明都来自于心智上的帮助而不是物理上的追求；人类往往对精神上的局限性视而不见；必须依靠细致的实验和观察来发现人类心智能力的边界。如：你不可能要求一个普通的用户能在5秒内心算出两个30位数相乘的结果

1.2认知的局限性任何人不可能一秒钟读1000个字，想Y的时候不能想X

三里核岛的事故

经过几亿年的进化，人类对于所熟悉的自然环境具有极为敏锐的感觉，对于环境的变化具有极为复杂的反馈机制。人类的视觉、听觉、触摸、前庭感觉(运动和重力觉)、整体位置及躯体感觉（皮肤压力）等等部分作为整个集成系统的一部分而工作，它们在反馈机制的作用下互相制约，互相协调，从而使人可以在日常生活中能够感知事物和适应环境的变化。人感知能力中的集成性质(感知融合)

例如，当一个排球向你飞来时，你可能一低头躲过去，也可能一伸手把它接住。在这里，视觉、听觉、触觉和运动觉联合作用才能使你能够主动地或下意识地完成这一连串的工作。当设计一个“接排球”的计算机环境，你不仅要考虑如何产生一个排球由远到近飞行的立体图象，还要考虑排球接触到手或飞过头顶时的声音，以及球接触到手的一瞬间球对手产生的冲力、球对手的反作用力与手抓球作用力的合力下球的运动状态的改变(被手抓住或反弹出去)。任何一个环节做不好，用户都会觉得不自然，都可能会使用户产生虚假感。感知融合的例子

认知模型1.2.1注意

办公室附近大厅的荧光灯烦人的嗡嗡声，但若非如此你根本听不到它们。声音就在那里，就像一盘录好的音带，即便我没有注意到其存在的时候它也在那里。1.2.1注意如果你到一个房间中寻找一个放错了地方的东西，即便它就在眼皮底下你也有可能视而不见。

因为它永远都不会是你的关注点。

这个世界上所有你所感知的东西当中，你正在集中精力所在的最多只能有一个实体，无论它是一个对象、一个特征、一个记忆，还是一个概念，这就是你的关注点。1.2.1注意在人机系统中,许多事故的发生都可以从注意上找原因.例如：飞行员在追击敌机时可能由于没有注意到高度表指示的变化而发生毁机事故;

汽车司机可能由于只顾前方道路变化而没有注意到侧旁情况而碰到路旁的行人或车辆;

一个打字员会由于与人谈话而打错了字,等等.

注意也被认为是人的信息处理的一个瓶颈注意主要从三个方面对信息处理过程发生影响:即选择性,集中性和注意分配

既然有选择,就必然有漏失。原则：

1）要选择恰当,使取样的信息正好是所需要的；

2）注意对象的最佳选择或最佳取样,就是以最小的代价得到最大的价值.

例如：控制室或控制台上成千上万的信息显示器

1).选择性注意

在现实生产中,注意取样受多种主客观因素的影响.信息源刺激的物理特点,如刺激的数量,强度,作用方式,以及信息源所处的环境条件等,是影响注意选择的客观因素.

那些位于视野中央的明亮的,响亮的,动态的或具有其他突出特点的刺激,一般容易引人注意,容易成为注意选择的对象.

1).选择性注意选择性注意——反应时什么情况下需要吸引用户的注意力？新的消息到达时状态的改变提醒让用户看出当前的界面处于哪种模式？当出错时1).选择性注意吸引用户注意力的手段使用视觉手段颜色、字体、显示位置、闪烁和动画采用声音

振动、警笛、鸣叫1).选择性注意置于一侧2).注意的集中

集中注意的加工要求全部心理活动参加，有很高的紧张性，因此注意不可能同时指向于两个不同方向。

“使左手画方，右手画圆无一时俱成”，其结论为“一心不两用，则手不并运也”人的注意探照灯D2).注意的集中

我在想Y的时候不能想X。—Chris，电视剧NorthernExposure中的一个角色，1994年10月31日“当一个人深深陷入某个单一的信息序列的时候，其他事件将被排除在意识之外。”——BernardBaars

1972年12月的一起飞机坠毁事故就是一个惨痛的例子。。

关注点的单一性

专注于某项任务或者某个问题会减弱一个人改变其关注点的容易程度。

界面应该设计为：仿佛用户会专注于任务上而不理睬你与他的交流。

计算机的使用充满了压力和困难，用户不得不专注于控制计算机系统，因而注意力将从任务的完成本身转移开来。我们的目标是将用户的注意力留在所要完成的任务上。

发掘单一关注点

设计师发掘了这一特点。好的设计师善于将观众的注意力集中到一只手上，此时另一只手甚至不用遮住。

Cat软件发掘了这一特点。当用户再次载入时，Cat立即显示保存的上次的屏幕截图，当用户对着屏幕思考下一步该做什么的时候，Cat完成了载入过程。研究问题揭示人们如何有效地选择一类刺激而忽略另一类刺激选择的具体过程减少用户的等待感广告关注度与观察页面总时长每一项认知活动都需要占用和消耗一定认知资源，当认知任务所需资源之和不超过总资源，注意协调和分配才能同时进行眼动数据——整页与分页的广告关注度比较中国移动T-PhoneIPhone

注意的分配是指人把自己的注意指向于两种或两种以上的对象或活动上的注意特征。3)注意的分配

教师一边讲课，一边还能观察学生听讲的情况；操纵机械的工人，一边观察仪表，一边控制和调节操作，有时还能注意周围环境的变化等。

一边口诵一首熟悉的诗,一边手写另一首熟悉的诗,是可以做到的。还有试验证明,在控制双手调节器的动作异常熟练以后，被试在控制双手调节器的同时，也可以进行心算。

并发任务的执行

走路是自动的。（什么叫自动的？就是想都不用想的）

吃东西是自动的。

所以你可以一边走路一点吃东西。

看英文书籍不是自动的。

但你仍然可以一边走路一边吃东西一边看英文书籍。

思考数学问题不是自动的。

然而你不可能同时走路，吃东西，看英文书籍，还去思考数学问题。

“你怎么可以同时思考和击球？”——棒球明星YogiBerra

——当你的任务当中最多有一个不是自动的时候，你就真的达到并发了。

——当你同时完成两项任务时，而且这两项任务都不是自动的，则你在每项任务上的效率都会下降。干涉

注意分配有不同的水平，它取决于同时并进的几种活动的性质、复杂程度以及人对活动的熟悉或熟练程度等条件。当同时进行的几种活动复杂或难度越大时，注意分配就越困难。在智力和运动两种活动同时进行时，智力活动的效率比运动活动的效率有更大程度的降低。同时进行两种智力活动，则注意分配的困难更大一些。在影响注意分配的各种因素中，对活动的熟练程度起作用最大。

分配注意的原则：首先是在同时进行的两种活动中，必须有一种活动达到了相对“自动化”的程度，即不再需要更多的注意，这样人就能把注意集中在比较生疏的活动上。其次，使同时进行的几种活动之间建立一定的联系，或通过训练使复杂的活动形成一定的反应系统，这样注意分配也就比较容易了。

1.2.2记忆

重复外界信息注意输入

遗忘遗忘可能再现终生

(信息丢失)遗忘不忘瞬时记忆短时记忆永久记忆长时记忆长时记忆记忆的模型瞬时记忆

瞬时记忆是在各感觉器官的后面,贮存人感觉到的信息,所以也被称为感觉信息存储.瞬时记忆是最短暂的记忆,保持时间一般以毫秒计.储存时间大约为0.25秒到2秒感觉记忆是记忆系统的开始阶段以刺激的物理性质进行编码信息在听觉存储内可保留的时间要明显的长些

短期记忆

指信息一次呈现后，保持时间在一分钟左右的记忆，储存时间大约为5秒到2分钟短时记忆是感觉记忆和长时记忆的中间阶段主要以语音形式编码短期记忆的容量也是非常有限的.1955年,美国著名心理学家米勒写了一篇著名的文章<<奇妙的7>>,在文中,他提出人的短期记忆的容量大约是7个元素左右.7±2若过分要求短期记忆就会加重人的心理负荷,造成人为差错.因此设计人机系统时应对人的短时记忆的特点多加考虑.

储存在短期记忆中的信息如不被复述,就会很快遣忘.对这个问题,有几种解释.

一种解释认为,记忆是刺激在人脑中留下的一种痕迹,如果对记忆中的材料不复述,痕迹会随时间而逐渐消退.

另一种假设认为,遗忘是由于短期记忆中已有的项目受新输入的项目干扰而造成.新旧项目间相似性越大,干扰就越大.还有人提出折衷看法,认为短时记忆发生遗忘乃是痕迹受新输入的材料的干扰而消退的结果.

如何克服短时记忆局限性对于界面的影响

分块：将较长的的多个无意义的信息单元序列分割为一些小的部分，每个部分中包含小于7个或更少的信息。

电话银行

international

短期记忆由软件传送信息，消除用户记忆的必要性将用户需要的、但又超出记忆容量的信息在屏幕上保持可见，消除记忆的必要性。

如何克服短时记忆局限性对于界面的影响

长期记忆长时记忆（long-termmemory）：是信息经过充分和有一定深度的加工后，在头脑中长时间存储的记忆。储存时间大约为1分钟以上，到许多年甚至终身；长时记忆中的信息大部分来自对短时记忆中信息的精细加工，也可以由于印象深刻而一次获得；主要以语义形式编码,容量没有限度。与长期记忆有关的真正困难主要导源于提取

记忆单元

RED是一个单元,代表红色的意思,而不是以三个单独的字母,R,E,D存在于记忆中。记忆中的基本单元被称为"枪克".把需要记忆的东西先进行有效的分类,化分成基本的元素,然后按"枪克"来记忆对提高人的记忆能力是大有好处的.54419191919544五四运动的日期后加一个四把原来的7个记忆元素变成了三个,(倒一次,五四的日期,还有一个四),英语单词

记忆加工过程

记忆是一个过程，是在一定的时间内展开的，可以区分为前后联系的一些阶段。记忆的三个基本过程编码（识记）储存（保持）提取（再现）记忆的三个基本过程（要点）编码（encoding）是人们获得个体经验的过程，是对外界信息进行形式转换的过程。为使信息适合于存储，大脑要对信息进行加工，使不同感官通道输入的信息变成头脑可接受的形式，这就是编码。编码有不同层次或水平，有不同形式。编码是一个展开的过程，包括对信息的反复感知、思考、体验和操作。储存（storage）是把信息以一定形式保持在人脑中。知识的存储也叫知识的表征（representation）。这种表征可以是事物的图象，也可以是一系列概念或命题。存储是记忆过程的中间环节。提取（retrieval）是指从长时记忆中查找已有信息的过程，是记忆过程的最后一个阶段。记忆好坏是通过信息的提取表现出来的。

减少记忆负担安全问题：密码信息：出生地最后入读的学校名长度为5-10个密码难忘的日期记忆负担！

为什么用笔和纸进行计算比心算容易？减轻记忆负担！用户完成交互任务，必须记住两类信息：

1）如何操作

2）该任务所需要的领域知识相关

如何减少用户的长时记忆负担

将需要记忆的信息在界面上显示出来，让用户看到；

DOS系统、没有交通标志的城市道路举例产品：Iphone/Ipad图片集…………用识别代替记忆

利用用户已掌握的知识，不要求用户记忆新的东西

如何减少用户的长时记忆负担windows7缩略图Windows7的3D显示效果，将正在使用的页面缩略图直观的呈现给用户，减少了用户对正在使用的页面名称的记忆负担。选哪个？任务栏缩略图显示，将缩略图与屏幕显示结合起来，让计算机帮助用户找到那些难以记忆的内容让用户自己帮助自己记忆

利用规律对信息进行组织和设计，减少所需记忆的信息

1.2.3习惯

走路是根本想都不用想的事情（周岁以前的小孩除外）。但是你仍然可以随时干预走路的动作（比如突然小跳一下）。

设计的界面：

1）特别留意利用人们习惯形成的特性

2）使得用户养成顺利进行工作的习惯

理想的以人为本的界面将简化用户工作的界面部件，以利于养成习惯。

一个值得注意的不好的例子是提供多种方法完成同一个任务，这样会使使用者的注意力从要完成的任务转移到方法的选择上。

心理模型

反映使用者的想象确认取消**************************允许以后再说打开推送通知来允许手机接收提醒和标记。作业：（任选一题）

1.设计一个共享的电子日历系统，主要支持大学的院系事务。解决个人与集体的时间协调等问题。

a)标识用户需求，提出系统的功能；

b)每人就一个功能，如“安排会议”这个用户目标作任务分析，并说明执行次序，画流程图。

c)设计各界面

2.设计一个“智能家居”管理的交互式系统，主要实现个人与医生的信息交流诊断等问题。

a)标识用户需求，提出系统的功能；

b)每人就一个功能，做任务分析，并说明执行次序，画流程图；

c)设计各界面3.设计一个基于人眼视觉感知的移动终端上的创新应用交互系统。

要求：操作流程简单,容易学习,设计上要有创新性和亮点.在功能和内容的确定上要减少复杂性。

新的交互方式或挖掘人的认知局限后的解决方法作业1.寻找人认知的局限性2-3个，试提出解决方案

目录01目录产品经理Page02行为的设计——使用方式的设计Page04Loremipsumdolorsitamet,consecteturadipisicingelit,seddoeiusmod，Loremipsumdolorsitamet,consecteturadipisicingelit,seddoeiusmod，Loremipsumdolorsitamet,consecteturadipisicingelit,seddoeiusmod，Loremipsumdolorsitamet,consecteturadipisicingelit,seddoeiusmod，Loremipsumdolorsitamet,consecteturadipisicingelit,seddoeiusmod，Loremipsumdolorsitamet,consecteturadipisicingelit,seddoeiusmod，Page04交互结构罗盘式导航概率可视化内容布局方式搜衣记Page04Page04可视化设计（GUI）信息可视化致力于创建那些以直观方式传达抽象信息的手段和方法。可视化的表达形式与交互技术则是利用人类眼睛通往心灵深处的广阔带宽优势，使得用户能够目睹、探索以至立即理解大量的信息。85%可感化设计（NUI)信息可感化的核心在于，通过人的行为、动作、甚至表情，筛选出个性化的信息，准确便捷的推荐给用户。这种信息可感化，也可以认为是某冲程度的“人与环境的交互”15%Page04后信息时代1：信息叙事多维性及融合策略研究2：各层次感知信息的多维逻辑关系定义3：信息“可感化”机制及多层次体验模型构建研究4：感知信息的挖掘、提取与分层建模5：区域赛博空间的混合现实支撑技术研究6：多通道NUI交互形态与装置创新研究7：多通道NUI交互的评估方法和技术研究。信息“可感化”机制Page04案例3基于增强现实的”网上魔法书”虚拟现实PurdueInteractionDesign普度大学交互设计方向的课程设置A&D512InteractionDesignStudies交互设计研究本课程介绍了交互设计的基本内容，说明如何从以人为中心的角度而不是技术为中心的角度来设计人机界面。也就是通过界面的设计让技术去符合人的需求，而不是让人去适应技术。在学习本课程的整个过程中，学生们都会不断地制作交互设计的原型，并通过对交互设计的主要步骤的指导而做出一个简单的原型。这门课程中使用的技术是动态HTML和基本的Flash制作A&D522InteractionDesignEvaluation交互设计评估本课程是对设计评估研究的基础训练。

这些基础训练会通过综合使用定性和定量的探询方法来分析设计的框架、模仿、原型和整个系统。本课程会介绍一系列的评估方法如正规的可用性研究，实验室实验，现场研究和基于分析的评做。学生会探索如何使用一些收集反馈的技术如可用性测试、观察法、访谈法、启发式评估和推论性的评做。本课程中还会讨论评估所依据的理念包括科学实验、人类学、现象学和美学。学生将会学到如何在不同的设计项目中来设计和实施适当的评做。A&D532CognitionforInteractionDesign交互设计的认知基础这门课程会讲述人是如何与计算机和计算机支持的人造物品进行交互，并探索更好的设计方法来提高整体的有效性和用户体验。为了能够使用系统的方法来达到上面的目标，我们需要更好地理解人类：本课程会有助于学生对计算机媒体时代的多通道的人类认知、感知、行为和空间认识有更深入的理解。A&D542InformationVisualizationDesign信息可视化设计本课程探索如何利用不同的可视化方法来感知信息以及如何最优地交流信息和要表达的概念。课程的主题包括数据可视化、感觉、复杂信息的交互和视觉注意。案例涵盖了所有的可视化领域，包括科学，信息和知识的可视化，以及类似氛围和随和可视化这类新兴的领域。在用户使用复杂数据时交互与视觉一样重要。为了理解不同的交互形式和各自的优缺点，本课程会从三个方面来讨论交互：时间恒常性、交互的应用和交互的本质.Page06ParametricDesignandDesignSpaceExploration参数化设计与设计空间探索最近的CAD/CAM/CAE会使用一些名为参数的设计功能，将维度和变量与几何连接在一起，当值改变时，对应的部分也会改变。与传统的CAD所需要的再绘画相比，在这种方法中，设计的修改和部件族的创立所需要的时间会更少。学生会练习使用SolidWorks,GenerativeComponent,orRhinoGrassHopper.FoundationsofComputationalArt