目前进度：469页/2019.10.06

目录

目标导向设计：恰当得定义和设计出令人期待且有效的产品。

1. 满足用户目标和需求能力
2. 适应商业目标和技术限制

设计行为和形式：

1. 设计价值：为成功恰当的设计实践提供了指导方针。
2. 设计原则：为设计有用而令人期待的产品、系统和服务提供了导向。
3. 设计模式：针对某些具体的设计问题给出了一般方案。

第一章：数字产品的设计过程

思考

1）产品经理更多的是负责预估商机，精于向市场推出和定位产品，他们其实并不为设计负责，用户研究也多基于用户调查得来的推测，但是很少有用户能清晰真实得描述自己的需求。交互设计师如何发现用户的需求？或者创造用户的需求？

2）产品经常责怪用户在操作流程中犯了错，事实上错误不在用户，错误在设计，错误根本就不该发生。所有用户（包括老人和小孩）在使用过程中的困难都是设计的失败。

3）产品弹出逼迫用户进行选择窗口，“是否确定删除？“，“确认进行下一步？“实际上是在逼迫用户去选择，让用户承担了操作失败的风险。

4）如何设计简单的、清晰的任务流，减少用户的操作，降低学习成本，简单又流畅的完成多项任务。

5）向用户索取的是意见并不是解决方案：开发者不会要求用户写代码，设计问题也不应该丢给用户去解决。

6）交互设计不仅仅是审美选择，更要建立在对用户和认知原则的了解上。这是一个好消息，因为如此一来，行为设计就能够反复进行分析和综合。这并不意味着行为的设计可以自动化，就像形式和内容的设计不能自动化一样。但这的确意味着可能存在着系统化的方法。当然，不能抛弃形式和美学的设计。这些规则必须与更宏观的目标相配合：通过适当地设计行为，实现用户目标。

1. 用户认知原则
2. 形式内容
3. 美学规则

7)用户目标是用户对最终目标的预期；活动是达成目标的中间步骤；活动由任务构成；任务优动作组成；动作由操作组成。所有的行动都是为了实现用户目标的手段。用户目标由用户动机决定，是不变的，而任务和活动是随着技术的进步而变化的。

目标驱动人们开展活动，理解目标可以帮助你理解用户的预期和渴望，反过来又会帮你决定哪些行动确实和设计相关。只有对用户目标进行分析后，任务和行动才会在细节上起作用。设计的过程中，应该问问“用户的目标是什么？”能够让你理解活动对于用户的意义，从而创造出更加恰当满意的设计。

很多人在设计时，错误的把注意力放在，“任务是什么？”。按照对活动和任务来设计存在很大风险，极有可能让设计束缚于早已过时的技术中，或者采用的模式只能满足公司目标却无法满足用户需求。

同一产品，在不同的场景下，可能有不同的目标，即“设计目标依赖于具体的情景：用户是谁、在做什么、目标是什么。

8) 设计在用户目标、业务需求和技术制约的基础上，提供了真正意义的产品定义。

9) 产品开发的三原则：功用性、可行性、称许性，即技术可能性、商业可行性、用户期望性。

设计原则

• 设计原则一：

用户界面应该基于用户心理模型，而不是实现模型。

实现模型：软件如何工作的模型
心理模型：用户认为如何完成工作，以及应用程序如何帮助用户完成工作的方式
呈现模型：设计师将软件运行机制呈现给用户的方式

呈现模型越接近心理模型，用户的学习成本越低。如果呈现模型比心理模型更为简单，就能帮助用户更好得理解。

• 设计原则二：

目标导向的交互设计反映了用户的心理模型。

*目标导向设计概论*

概念：

目标导向的设计方法综合了各方面的技术：人总学研究、利益相关者访谈、市场研究、详细用户模型、基于场景的设计，以及一组核心的交互设计原则和模式。

1. 满足用户目标
2. 满足不同场景下的需求
3. 满足业务需求
4. 满足技术制约

一、研究

运用人种学实地研究技术，来获取有关产品的用户的定性数据。

• 观察和用户访谈：行为模式
• 产品利益相关者访谈
• 开发人员访谈
• 行业专家访谈
• 考察对手产品
• 文献研究
• 市场研究：商业目标
• 技术白皮书：技术限制
• 品牌战略分析：品牌属性

二、建模

用户模型是一种详细的、混合的用户原型，代表研究阶段找出来的用户行为、态度、天赋、目标、动机的明确分组。

建模过程中，需要基于每个人物模型和其他人物模型目标的交叉程度，对不同目标进行对比，确定优先级。选定人物类型的过程就决定了不同人物模型对产品最终设计形式和行为的影响程度。

三、需求定义

• 用户需求

1. 对象：不同人物模型
2. 情景：不同场景下
3. 动作：目标和行为

• 业务需求
• 技术需求

四、框架定义

采用两种方法论工具，加上情景场景，整合成一套交互框架。

• 通用交互设计原则
• 一组交互设计模式

五、提炼

类似于框架定义阶段，但是更关注细节和实现。交互设计师此时专注于任务一致性，使用关键路径场景（走查）和验证场景，重点在于界面上的更详细的故事版路径。

六、开发支持

优先级

10/22/19

page: 26

第二章：理解问题 | 设计研究

定量研究和定性研究之间的关系：

消费者数据可能包括消费心态学和行为变量，如态度、生活方式、价值观、意识形态、风险厌恶、决策模式。

定性研究：

定性研究主要是为了建立人物模型，收集综合人物模型的主要数据。

目标导向设计研究

1）启动会：

原始关键问题

1. 产品是什么？
2. 用户是谁？
3. 用户最需要什么？
4. 从业务上说，哪些客户和用户最重要？
5. 设计团队和商业上面临何种挑战？
6. 谁是最大的竞争对手？为什么？
7. 为了熟悉产品、业务和技术领域知识，需要了解何种内外部文献资料？

2）文献综述（secondary research)

3）产品/原型和竞争者审核

产品设计团队检查产品现有版本或者原型，以及主要竞争对手。

4）利益相关者访谈

任何一款产品的设计都应当从了解业务环境和技术背景开始，把利益相关者的看法和用户看法协调统一起来，在开发出解决方案的同时，又不忘一个或多个商业目标。

（用户目标/用户需求+商业目标/业务需求）

利益相关者的访谈应该在其它用户研究之前，访谈利益相关者有利于启发展开用户研究。

*利益相关者：对所设计产品有权利或者有责任的人。

1. 高管，经理
2. 开发
3. 销售，市场
4. 产品
5. 顾客支持
6. 设计
7. 可用性测试

5）主题专家访谈

对于一些（1）高度复杂；（2）技术性强；或者（3）需要考量法律因素的领域来说，主题专家访谈非常重要。比如金融、医疗、科技领域。

6) 用户访谈

包括现有用户和潜在用户

7）用户观察

大多数用户不能准确评估自己的行为，尤其是行为脱离了人类活动范围时。

访谈并观察客户

人种学访谈法：沉浸式观察+导向访谈法（理解与个体相关的人的交互行为和习惯。）

情景调查

1）设计师应该巧妙地引导访谈，利于捕捉和设计问题相关的数据，而不是用调查问卷提问回答，或者让访谈自由发挥。

2）人物假设模型

每个在人物模型假设中找出来的角色、行为变量、人口统计变量和环境变量都应该在4～6次访谈中进行探索。

其它定性研究方法

• 焦点小组

优：善于收集人们愿意购买的产品方面信息，有助于测定产品外观以及工业设计等产品形式。

劣：不善于收集用户使用产品做什么，如何使用产品，为何这么使用产品。

• 可用性测试（评估产品可用性）

衡量用户完成具体的、标准化的任务的好坏程度，以及在次过程中所遇到的问题。

• 卡片分类

信息架构师推广开来的技术，有助于理解用户组织信息和概念的方式。

• 任务分析

使用问卷调查或者开放式访谈来深入理解人们目前如何执行具体的任务。

第三章：为用户建模 | 人物模型和目标

人物模型是组合出来的，也称为“合成用户模型”。人物模型帮助确定产品的功能及行为，确保设计流程的每一步都以用户为中心。

1）关键在于选择正确的设计对象（代表最广大关键人群需要的用户），将这些个体进行优先级排序，确保满足最重要人群需求的同时，不会损害次重要个体需求。

2）解决产品开发中的以下三个问题：

弹性用户: 缺乏对用户的准确了解会导致产品功能定位不清晰。

自我参考设计：设计者和开发人员将自己的目标、动机、技巧、和心理模型带入产品设计。

边缘功能设计：设计和编程时，必须考虑边缘功能（偶尔发生但不经常发生在大多数人身上），但是绝不应当当成设计的重点。

3）跨产品人物模型越来越难，不同的产品应该单独研究和开发不同的人物模型。因为人物模型必须是针对具体情境的，专注于具体产品的相关特定领域的行为和目标上。

4）人物模型目标（动机）可帮助设计师去理解用户执行任务的原因，在设计产品的时候，可以改进甚至是消除某些不必要的任务，但同时能完成相同的目标。

5）创建既有用户和潜在用户的同时，创建不同于用顾客角色的户人物模型（“反任务模型“）同样对产品设计有帮助。

6）人物模型作为最适合定义产品并让开发过程清晰化的模型。

7）三个不同层次的认知和情感处理过程：

• 本能

是指设计初见产品时的感受，此时还没有与产品进一步交互。包括：视觉，动作，声音，触觉。

本能设计其实为情感设计，在特定情境下引起人们心理和情感上的反应，而不只是美学设计。

• 行为

是指设计出的行为可以补充用户自己的行为、隐含假设和心理模型的产品行为。

在三层理论中，交互设计的行为设计应为主要关注点。

• 反思

反思层次的设计意味打造长期的产品关系。产品有真正的使用目的，如果某个产品或服务的设计满足了用户的目标和动机，甚至超越了产品的主要目标，而用户以某种方式通过个人或文化关系与产品联系起来，则引发具有反思意义的可能性就大大提高。

8）用户目标的三种类型

• 体验目标

定义：

表达了人们在使用产品时所期待的感受，或者与产品交互时期的感觉。

交互，视觉，工业：

将人物模型的体验目标转化为可以传递恰当感觉和感情的形态、行为、动作和视听元素。

技术手段：

交互感（动画过渡、延迟、触觉反应、按钮）物理设计，以及微交互的设计。

• 最终目标

定义：

代表用户使用某个具体产品时执行任务的动机。

交互、信息架构、工业：

设计可以帮组用户直接或间接完成期望目标的功能。

技术手段：

发掘用户目标和心理模型。

人生目标

定义：

代表用户的个人期待，通常超越了所要涉及的产品情境，决定了用户成为普通满意用户还是狂热的忠实用户。

交互：

将人生目标转换为高层次的系统功能，正式的设计概念和品牌战略。

技术手段：

情绪版，情绪场景，人种学研究，文化建模。

9）在理解具体任务和人口统计数据之后，运用人物模型、目标（动机）和情境是发挥本能、行为及反思设计力量的关键。

10）用户目标是凌驾于非用户目标之上的。

不太明白用户目标和客户目标的区别？
用户指的是终端用户，而客户指的是消费者角色

11）设计原则：不要让用户感觉自己愚笨。

12）构造人物模型

step 1：根据角色对访谈对象分组

step 2：找出行为变量

step 3：将访谈主题和行为变量对应起来

step 4：找出重要的行为模型

寻找落在多个变量（区间）上的主体（用户）群，如果一组主体落在6到8个变量上，很可能代表一种行为模式，这个模式构成了人物模型基础，如果聚集行为间有逻辑或者因果联系，则模式有效。

step 5：综合各种特性，总结阐明目标

step 6：检查完整性和冗沉

step 7：制定人物模型的类型

step 8：进一步描述特性和行为

• 人物模型叙述

1）包含重要行为类型的总结

2）包含人口统计数据

3）编成一个故事

4）引入痛点，但不能包含解决方案

5）不能自行添加未观察到的细节

将人物模型转化为设计方案，需要两个阶段：

1. 需求定义（第四章）
2. 框架定义（第五章）

通过人物模型、场景、和需求定义产品

第四章：设立愿景 | 场景和设计需求

场景（scenario based design)

step 4 

定义：目标导向的场景是从具体用户（人物模型）角度定义产品行为的迭代手段。叙述系统的功能及其功能优先级，以及这些功能如何被用户所见，用户如何和系统交互。

从人物模型的角度，用叙事的方式描述了一种理想体验，聚焦于人及其思考和行为方式，始终注意人物模型和产品的交互，如何对任务过滤以完成目标。

目的：从交互宏观层面，有效的帮助人物模型实现目标，不要担心如何实现，找出用户需求，帮助之后的交互动作和界面设计。

1）设计原则：设计产品之前，首先定义产品会做什么

2）设计需求和产品需求不一样：prd和mrd中的需求指的是产品特性或者功能；设计需求关注的是用户需求。

3）人物模型和场景是设计需求的主要来源。

4）为了找出最佳方式来满足特定的人群需求，就要从设计需求入手，而不是解决方案开始。拿到prd（产品需求）之后，根据用户需求，交互设计师有大量的方法来创造强大诱人的产品。

定义设计需求过程

用户模型（明确用户及其行为和目标）到定义场景和需求的过程。

step 1：创建问题和愿景陈述

把商业问题（企业）和可用性问题（用户）联系起来是推动利益相关者支持设计的关键，也是同时满足用户和商业目标而拟定设计框架的关键。

• 用户目标：主要和次要人物模型中得出
• 商业目标：从利益相关者访谈中得出

step 2：探索和头脑风暴

step 3：确定人物模型期望

界面的呈现模型（设计如何表现和呈现自己）应该尽可能地与用户心理模型（根深蒂固潜意识）相契合。

step 4：构建情境场景

step 5：明确设计需求

需求包括：人物模型+动作+情境

第五章：设计产品 | 框架和提炼

设计框架定义了用户体验的整个结构，包括底层组织原则、屏幕上功能元素的排列、工作流程、产品交互、传递信息的视觉和形式语言、功能性和平牌识别。形式设计和行为设计必须 保持一致；设计框架包括交互框架及设计框架，有时也包括工业设计框架。

（一）交互框架

step 1: 定义形式要素、姿态和输入方法

• 形式：pc, 手机，车载
• 姿态：姿态指的是用户将投入多大的注意力和产品互动。
• 输入方法：键盘，鼠标，小键盘，拇指板，触摸屏，声音，游戏杆，遥控器，按键。

在需要两种或以上不同输入方式的组合时，要确定该产品的主要输入方式。

step 2: 定义功能性和数据元素

• 数据元素：交互产品中的基本主体（照片、电子邮件等）

理想情况下，数据元素要符合人物模型的心理模型，还需要考虑数据元素之间的关系。

• 功能性：针对数据元素的操作

必须回到情境场景、人物模型目标和心理模型中，才能检验解决方案是否适合此刻的情形，在审视解决方案时检查以下条件：
- 最有效满足用户目标
- 最符合设计原则
- 最适合当前的技术水平和成本考量
- 最能满足其他条件

一些实用的技巧：
- 假定产品是真人
- 采用设计原则和模式：除非有充足的理由，否则不要轻易背离标准

step 3: 确定功能组和层级

把数据和功能纳入屏幕，框架，或者网格等高层次容器元素。

需要注意以下问题：

• 哪些元素需要大片的视频区域，哪些不需要？
• 哪些元素能够容纳其他元素？
• 容器如何组织才能优化工作流？
• 哪些元素需要捆绑使用？哪些不是？
• 相关联的元素使用时顺序如何？
• 哪些数据元素有助于人物模型做出决定？
• 采用何种交互模式和原则？
• 人物模型的心理模型如何影响元素组织？

step 4: 勾画交互框架

开始阶段一定要看到整体且高层次的框架，不要被界面上某个特殊区域的细节分散注意力。

在最终选择最佳方案前，尝试采用几种不同排列并用于验证性的场景。

step 5: 构建关键线路情境剧本

关键路径以任务为导向，关注情境场景中暗含的任务。在细节上，描述了人物模型在组成交互框架的不同功能和数据元素的每个主要交互的精准行为，并提供每个主要线路的走查。

这不意味着我们可以忽略目标，目标和人物模型需求始终都是整个设计过程的度量尺，用来删除不必要的任务，优化必要的任务。

利用故事板叙述关键线路情境。

通过验证性场景来检查设计

目标在于指出设计方案的漏洞，并根据需要进行调整。这需要按如下顺序，解决三类主要验证性场景：

• 替代场景：人物模型在关键路径某个点的替代或者分叉点做出的不同的选择
• 必须使用的场景：指必须要执行，但又不经常发生的动作
• 边缘情形场景：非典型的情景下一些产品必须有却不常用的功能。

（二）视觉框架

通常包括以下过程：

1. 开发视觉体验特征
2. 开发视觉语言研究
3. 将已选择的视觉风格应用于屏幕原型

step 1: 开发视觉体验特征

选择3～5个形容词来定义产品的单调、语音和品牌承诺。

可参考的过程：

1. 收集并熟悉现在品牌纲要。
2. 收集拥有强大品牌特征的产品、界面、主体和服务示例，包括有助于涉众思考产品独特性的某一领域中的多样性例子。
3. 同涉众一起，确定直接或间接竞争。收集这些产品、提供服务的产品和界面相关的范例。
4. 留意定性研究中受访者提到的相关术语，尤其要注意提到的产品问题。
5. 与涉众商讨所设计产品的次要品牌特征。
6. 根据讨论结果，确定定义和区分产品所需要的最少数量的形容词。
7. 如果任何词语有多重语义，记录下需要的意思。
8. 思考竞争对手。如果确定的特征无法将产品区分于对手产品，则需要重新进行定义，直到拥有自己的独特性为止。
9. 开始下一步活动前，要同涉众一起对提出的产品特征进行检查讨论，并做出最终决定。

step 2: 开发视觉语言研究

通过视觉语言研究，探索多种视觉处理方案，包括颜色、类型、小部件处理，整体外形尺寸和界面的“材料”属性。

视觉语言研究应该同人物模型体验目标相关联，也要和需求定义阶段总结出来的任何体验和品牌关键字相关联。

• 人物模型体验目标：体验关键词
• 品牌纲要：通过视觉和文字传递公司品牌和形象
• 环境因素：比如远距离
• 人物模型：比如老人视力

通常做3～5套方案，每套方案视觉风格不同，但都包含了体验关键字和目标。还会有两个极端的备选方案，在某一方向上把外观和感觉推向极致。

step 3: 将已选择的视觉风格应用于屏幕原型

（三）工业框架

用户体验只有一个，即形式和行为的设计必须相互和谐。

（四）设计细化

细化外形和行为

此阶段需要尽可能地考虑所有的主要视图和对话，视觉设计者应该发展并提出一套视觉风格指南，形成一份外形和行为规范文档（文档包括带有详细编号的屏幕渲染说明，用于描述行为的详细故事板）。

不能只使用原型，因为仅仅使用原型不足以表达底层的模式风格、原则和基本原理。在整个开发和实施过程中，设计团队需要继续和实施团队密切合作，保证设计规划可以严谨、忠实且精确地从设计文档变成最后的产品。

（五）设计测试

用户反馈和可用性测试对于发现交互框架中的主要问题及某些方面的细化是很有帮助的。

可用性测试不同于用户研究，用户研究在前期构思阶段进行，而可用性测试本质是评估，并非创造，它是用来评估你即有的设计思想的有效性及完整性的一种方法。

测试“什么”

• 命名————部件/按钮标签是否合理？某些词语反响是否更好？
• 组织————信息是否进行有意义的分类？用户能否在想找的位置找到特定的部件？
• 初次使用和可发现性————常用项目是否易于新用户的寻找？指令是否清晰、必要？
• 有效性————顾客能否有效完成具体任务？有没有犯错？哪里出错？是否经常发生？

何时开始测试

最好在编程开始之前进行评估形成性评价。

进行形成性可用性测试

要确保形成性测试成功，需要做到以下几点：

• 测试时间不能太早，要在基本的设计成型之后开始，这样才能有实质性的内容可供测试；也不能太晚，这样一旦发现问题，还能对设计和实现进行调整。
• 要挑选适合现有产品的测试任务和用户体验内容
• 从目标用户群中招募参与人员，并以人物模型为指导
• 让参与测试人员清晰地执行规定任务，并采用出声思考方式
• 直接让参与测试人员使用技术含量低的原型
• 协调各个会议讨论，从而确定问题，找出问题的起因
• 让之前未参与该项目的人充当协调者，从而尽可能减少偏见
• 关注实验参与者的行为及其基本原理
• 测试后和观察者一起听取报告，找出并确定所观察到的问题的原因
• 在研究过程中要有设计者参与

人物模型有助于设计者了解用户的目标、需要、观点和态度，为有效的沟通奠定了基础。

第五章：创造型团队合作

创造型团队合作

解决复杂问题时，如果团队能灵活使用以下两种方法，就能快速取得进展。无论你在产口开发过程中扮演何种角色，都可以使用以下措施来寻找团队伙伴帮助你做出最好的构思和创造。

• 创意创造————进行无边无际的创意构想
• 创意综合————对创造进行指导和聚焦，只有用户需求得到满足，设计结果才能得到保证

与思想伙伴的起始合作

• 思想伙伴要满足以下几点：
  • 开始工作前能够明晰你要解决的问题
  • 向具有创造能力的同事或者朋友求助：“我需要一个伙伴帮我启动一些想法”
  • 如果事情在会议开始时行不同，直接走到白板前，写出一个烂主意。如果你的伙伴是一位优秀的创造者，他/她会跳出来继续按照你的思路进行设计或者干脆给你提供一个相反的建议。

• 思想伙伴要会综合

在此之前，要确保“故事”或情境场景具有较高的水平，确保清晰了解用户的行为及原因。

• 动态角色转换

在伙伴关系确立初期要制定一些基本原则。

综合者应该探查并引导

创造者应该探索和设想

二者可以互换角色，但最好简明声明一下让团队成员知晓。

• 脱离困境（15分钟法则）

如果讨论停滞超过15分钟，建议引入另一位设计者参与讨论，核心团队应该简要向新成员介绍情境设计的细节，如用户、场景、考虑的创意等。反过来，新成员也要探寻设计者的设计理论和依据。

核心团队规模适度

2个成员基本合理，3个更好，4个为极限。

坚持4个原则：

• 团队规模小
• 角色清晰
• 决策紧凑
• 与工作相关的最小工作量（不要把过多精力放在与核心目标没有直接促进关系的任何活动上）

跨设计领域工作

在产品生产过程中涉及到的各领域的责任整体框架：

交互设计

负责了解及明确产品的行为方式。在整个过程中要和其他领域的设计师及实践团队充分合作。

视觉界面设计

视觉设计者的工作主要强调设计的组织方面以及视觉暗示和启示同用户行为的交流方式。视觉设计者必须同交互设计者们密切协作，了解信息重点、流程和界面的功能并确定产品正确的情感基调。

视觉界面设计者关注如何将用户心理模型和应用模型的界面视觉结构同逻辑结构相匹配。他们还关心用户交流应用的状态，如果只读和可编辑，以及围绕用户功能概念方面的认知问题，如布局、视觉层次、图形-背景问题等。

视觉界面设计者必须掌握基本的视觉特征，如颜色、排印、形式和组成等。并且必须知晓这些元素如何有效地传递启示、信息层次和情绪。应该了解品牌心理学、平面设计的历史，熟悉当前的流行趋势，必须掌握可用性原则和人类感知的科学。需要对界面规则、标准和惯例有初步的了解。

平面设计

平面设计侧重于首先同品牌体验相关的一种基调、风格和框架，其次是易读性和信息的可读性，最后是通过视觉启示实现的交际行为。

视觉信息设计（data visualization)

视觉信息设计关注的是数据、内容和导航的视觉化，而不是交互功能。

视觉信息设计的主要目标是以一种易于理解的方式展现数据。通过使用排印、颜色、形状、位置和比例等视觉特征以及变换方式控制信息层次，以实现目标。还包括显示信息的微观交互，展现了一些细节或与其他信息之间的联系。

工业设计

工业设计师必须定义物理产品的外形，利用开关和材质来展现品牌。工业设计师长于材料和人体工程学领域的专业知识，交互设计师长于整体设计体验理念。

扩展团队

在产品生产过程中，每个团队都要不断寻求解决核心关注的方式：

• 设计者：打造用户体验的最简单、最连贯以及最能激发快乐的机制是什么？
• 可用性专业人员：设计能否传递有用性、可用性和可期待性的承诺？实际情况中，用户是否按照设计预定的方式使用产品？
• 工程师：如何以快速、有活力、可升级并可延展的方式传递体验？
• 市场人员：如何激发可采纳性？
• 商业领导：产品功能和市场需求最明显的重合点是什么？

敏捷开发

商业利益相关者倾向于敏捷开发的创意，因为听起来这种创意比较经济高效。但商业利益相关者们通常不会意识到构建速度意味着思考的速度，而快速的思考需要坚实的认识基础和期望的结果。如果对于要构造和测试什么内容尚未形成认知基础或还未达成一致意见，那么敏捷设计就失去方向，只会是无法兑现承诺，徒劳一场。

敏捷测试珍视速度，关注小的迭代，设计者可以在进程中得到反馈。设计人员很少有机会在敏捷设计中对用户体验设想进行完全的视觉化构思和完善工作。但是他们必须在产品定义和开发项的优先级排序中提倡目标导向性。

第二部分 设计行为和形式

第七章：良好产品行为的基础

（一）设计价值：为成功恰当的设计实践提供了指导方针

设计价值描述有效、合乎道德的设计实践所遵循的规则。

优秀的设计方案应该具备以下价值：

1）合乎伦理（有用、贴心）

• 不造成伤害

人际关系上的伤害（缺乏尊严、侵犯他人、羞辱他们）
心理伤害（困惑、不舒服、烦躁、强迫症、无趣）
身体伤害（疼痛、受伤、残疾、死亡、威胁安全）
经济伤害（减少利润、降低生产力、失去财产或积蓄）
社交和社会伤害（受到剥削或不公正的对待）

• 改善人类环境

增进理解（个人、社会及文化）
提高个人与团体的效率或效力
促进个人与团体之间的沟通
降低个人与团体之间的社会文化张力
促进平等（经济、社会及法律）
平衡文化多样性与社会凝聚力

2）目标明确

用户研究和人物模型的理解的基础上，帮助用户实现目标和期望，并设计符合用户场景和用户能力水平的产品。

3）实用

帮助实现用户目标，并兼顾商业和技术需求。

4）优雅（高效、艺术性、能打动人）

最简单而完整的设计方案

设计的内在一致性

恰当顺应、调动认知与情感

（二）设计原则：为设计有用而令人期待的产品、系统和服务提供了导向。

设计原则作用于不同的层面，上至普遍的设计原则，下至交互设计的细节。

• 概念原则：定义产品定义，产品如何融入广泛的使用情境
• 行为原则：描述产品在一般情境与特殊情境中应有的行为
• 界面原则：描述行为及信息有效的视觉传达策略

设计原则的主要目的之一是优化用户体验，将工作负荷降至最低。

（三）设计模式：针对某些具体的设计问题给出了一般方案。

模式总是应用于特定情景，它们适用于具有类似情境、限制的设计场景。提取一个模式，重要的是记录方案应用情境的一个或多个具体案例、所有案例共有特征，以及解决方案背后的理念。

交互设计模式也可以有层次地组织在一起，与原则一样，模式可以应用于系统的各个层面。

第八章：数字产品的礼仪（概念原则）

（一）软件应该像人一样体贴

• 关心你的喜好：体贴的朋友希望加深对你的了解，他记得你的喜好，知道如何使你开心。每个人都希望得到个性化的体贴和照顾。
• 恭顺的：不体贴软件监督并随意判断或限制人的行动。
• 乐于助人的：如果向商店服务员询问在哪里可以找到某件商品，我们希望他不仅能回答我们的问题，还能主动向我们提供一些其他有用的信息，比如同类性价比更高的商品等。
• 具有常识的：在不合适的地方提供不合适的功能是交互产品设计失败的一大标志。
• 有判断力的：软件应该能判断哪些操作是我们希望计算机记住，哪些不希望在没有接受到用户指令的情况下自动记录的。软件也应该时刻记录保护用户隐私数据。
• 可以预见需求：在我们停留在某个网页时，系统浪费大量时间闲置，什么也不做。其实它可以在我们停留时，轻松预测我们的需求并做好准备，也可以利用这些闲散的时间提前下载所有可见的链接。
• 尽责的：一个尽责的人会从长远的角度来认识所执行任务的意义。
• 不会因为自己的问题增加你的负担：我们希望服务员能够充分照顾我们的关注点，而不是滔滔不绝地介绍她/他所关心的问题。交互产品也应该对自己的问题保持沉默，关注用户的需求。
• 能及时通知我们：我们真心希望交互品能够及时通知我们所关心的事情
• 敏锐的：敏锐的软件能够察觉用户的操作，并利用这些观察为用户提供相关的信息；软件也应该观察我们的偏好，并主动记录下来。
• 自信的：软件不应该怀疑用户的操作，同时应该随时做好恢复操作的准备
• 不问过多问题：用户不喜欢产品问问题，提问的人所处的位置要比被提问的人更优越，另一方面，问题会让人感觉受到烦扰和侵犯。
  产品问问题会让用户觉得产品：
  • 无知
  • 健忘
  • 软弱
  • 烦躁不安
  • 缺少主动性
  • 要求过多

• 即使失败也不失风度：当程序发现一个致命问题时，它可以充分利用时间，努力弥补过失而不让用户受到损害
• 知道什么时候调整规则：人类对轻微调整系统有着强烈需求。在现实世界中，限制总是可以调整的，体贴的软件需要意识到并且包容这类事实。
• 承担责任：大多数软件面临问题时，会采取这种态度“这不是我的责任。”，把责任推给用户，这种软件没有分担责任来帮助用户变得更加高效。
• 能够帮助你避免犯低级错误：产品能够更进一步帮助用户避免令其尴尬的错误，并不因此责备用户，这样产品会快速赢得用户的信赖和忠诚。

（二）设计聪明的软件

• 利用计算机的空闲周期

在当前计算机系统中，用户需要记住的事情太多，当前多数软件也不关注情境。我们为减少计算机的反应时间投入了大量的努力，却投入了很少或者几乎没有投入精力，以使计算机在没有响应来自用户任务时做一些前瞻性的工作。

通常，多数用户在不足几秒的时间内能做的事很少，但计算机（cpu) 可以执行至少10亿条指令。在这些空闲周期里，计算机有足够的空间和能力假设用户下一步操作并提前准备好，并在用户做出最终选择时丢掉其他假设的结果。

我们需要以全新并更主动的方式来思考软件应该怎样帮助人们实现其目标和任务。

• 聪明的软件有记忆

如果人们感觉某个交互产品是体贴和聪明的，那么这个产品肯定具有关于这个人的知识并从其行为学习的能力。

你可以预测用户将要做什么，如果你的程序简单地记住了用户上次做了什么（或者是怎么做的），它可以凭此来预测用户下次的行为。

一个让使用过程充满效率的产品就像一位自觉的助手，记住了所有有帮助的信息和个人偏好，而不用去问。

• 聪明的产品能够预测需求

通过记忆用户上次的行为来预测用户将要做什么（这基于任务一致性原则）

通过关注用户的动作频率来推测用户习惯，提供帮助

• 聪明的产品能够记住细节

确定程序应该记住哪些信息有一个简单的原则：

如果用户愿意操作，它就值得被程序记住。

• 让聪明的产品发挥聪明

1. 缩小决策数量———人们倾向于将决策选择降低到最小的有限数量。程序应该记住用户的所有选择，寻找更加微妙的线索来在小的集合中确定哪一个才是正确的。
2. 偏好阈值————人们所做的决策一般分为两大类，重要的和不重要的。软件界面可以用偏好阈值来简化用户任务。
3. 多数情况下，多数是对的————在不确定性存在时，程序应径直做其认为最恰当的事，然后允许用户覆盖撤销，而不是让用户选择。如果撤销工具容易使用、理解，用户就不会受到无谓的干扰。

(三）设计社交软件

• 社交软件要知道社交规范和市场规范的区别

社交规范：存在于家庭成员中，并互相遵守。

市场规范：生意人需要遵守的潜规则。

• 社交软件帮助用户展现最好的一面

用户身份：用户名+用户头像

动态 vs. 静态用户形象：用户在网络社会的动态贡献+用户个人静态信息

• 允许简单写协作

以协作为中心的社交软件应能将这一功能深深植入界面当中。

• 知进退

只有外部社交功能的软件中，社交功能不应该超过或干扰重要任务。

• 助于增长网络健康

社交软件应该提供途径和方法，并在成员违反亚文化的时候稍加提醒。

• 社交产品尊重社交圈的复杂性

明确的社交软件可以包括大量不同圈子的人群，每个次群体的规则和规范对用户来说至关重要，因为这些规则和规范可用于对这些群体进行区分。

• 社交产品尊重其它用户隐私

靠广告驱动的社交媒体，由于强烈的金钱刺激，很容易出现不尊重用户隐私的现象。

• 社交软件要恰当处理反社交行为

第九章：平台和姿态（概念原则）

平台

定义：产品的平台是使产品能运转起来的软件和硬件的共同作用体，包括用户交互和产品内部运转。

1. 桌面软件
2. 网站和网络应用
3. 电话、数字相机、平板电脑等移动设备
4. 公用电话亭
5. 车载系统
6. 家庭娱乐系统，如游戏机、电视机顶盒、家庭影院系统等
7. 专业设备，比如医疗仪器及科学研究设备等

选择合适平台的过程是在各方面因素中寻找平衡点的过程，你必须找到那个最好即可以同时满足人物模型需要和情境要求又符合业务约束、目标和设计公司或客户的技术能力的平衡点。

姿态

定义：产品的姿态是指产品的行为立场，也就是产品对用户的展现方式。

软件的程序风格可以大胆或谨慎、绚丽多彩或乏味；但无论怎样都应该有一个之所以如此具体且目标导向的原因，其风格不应该任由设计者或程序员的喜好决定。

软件的外观会影响用户使用的方式，强烈影响产品可用性；软件的外观和行为不能与其目的互相冲突，否则会显得不一致且不相称。

从姿态的角度来看，外观和感觉不仅仅是品牌或者审美方面的选择，还是关于行为的选择。应用程序的姿态是行为的基础，不管在审美上如何选择，都应该和产品的姿态和谐一致。

产品界面的姿态决定了其他设计内容的许多重要原则。

桌面软件姿态 (desktop application)

因为每种姿态都描述了不同的行为集合，所以每种姿态也就描述了不同类型的用户产品交互。这些姿态给了设计者进行界面设计的基点。

• 独占姿态

定义：如果一个程序长时间占据使用者的注意力，这个程序就是独占姿态（sovereign-posture）的应用程序。使用独占程序的用户通常将窗口最大化，耗时长，属于工作流状态。

1）锁定中级用户

初级用户：每个用户都会在初级的初始阶段花点时间，一个新手必须要通过最初的学习曲线，不过这些时间相对于使用产品的全部时间来说是较短的。

对于设计者来说，这类程序应该为永久的中级用户优化，而不能将主要目标放在初级用户上（也不能是专家用户）。不能牺牲速度和动力，将产品设计得易于掌握，却不灵活；也不能设计一味复杂。无论如何，你设计的产品所针对的用户类型（中级用户），是由你选出来的首要任务角色及其态度、能力和使用情境来决定的。

在初级用户和中级用户之间，有很多偶尔使用独占应用程序的用户，独占应用程序的成功依赖大多数中级用户，直到一款既能满足中级用户又能满足初级用户的竞品出现。

2）慷慨使用屏幕空间

全屏使用独占应用程序，让它发挥最优效果。

3）使用保守的视觉风格

因为用户会长时间盯着独占应用程序，所以应该考虑弱化视觉表现上的颜色和纹理，不要用太多的颜色，并且使用保守颜色。

用户会会因为熟悉而产生位置感，所以设计师可以用户更小的像素（图标等都比正常要小）做更多的事情，同时也可以让空间更紧凑。

4）丰富的视觉反馈

独占应用程序是很好的平台，为用户创建了一个视觉反馈丰富的环境，可以在界面上添加大量额外的信息。但在保证丰富视觉反馈的同时要避免创建混乱的界面。

由于应用在屏幕上微妙的显示方式，新用户很难注意到它们。

5）支持丰富的输入方式

独占式应用程序可以使用丰富的输入方式（直接操作，鼠标，快捷键）。充分调动用户精巧的运动技能，让用户养成直接操作的习惯。

6）以文档为中心

以文档为中心的独占应用程序应让文档试图最大化。

• 暂时姿态

定义：暂时姿态（transient posture）的程序在打开短暂的时间后随即关闭，用一套有限的附加控件展现一些单一的功能。

暂时姿态应用程序的显著特征在于其临时性质，因为它们不会长时间停留在屏幕上，用户不会有机会熟悉它们，所以这类程序的用户界面需要精致、清晰并显眼地显示控件，不能有混淆或者错误，用户界面必须非常清楚它在干什么。暂时应用程序必须简单、清晰并且意思明确。

1. 辅助支持独立应用程序
2. 除了必要的空间之外，不能占用其他屏幕空间

1）明亮而清晰

界面上的控件与独占应用相比，应该更大，按钮含义更清晰，不要使用缩写。相比独占姿态保守的设计，醒目的图样和炫目的色彩设计反而有助于用户快速定位。

2）保持简一

1. 暂时式应用程序只使用一个窗口和视图，如果需要增加第二视图或对话框，意味着你可能需要重新检查自己的设计。
2. 应该尽可能少地让用户进行精细化操作，直接操作的对象足够大。
3. 所有重要的功能在界面上都应当直接看到。
4. 暂时式应用程序必须是可以移动的，而且必须有一个标题或者有其他明显的地方可供使用者拖放。

3）记住用户的选择

记住用户上一次使用时的状态，逻辑设置也是如此。

• 后台姿态

通常不与用户互动的程序是后台姿态应用（daemonic-posture）,后台姿态运行的程序在不必要的时候不要打扰用户的操作，在出问题时应当小心提醒用户。

用户不需要时，将图标显眼地放在用户面前其实是一种无用的视觉污染。只有在连续提供有用状态信息的情况下，后台应用才应该亮着。

网络姿态（web application)

（一）信息类网站姿态

1）平衡独占和暂时姿态

选择姿态，很大程度上取决于目标人物模型的身份及其行为模式，独占（访问常客）和暂时（一次性访问稀客）姿态存在紧张的平衡关系，所以需要注意一下两点：

1. 1. 1. 有用信息的显示密度要适当
      2. 便于首次或者不经常使用网站的用户学习和搜索

2）独占属性：详细信息显示最好以独占姿态完成。

网站中采用独占姿态唯一的难点是全屏分辨率。要决定这一点，可以采用量化研究：考虑包容主要人物模型可能使用的显示器尺寸。

3）暂时属性：主要任务角色越不经常访问网站，这个网站就越倾向于暂时姿态。

信息类网站越倾向于暂时姿态就意味着网站越容易使用，导航和标识也越清晰。

智能手机网站入口一般也倾向于暂时姿态。响应式技术使得网站可以转化为桌面或者掌上屏幕的形式，但必须注意导航和信息流。网站的手机版需要简化导航。

（二）事务性网站姿态

最典型的例子就是在线商店（amazon）和门户类网站（Google）。除了信息内容，网页中还包含了复杂行为的功能因素（比如购物车、结账等）。

1. 在线商店：在独占姿态和暂时姿态中保持平衡。
2. 门户类网站：独占姿态

导航清晰与否，辅助信息是否方便访问，以及交易的效率是特别重要的。

事务性网站的暂时姿态要求我们不能强迫用户做没有必要的导航动作，这尤其重要。

尽管我们可以将诸多信息和功能分开列到多个不同网页中，这样可以减少载入时间，并降低外观的复杂度，但也要考虑给用户造成困惑或者带来单击疲劳的潜在可能。

（三）网站应用姿态

重点是要允许用户在云存储中轻松获得同样的数据和功能，这是网站应用的核心优势之一。

移动设备的姿态（mobile application）

• 智能手机和手持设备姿态

设计手持设备要特别关注外形尺寸、显示的清晰度、输入和控制的难易、以及对情境的敏感度。

1）卫星姿态（暂时姿态）

卫星姿态强调信息的检索和浏览，必须充分利用设备上有限的屏幕控件，控件仅限于数据或文档的导航和浏览。提供高度暂时姿态，仅给出与当时情境相关的足够信息和可能动作。

1. 数码产品：数字相机，Kindle，iPad nano
2. 可穿戴设备：腕表，眼镜

交互：小型触摸屏，抬头显示，音控

2）独立姿态

手持应用程序的独立性意味着大多数人会在一段时间内使用大量的程序，如电话程序的行为也是暂时性的，电话界面的暂时姿态丰富(视觉，Siri语音）

1. 智能手机

• 平板电脑

继苹果手机从笨重的卫星设备转变为独立手持计算机/集合媒体设备，又在大屏幕外观设计中采用了多点触碰和高分辨显示技术后，大屏幕高分辨率平板电脑拥有更多的控件来支持真正的独立姿态应用，尽管输入方面仍然有空间上的挑战，iPad的键盘也能支持在屏幕上进行编辑。

设计师在设计时应该避免这种平板电脑看起来像是特大号的手机屏幕。

平面电脑还需注重应用程序的独占质量，从概念上讲这同桌面电脑相似，只不过布局更稀疏，操作更简便。同时它也支持小部件-微型暂时姿态，用户可以直接进入已安装的独占程序功能界面，而不必将应用拖到显眼位置。

其他平台的姿态

特殊平台有自身的机遇和限制条件，不加思考地添加数字智能和应用程序有风险，产品行为有可能更像桌面电脑，而非用户期望或期待的产品。它们特别关注的是创造一种体验，同产品周围的现实世界中的噪音融为一体。要根据产品的特性和使用场景设计界面。

• 信息亭姿态（暂时姿态）

类别：

1. 交易型信息亭：购物中心指路器、售票亭、机场登记、自动售卖机、点餐器、
2. 教育信息亭
3. 娱乐信息亭

特点：

1. 针对首次使用者
2. 不会花费很多时间
3. 不适合大量输入
4. 嘈杂干扰很多的公共场所

• 远距离界面姿态

同智能手机的触摸屏幕用户界面中内容浏览型应用和卫星姿态类似。区别在于：

通过红外线或者蓝牙遥控器交互

当前聚焦的位置要显眼（这样用户才知道自己当前所处的位置，和下一步将要去哪里）

playstation 4 标准配备就是大的按键和简单的左右上下导航，最多拥有两列信息栏。

• 汽车界面姿态（暂时姿态）

驾驶员是坐着的，且尽量可能少干扰驾驶员。大的控件和简单的屏幕，相比信息亭姿态，更像是电脑界面姿态。

特斯拉s型娱乐系统界面设计

• 智能家电姿态（暂时姿态）

用户很小是技术通，因此要尽可能采用简单、直接的界面。用户需要完成具体的某种任务。

总结

设计交互产品首先要做的决定就是采用高水平类型的姿态和平台。退后一步去思考什么样的技术平台和行为姿态最能满足用户和业务需要。另外，还要考虑这些决定对交互细节可能造成的影响。

第十章：为中级用户优化设计（概念原则）

• 永久的中级用户

没有人愿意永远当个新手，新手很快成为中级用户，或者干脆放弃。大多数用户即非新手又非专家，属于中级用户。但是很少有人能成为专家。

鉴于大多数用户都是中级用户，设计出简单的，一致的能够满足用户需求又不忽视初学者或高级用户需求的产品很难。好的用户界面应该把大部分工作放在满足永久的中间客户身上，提供各种机制，让新手和专家这两类数量较少的用户有效使用。

• 扭转界面

转换界面意味着将界面中常见导航最少化。将最常使用的功能和部件放在最直接和便利的位置，不常使用的隐藏。

付出与回报要相称

付出与回报要相称，人们愿意为值得的事情付出努力。

用户只有获得充分的回报，才会付出相应的努力。

至于值不值得，用户说了算，同这一功能执行起来技术难度有多高没有关系，完全取决于用户的目标。如果在应用中添加复杂的功能，要想让用户忍受复杂的操作，结果必须有足够的吸引力。

组织界面的扭转

按照3个原则对界面中的部件和显示器进行整理。

1. 使用频率
2. 转换程度（指某一功能或命令引发正在处理的界面或者文档、信息突然发生变化的程度，最好隐藏在界面深处。）
3. 风险承担程度（指不可更改的功能 或者更改后会产生危险后果的功能）

设计人员还需要提供方便用户使用的快捷方式，配合中级用户的提升，也是专家用户的必备功能。

为三层用户设计

1. 迅速轻松地将新手培养成中级用户
2. 不要在中级用户成长为专家用户的过程中设置障碍
3. 最重要的是，保证永久的中级用户在技术范围的中段探索时有愉快的体验

• 新手想要什么

设计原则：将用户想象成非常聪明但很忙碌的人。

一个新手必须迅速掌握程序的概念和范围，不然他可能就会彻底放弃；而新手一旦成为中级用户，程序提供的帮助会妨碍用户，所以无论提供什么样的额外帮助，都不应该在界面中固定下来。

标准的在线帮助是一个很糟糕的工具。新手不需要参考消息，他们需要概括性的信息，比如一次全局的界面导游。

好的界面设计，不管何种平台都应该能通过导航和功能使用户迅速熟悉产品，并获得舒适的产品体验。

1. 界面的表现模型符合用户的心理模型
2. 界面的概念结构符合用户的心智模型

• 专家想要什么

专家是很重要的群体，因为他们会对市场交易产生重大的影响。专家会听专家的意见，并且对潜在的顾客产生影响。

频繁的使用强化了记忆，对经常使用的工具栏，要求能够快速访问，专家甚至需要所有功能的快捷方式，能记住界面的细微差别。他们会持续积极的学习并且欣赏更新且更强的功能。

应在专业产品上针对专家用户进行设计。专业产品包括开发和创造型工具，科学仪器和非客户型医疗设备等。用户愿意花费大量时间去掌握产品。

• 永久的中级用户需要什么

大多数实际用户却常常是被忽略的。

1. 永久中级用户需要快速进入最经常使用的工具。
2. 工具提示是适合中级用户最好的习惯用法。
3. 永久中级用户知道如何使用参考材料，只要不是必须一次解决所有问题，他们就有深入学习和研究的动机。在线帮助是永久中级用户的极佳工具，他们通过索引使用帮助 ，因此索引必须设计得十分全面。
   • 泳道永久中级用户知道高级功能在哪，即使他们用不到，也不知道如何使用。因为软件具有这些高级特性的事实让中级用户感到放心，让他们确信投资购买这个程序是正确的选择。
     

     第十一章：编配与流（概念原则）

     本章讨论人类心理工程学，讲述如何让产品支撑用户的智力和效率，如何避免破坏用户在投入生产时的专注度。让人们更加高效愉快，在设计交互产品时促进和增强流，并且竭尽全力避免任何打断流的行为。

     • 流与透明

     定义：当人们全身心地投入在某个活动中时，会对周边干扰视而不见，这种状态被称为“流”。流是一种深层次，几近冥想式的投入状态，流通常能产生一种温和的快感，让人察觉不到时间的流逝。

     不论界面多酷，越烧越少：与生产力软件的交互很少会有完全的美学体验。除了娱乐和创造性工具，与软件（尤其是商业软件）交互大多是一个务实过程。

     终极用户界面往往是没有界面，让人们直接面对他们的目标，意识不到软件的介入。如果一件产品和用户交互得很好，交互机制就消失了，让人们直接面对他们的目标，意识不到软件的介入。糟糕的交互设计师会在软件产品中笨拙地展示出自己的身影。

     • 编配

     交互设计师必须训练自己能够听到软件交互的编配中是否存在刺耳的音符，要让一个界面的所有元素应齐心协力地奔向同一个目标，这一点极为重要。如果一个应用程序与用户的交流安排得当，则与软件的交互几乎就是透明的。

     和谐的组织没有固定的规则。不能孤立地看问题，不考虑要解决的问题，也没有考虑用户当时在做什么，或想实现什么。

     • 和谐交互

     尽管没有固定的规则，如下策略能有效设计出与用户“流”相匹配的交互：

     1）遵循用户的心理模型

     不同的人有不同的心理模型，即每个用户/角色心里对软件如何执行都有自己自然的想法。交互设计应该遵循不同用户的心里模型，设计出适应他们的交互体验。

     2）少就是多（目的驱动极简主义）

     理解用户目的

     1. 减少用户界面的元素数量
     2. 减少产品功能
     3. 减少使用产品的难度
     4. 基于用户情境来提供合适的功能，用户不需要经常切换不同界面来完成简单的操作
     5. 防止功能独立，让用户执行一项单独任务，却不能访问相关任务

     3）让用户指示而不是讨论/询问

     理想的交互情景不是对话，更像是在使用工具。用户在界面中指示动作的一个重要方式是直接操作，没有人喜欢被机器责备。

     4）提供选择，而不是提出问题

     根据呈现的信息自由选择，还是被应用程序模态盘问是很不一样的。

     1. 对话框特别是确认对话框（要求用户回答，直到得到答案才会进行下一步或者消失）
     2. 提供功能的工具栏

     提供无模态反馈是指把呈现给用户的信息构建在界面结构中，不打断正常的活动流和交互，那这种反馈就是无模态的。无模态选择有助于给用户带来控制感和掌控感，这正是用户使用数字产品时想要的感觉。

     5）让必要的工具近在咫尺

     为了不要打断用户流，通常把必要工具放在选项板供新手和中级用户使用，提供快捷键供专家使用。

     6）提供无模态反馈

     用户需要在操作工具或者数据时，清晰地显示这些操作的状态和效果是非常重要的。进度反馈是流的一个关键元素。模态反馈是打断用户的（比如弹出对话框）而不打断正常的活动流和交互是用户需要的。

     7）设计要以防万一，但应预测其可能性、

     人们评价开发者的能力，是看创造的软件能处理多少可能出现但未必发生的状况。不过，这并不意味着应该在用户界面中直接处理罕见的可能性。这么做有违所以在界面上，不要让可能发生的事情影响你对几乎必然要发生的事情的处理。

     8）上下文信息

     1. 放在背景中考虑信息
     2. 量化呈现应该回答一个问题：与什么做比较？（条形进度条，扇形统计图等）
     3. （可视化地）显示数据（信息可视化）

     9）反映对象和程序的状态

     用户界面对象的状态也应该对用户是显而易见的。当一个程序休眠时，应该看起来是休眠的，当一个程序恢复，看上去应该是恢复的。

     10）避免不必要的报告

     不要因为不重要的问题而停止进程，打扰用户

     不要用对话框报告（模态），用程序中的状态指示器（无模态）发出令人放心的视觉或者听觉反馈

     11）避免空白状态

     人们不愿意对一件交互产品解释他们想要做什么，尤其是事前。他们愿意看到程序“认为”什么是正确的，然后控制程序完全符合自己心意。多数情况下，程序可以按照设计师的推测，用户的过往或者其他多数用户的偏好作出相当正确的预测。

     对大多数人来说，从空白开始很困难，在别人做好的基础上开始则会很简单。软件只应该做很可能是正确的事情，然后为用户提供强大的工具来调整第一次尝试。

     12）区别命令和配置

     配置和调用一个功能有巨大的区别。任何一个命令调用10次，才设置1次。因此，多数桌面程序有合理的经验法则：在工具栏上放上快速访问功能的按钮，把功能配置用户界面放在菜单中。

     13）隐藏弹射座椅的操控杆

     “射座椅的操控杆“指一些不可逆且一次性的操作或设置。射座椅的操控杆导致两种主要变化：造成应用程序严重的视觉错位，或者执行了不可逆的动作。

     14）优化响应，但容许延迟

     应该用最小的延迟，向用户提供最合适、丰富的交互，还要针对已经选择了但无法重新访问这类情况设计出解决文案。如果延迟不可避免，一定要明确告诉用户，允许他们取消可能导致延迟的操作，理想情况是让用户等待时还能执行其他工作。

     动作、时间与过渡

     动作是表达和说明对象之间关系的强大机制。它使移动应用看起来是响应式的、沉浸式的。

     1）交互中采用动作和动画切换，首要目标应该是支持和增强用户的流状态。有以下目标：

     • 让用户的注意力集中在合适的地方
     • 展示对象及其动作之间的关系
     • 在视图或者对象状态之间的转换中保持背景不变
     • 让人能看到进度或者动作（例如进度条 旋转箭头）
     • 创造虚拟空间，帮助用户实现一个状态向另一个状态，或者从一个功能向另一个功能的转变
     • 激发融入和进一步操作

     2）设计师创造的交互动作和动画，应该努力实现这些交互品质：

     • 短暂、愉快和响应：动画不应该拖慢交互（并因此打断流），动画的时间只应该是完成一个或多个目标所需的时间。在任何情况下不应该超过1s，以保持响应。
     • 简单、有意义和恰当
     • 自然和顺滑：过渡动画，特别是对手势界面提供反馈的动画，应该是感觉几乎像真实的物理交互一样，模拟迟钝、弹性、和重力动作属性。

     动作有节奏时最成功，恰当的时间节奏有助于用户预期接下来出现的东西。可以运用视觉反馈和声音反馈引导用户交互，表达交互效果，或者加强过渡。

     毫不费力的理想

     最好的界面通常不会让用户惊叹它有多漂亮，而是因为能够几乎不会被人注意，毫不费力地使用。

     理解流的重要性，精心编配恰当的界面，谨慎地使用动作和过渡，平缓用户从一个状态或模式到另一个的转变，能够让你的应用有毫不费力之感，让人们在你的应用上工作，看起来就像变魔术一样。

     第十二章：减少工作 消除负担（概念原则）

     用户与数字产品交互时执行4类工作：

     • 认知工作————理解产品的行为、文本以及组织结构
     • 记忆工作————回忆产品的行为、命令、密码、名称和数据对象与控件的位置，以及对象之间的其他关系
     • 视觉工作————弄清眼睛应该从屏幕的哪个位置开始，在其中找到一个对象、解码布局、区分视觉编码的界面元素（如不同颜色的列表项）
     • 肢体工作————按键、移动鼠标、手势（点击、拖动、双击）、在不同输入模式之间切换、导航所需的点击

     软件经常包括一些臃肿的交互，设计师必须将这些必要负担降至最低，同时还要让用户达到目标。

     目标导向任务 vs. 负担任务

     任何大型任务，包含很多较小的任务，有些可以直接实现目标，另外一些不直接实现目标，代表了额外的工作，为负担任务。软件在目标导向的任务和负担任务之间也存在相当清晰的分界线。一些软件的负担任务无足轻重，执行起来不需要太多困难，但是有些负担任务令人讨厌。

     （一）负担的类型

     尽可能消除负担任务，即可提高用户效率和生产力，使可用性上升，打造更好的用户体验。

     1）导航负担

     定义：将用户带到界面全新部分的所有动作，或者要求用户在系统中定位对象、工具或数据的所有动作。

     在软件中导航发生在以下多个层次：

     • 多个屏幕、视图或页面之间导航

     严重转移用户注意力，打断工作流，工作效率和生产力下降：

     1. 初始窗口隐藏
     2. 操心窗口管理
     3. 完全失去方向

     解决办法：独占姿态应用程序

     如果窗口数目很多，那么用户会完全失去方向感，并会体验到导航创伤：迷失在界面中。

     • 窗格之间导航

     相邻窗格可以解决很多导航问题，但当相邻支持窗格数目太多，或屏幕上的摆放位置与用户的工作流不匹配时，就会出问题，也将造成视觉杂乱和困惑：用户不知道到哪查找所需要的内容。同时拥挤迫使滑动，又增加一重导航干扰。

     解决办法：使用选项卡

     如果主工作区有多个不必同时使用的支持窗格，就可以采用选项卡窗格。支持窗格也可以堆叠，用户一次单击即可选择适当的当前任务窗格。example：Adobe illustrator的颜色和色板

     解决办法：使用标签窗格

     在用户导航时，窗格会盖住屏幕之前的内容。但是当需要多个文档或者一个文档多个视图时，这种习惯用法适用主工作区。example：Excel

     • 工具和菜单之间导航

     另一种重要但是被忽视的导航形式是因用户需要使用不同的工具、选项板和功能产生的。这些元素在窗格或者窗格内的空间组织，对于减少额外的鼠标移动非常重要。

     解决办法：经常使用的工具以及一起使用的工具，应该在空间上组织在一起，随手即可访问。

     • 信息的导航

     信息（或窗格、窗口的内容）的导航有几种方式：滚动（平移）、链接（跳转）、缩放。

     滚动（平移）：尽可能减少
     滚动（平移）和缩放：浏览2d和3d信息的导航工具。一起使用时，会产生导航困难

     设计师应该了解用户的心理模型和工作流程以确定最合适的选择。

     2）拟物化负担

     定义：人们自然而然倾向于在新的数字环境中使用旧的表达，这可称为拟物化。

     很多机械时代的方法不应该照搬到数字世界中，这些呈现方式产生了负担，而且毫无必要地限制了交互。拟物化负担源于在数字世界中原原本本地复制机械时代的动作，因此给导航增加了负担。

     3）模态负担

     某些中断不可避免，但毫无理由中断用户的流就是愚蠢地停止进程，是一种最具破坏性的负担。

     • 错误、通知和确认信息

     典型的模态错误信息没必要出现，要么告诉用户不关心的东西，要么要求用户修复某种理应由程序修复的情况。

     • 让用户请求许可

     任何输出之处应允许输入。

     4）样式负担

     视觉负担的一大来源是过度使用图形和界面元素。视觉样式可以营造气氛，强化品牌，但不应牺牲实用性和可用性，强迫用户理解视觉元素来区分控件重要信息和装饰。

     （二）负担取决于情景

     不同情景中，一个人（或人物模型）的目标导向任务可能就成了另一个人的负担任务。一般来说若用户并非自愿而是被迫使用，那就是负担。确定像这样的一种功能或动作是否属于负担的唯一方式是与人物模型的目标做比较。

     软件姿态不同，负担也有变化。暂态应用程序并不常用，所以用户需要更多的帮助来理解程序的功能，记住如何控制程序。但对于独占式应用，哪怕一点点负担，也很烦人。

     （三）消灭负担

     导航负担是数字产品中最普遍的负担，也是入手点。以下为主要方法：

     • 减少要去地方的数量

     详细规则间230页。

     • 提供导航标志

     导航标志可以增强用户的定位能力，并且导航标志最好使其永久固定。（比如菜单和工具栏是永远在哪里而且固定的）

     让网站的每个页面长相类似，可以保持视觉连贯，但如果页面太相似也会引起混淆。你当然应该在每个页面上统一使用共同元素，但让不同空间有变化可更好地帮助用户定位。

     • 提供概览

     提供概览可以帮助用户定位内容。

     “面包渣“提供导航帮助和导航控件
     注释滚动条：工具提示在滚动时一直显示

     • 恰当地把控件映射到功能上

     映射描述了控件、它所影响的事物以及预期结果之间的关系。如果控件所影响的对象无法在视觉、空间和符号上产生关联，那么就是糟糕的映射。

     控件到功能的糟糕映射增加了用户的认知负担。无论是设计家电、桌面应用还是网站，产品都可能存在映射问题。即使没有多少时间改变，只要找到并解决映射问题，就能显著改善产品，令产品更容易理解。

     • 避免层级关系

     用户很难用抽象层次来成功导航，除非层级基于用户的心理模型且分类完全互斥，而程序员难以理解这一点，因为他们早就习惯了复杂的层级和逻辑关系，这和用户心理模型冲突。单层分组是用户通常带入软件中的心理模型模型。

     • 不要复制机械时代的模型

     移动设备和桌面上的纸质日历见证着机械时代的思维如何影响我们的设计，如果不分析用户目标来做产品，软件就会充满负担，停留在机械时代。更好的软件是建立在信息时代的思维方式之上的。但是，重大的改变必须显著优秀。

     多数日历内部以连续的方式处理时间（实现模型），仅在用户界面（呈现模型）才渲染成离散月份。新的数字模型让时间连续，允许用户跨月安排时间。

     （四）常见的负担陷阱

     • 不要强迫用户到另外一个窗口去完成与本窗口相关的功能
     • 不要强迫用户记住事物在层级文件系统中的位置
     • 不要强迫用户调整窗口大小。当子窗口在屏幕上弹出时，程序应该为内容调整合适大小，不要大而空，或者太小而需要不停地滚动。
     • 不要强迫用户移动窗口
     • 不要强迫用户重新设置
     • 用户在填充字段时需要能有任意完整度。如果 用户想忽略一些细节，不要强迫用户输入，假定用户有充足理由不输入。多数情况下，数据库的完整性不值得骚扰用户。
     • 不要强迫用户请求许可，比如输出时不允许输入这一问题。
     • 不要让用户确认其动作，需要具有强大的撤销机制
     • 不要让用户的行为产生错误

     ---

     第十三章：隐喻、习惯用法及能共性（概念原则）

     （一）界面范式

     用户界面的概念和可视化设计中主要有3个：

     1. 实现中心范式：基于对事物工作原理的理解
     2. 隐喻范式：基于对事物工作原理的直觉
     3. 习惯用法范式：基于人们学习如何实现目标的过程

     交互设计经历了几次转变：从技术（实现）中心到隐喻中心，再到近来的重视习惯用法。

     • 实现中心范式界面

     多数用户不想知道太多，他们只想成功地使用产品：

     1. 人们必须学习软件内部如何运行，才能成功理解并使用界面，这意味着用户界面建立在实现模型上。
     2. 不是依据用户考虑信息的方式来组织，而是按照公司或者组织的部门拥有的用户信息来设计的。
     • 隐喻范式界面

     定义：不必了解软件的运行机制，隐喻范式界面依赖于用户用在真实世界的实际经验在界面上建立视觉与功能之间的联系。隐喻要假设人们能够理解事物，可以小至工具栏按钮上的小图标，大到某些程序的整个屏幕：比如一对剪刀表示“剪切”。

     1）直觉、本能与学习

     直觉：直觉通过推理起作用。我们理解界面隐喻元素的含义，因为心理上把它们与我们之前学习过的东西联系起来，所以我门理解界面隐喻元素的含义。

     本能：本能是内在反应，不需要有意识地进行思考。

     隐喻界面有效利用人脑强大的推理能力，但因为这种方法依赖于用户的特殊思维，所以人们可能因为没有建立这种联系所需的语言、学习经历或者推理能力而失效。

     2）全局隐喻的局限性

     把界面与机械时代的制品绑在一起，大大增加导航成本，不要让界面强行适应隐喻。

     3）隐喻的其他局限

     1. 隐喻不易调整，随着程序的规模和复杂性的增加可能会失效。文件太大，以文件图标来移动文件就太笨拙，效率不高。
     2. 简单的实物找到视觉隐喻很容易，但为进程、关系、服务、变体找到隐喻却很难，而这些抽象概念在软件中却频繁应用。
     3. 隐喻依赖于设计者与用户有着相似的联想，如果用户没有和设计者相似的文化背景，容易导致隐喻失败。

     4）例外

     全局隐喻用在游戏还好，但用在以效率为主的地方则不好。

     结论：一般来说，应该避免使用隐喻和拟物化用户界面。数字合成器也并不完全用隐喻才能成功或有表达力。随着人们渐渐使用多点触摸显示器代替硬件控制的配件、工具、乐器，有理由预期现实世界的隐喻终会消失，而由这种经过优化、富含表达力的手势的惯用界面来替代。

     • 习惯用法范式

     习惯用户也被称为“设计原则”。设计习惯用法基于我们学习并使用习惯用法的方式，并不关注技术或直觉，而是通过学习简单、非隐喻的视觉或行为习惯用法来完成目标和任务。

     一般称为“设计规范”，由有影响力的大公司所制定，能否成为规范取决于设备或软件的受众。

     1）图形界面大都是习惯用法范式

     它们都是我们学习过的习惯用法，而不是具有隐喻意义的直觉，人们历来认为具有隐喻含义的常见图形用户界面元素，实际上是习惯用法。关于习惯用法，很关键的一点是，习惯用法虽然必须学习，但很容易学习。所有的习惯用法都需要学习，好的习惯用法只需学一次。

     经常发现我门习以为常的用法，父母却无法识别，无法自主学习。界面设计没有使用隐喻范式，但是他们又
     没有学习过设计师默认用户会的习惯用法。如何能帮助他们学习？

     （二）创建习惯用法

     创建好的习惯用法，所有易学的交流系统都遵循以下模式：

     原语：图形用户界面易于使用的原因在于推行有限的交互词汇，交互词汇的基本元素越多，学习成本越高。

     组合：通过组合一个或者多个原语创建而成。

     习惯：组织了领域知识，工作模式和目标，用大量的词汇来表达程序试图解决的问题。

     （三）手动能共性

     手动能供性指我们认为对象能做什么，而不是它实际上能做什么。能供性的实现预期：要确保你的程序兑现它手动能供性所表现的期望。

     近年来扁平化和视觉极简的用户界面，为了视觉上的简化，移除了这些虚拟手动能供性，实际影响到了易用性。

     • 手动能供性的语义学

     一个未加修饰的虚拟的手动能动性无法提供的是，对执行之后完成哪些功能的提示。

     • 能共性的实现

     和现实世界不同，软件无法简则其因果关系，人们不能从本能或者直觉中获得帮助，所以控件必须有文本或者图标标签来指明其意义，或者依靠以前的知识和经验。

     （四）直接操作与顺从

     “直接操作”是一种界面设计策略，由三部分组成：

     1. 应用所涉及数据对象的视觉呈现
     2. 在对象上执行的视觉和手势机制
     3. 这些动作的即刻可视结果

     丰富的视觉反馈是成功的直接操作的关键。因为用户在此过程中所看到的重要性可以更精确地称为“视觉操作”，虚拟手动能共性和丰富的视觉反馈都是直接操作界面的设计关键元素。

     • 直接操作的使用（优点）

     在设计上，可以使用直接操作指向我们想要的东西，直接操作原则适用于多种情况。直接操作简单、直接、易用、也易于记忆。

     创作工具、艺术工具和设计工具提供了对对象的高度直接操作，对于图形显示数据来直接操作的直接操作界面很少要求输入复杂的数值数据，而是直接显示数据。

     直接操作的习惯用法正如多数习惯用法一样，首先必须学习，因为这些交互的可见和直接等性质，与现实世界的物体交互很相似，学习这些习惯往往很容易。学会之后，几乎不会忘记。

     • 直接操作并不总是适合（缺点）

     直接操作用起来经常很难完成好任务，因为这种设计要求用户直接完成任务，而用户可能并不擅长。即是很多直接操作的用法很普通，但要求有很强的目的感，要求用户发展自己的技能，能有效得完成复杂任务。

     在设计直接操作的时候，谨记这些挑战，根据任务模型的技巧和使用背景，判断是否需要直接操作。

     • 顺从与提示

     尽可能用视觉表达顺从：

     1. 以静态视觉能共性作为对象本身的一部分
     2. 动态地改变对象的视觉能共性，以适应输入焦点或者其他系统时间变化
     3. 就桌面光标设备而言，当鼠标经过并与对象交互时，改变其视觉能共性

     1）静态提示

     定义：对象的顺从从通过对象本身的静态渲染来传达。比如一个三维的按钮，让人觉得可以按下去。

     这和隐喻不一样，隐喻建立视觉与功能之间的联系，而静态渲染提示一个行为操作

     静态提示对于桌面界面不切实际，但非常适合移动用户界面。移动界面对象少，必须足够大才能让手指去操控，这就为能共性所需要的视觉线索留出了足够的空间。而当前移动ui的趋势是扁平化和视觉元素简化，不管是从创造视觉层次，还是从指示顺从和能共性的角度来看，移动视觉上虽然变得简单，但学习越来越难。

     2）动态提示（桌面）

     动态提示最常用于桌面应用的用户界面。一般这样工作：光标经过一个顺从的对象，该对象就暂时改变外观。遗憾的是，触屏设备没有动态提示，设计师和用户只能使用顺从状态时的静态提示。

     3）顺从响应提示（桌面）

     顺从响应对于调用动作或改变状态的控件来说，是很重要的反馈机制。让用户知道，一旦松开鼠标键，就会出现某些动作。

     4）光标提示（桌面）

     通过鼠标经过对象或者屏幕区域时改变光标的外表传达顺从。

     （五）逃脱隐喻的掌控

     第十四章：重新思考数据输入、存储与检索（行为原则）

     实现模型思维在数据管理上体现得最明显：输入、存储、检索数据。

     （一）重新思考数据输入

     • 数据完整 vs. 数据免疫

     为了避免垃圾数据进入系统，在数据录入时做严格检查，保证数据的完整。这种方法把数据库的需求置于用户需求之前，认为用户是无关紧要的，软件是无所不能的，用户是为软件工作的。

     不屏蔽不良数据，而要让系统不受信息不连贯和中断的影响。这种方法需要创造更加聪明、更加先进的程序，能够处理数据置换，让程序具有某种数据免疫力。

     我们设计程序时，必须让程序相信，用户输入的是他所希望的。如果用户希望改正，无须程序反复提出“改正”，用户就可以改正。而程序应在其他地方寻求帮助：是否有模块知道如何将字母解释为文本数字？是否有修改历史记录可以解释用户的意图？

     • 处理丢失数据

     程序不要为了指出错误阻止用户录入数据，如果有必填字段缺失，可以通过丰富的无模态反馈（rich modeless feedback）告诉用户，而不是停止一切工作。

     程序用无模态反馈巧妙的视觉和听觉线索通知他数据输入错误，就能实现高效率。

     程序还应该帮助用户校验，程序应该提供不唐突的无模态来反馈录入的工作状态。

     多数信息处理系统都能容忍信息缺失，缺失的数据几乎总能通过记录中的其他数据重构出来，实在不行也总能询问交易涉及的各方面来重构。

     • 数据输入的规避机制

     策略:让用户做他们想做的，用计算机详细记录下这些动作，这样可以完整地追查责任并可以恢复。

     • 审核与编辑

     不管用户输入什么，程序都要接受。程序应该清楚地指出可能有问题，不要尝试修正问题；程序应该记住用户的每个动作，保证每个动作能够明确地撤销，不会损失关联信息，让用户弄清楚程序认为问题出在哪里。

     重新思考数据存储

     用统一文件模型修复数据存储

     设计合理的软件应该始终把文档当作一件事来处理，而不是磁盘或内存中的一个副本。这样用户永远不用被迫面对计算机的内部机制，对在磁盘和内存之间写数据的管理是文件系统的工作。

     • 自动保存
       自动保存功能不能影响用户界面的响应，保存要么应该是后台进程，要么在用户与程序停止交互时执行。
     • 创建副本
       创建副本的操作不应该用对话框打断用户。
     • 命名和重命名
       文档的名字应该显示在应用程序的标题栏上，如果用户决定重命名文档，可以单击标题栏直接在标题栏编辑。
     • 在文件系统中存放和移动文档
       把文件放在用户能找到的地方。
     • 指定文档的格式
       从用户角度看，文档格式————无论它是富文本、纯文本还是word格式，都是文档的特征，而不是磁盘文件的特征，指定文件的格式不应该和保存文件到磁盘的操作关联起来，放在文档属性对话框中更合适。
     • 还原所做更改
     • 放弃所有更改
       程序应该有一个明确支持这个动作的功能。另外因为放弃所有更改会丢失重要数据，所以应该有清楚的警告标志来保护用户。
     • 生成一个版本（自动保存副本）
       应清楚地告诉用户版本列表，每个版本的统计数据，可以让用户回到任意一个版本。应该有规律地生成版本，以防用户自己没有定时创建版本。
     • 沟通状态

     重新考虑数据检索

     一个设计良好的检索系统，还可以让用户基于属性搜索文件，还可以让用户按同义词、相关主题或者具体文档的指定属性查找文件。

     用户很少能提前表达自己想要什么；其次，即使能表达具体需求，也会经常改变主意。

     另一种方法是“受限的自然语言输出”，即程序为用户提供一系列有限控件，让用户从中选择。控件产生自然语言输出，可以让用户直接使用自然语言选择。

     ---

     11/25/19

     page：287

     第十五章：防止错误、通知决定（行为原则）

     运用富视觉非模态反馈

     • 富视觉非模态反馈（rich visual modeless feedback）

     定义：按习惯方式利用屏幕上的像素（通常是动态的），不需要用户做特殊动作或者转换模式（非模态），就能让用户看到和理解这些反馈。

     哪类状态信息对用户来说是至关重要的？想一想如何才能表达这些信息？当用户注意到并且学会了这种呈现方式，他们看一眼就能知道发生什么（如果用户要求的话，仍要给用户提供一个途径获取完整而详细的信息）。

     它不适合初学者，用户需要随着时间的推移才会开始使用富视觉非模态反馈。用来代替警告和严重错误警示的富视觉非模态反馈必须得让用户格外清楚其含义才行，确保这类状态能传递更多信息但不那么重要的富视觉非模态反馈得到视觉上的强调。

     • 听觉反馈
       • 避免负面听觉反馈
       • 提供正面声音反馈

     定义：成功的时候工具发出声音，称为正面听觉反馈。

     人都不喜欢喜欢被告知自己失败了，错误信息框是负面反馈，告诉用户犯错了。沉默能确保在没有声音提示情况下，用户也能知道自己做错了。软件应该像键盘一样，给我们发出持续、微弱、听得到的线索（像敲打键盘得到的声音反馈一样）。

     用户操作正确的时候，如果应用程序能够发出细微但容易辨识的声音，会更加友好易用。每次用户在某一字段里正确输入时，应用程序能发出肯定的声音，如果应用程序不能理解所输入的东西， 则应保持沉默，悄悄告诉用户问题所在，允许用户修正。

     撤销、恢复和可逆的历史操作

     1）撤销应当遵循心理模型

     1：“犯错”的用户心理模型
     用户通常不相信自己会犯错，至少是不想相信。遵循人物模型的心理模型，意味着他不应受到责备。
     用户界面设计师应该抛弃用户会犯错这一观念，用户做的任何事，都是他们认为正确且正当的。

     2：撤销让人敢于探索尝试
     撤销是一个软件在用户界面中协助探索的主要工具。如果用户改变主意，它能让用户撤回一个或多个先前的动作。大多数人还是愿意探索的。

     撤销还有一个纯粹心理意义上的重要价值：让用户安心。

     3：设计撤销功能
     成功设计撤销系统的秘诀在于，确保其能够支持常用工具，并且避免（以视觉、听觉或者文字）暗示用户操作失败。他不能帮助用户实现目标，但能防止意外事件将用户的努力毁于一旦。

     2）撤销的共通类型

     1：渐增动作和过程动作
     渐增动作：包含数据部分的操作
     过程动作：无数据的转换，在数据上没有添加、修改或删除数据的操作

     2：隐蔽撤销和解释性撤销
     隐蔽撤销：没有指明撤销具体是什么的动作
     解释性撤销：包含了特定操作的文本或视觉描述的撤销操作

     3：单次撤销和多次撤销
     单次撤销：只撤销用户最近一次操作，在本次操作和上次操作中循环
     多次撤销：能撤销多个先前操作（局限性：用户不可只撤销想撤销的那一步，必须把那一步之后的所有操作撤销）

     花时间仔细看下自己的应用，看哪些应该可以撤销。

     4: 不连续的多次撤销

     可以不按顺序，挑选几个予以撤销，剩下的保留。

     5: 分类撤销

     给每一个特定的操作类型设计单独的撤销功能。

     6：已删除的数据缓冲区

     7：版本控制和还原

     8：冻结

     第十六章：为不同的需求而设计（行为原则）

     本章将讨论满足一些广为人知的，满足用户不同需求的策略：

     交互产品如何满足用户基本使用需求

     1. 易学性和帮助
     2. 可定制性
     3. 本地化和全球化
     4. 无障碍性

     （一）易学性和帮助

     1. 命令模态
     2. 有效功能工作集
     3. 上下文帮助和辅助界面
     4. 传统的在线帮助

     1）命令模态

     概念：让用户将这些指令发给应用的特殊技术。体贴的用户界面会提供多重命令模态，每个都会调用一个单独的特定命令，让用户可以根据自己的喜好来操作应用了。

     简单来说,用户界面是用户向计算机输入数据和发布命令的方法,数据输入通常相当直接：向语音识别算法口述, 在空白页或文本框打字, 用手指触摸, 点击和拖曳对象,或者从菜单或类似的小工具中选择一个值。 激活功能的命令要难学一点，因为用户既要知道哪些命令可以使用, 又要搞清如何使用这些命令。
     命令模态是让用户将这些指令发给应用的特殊技术。直接操作柄、下拉菜单和弹出菜单项、工具栏控件以及快捷键等都是命令模态。
     对于菜单项、工具栏项目、快捷键、手势或者直接操作控件等重要功能，体贴的用户界面往往会提供多重命令模态(multiple command modality), 每个都能调用一个单独的特定命令。这种冗余可以让拥有不同技能和天资的用户根据个人能力和喜好来操作应用了。移动应用不能承裁那么多的命令模态, 代价是在寻找特定功能时, 可搜索的界面元素也少。

     • 直接操作柄
     • 下拉菜单
     • 弹出菜单项
     • 工具栏控件
     • 快捷键
     • 对话框
     • 命令菜单

     模态1: 教学式模态

     • 用户以查看的方式，用描述性语言教会用户如何使用来教授行为。

     有些命令模态会给新用户提供更多帮助。 对话框和命令菜单，用描述性文本教会用户如何使用。所以以这种方式呈现的命令被称为教学式模态 (pedagogic modality), 这些命令以查看的方式来讲授自己的行为。 初学者使用菜单的教学式行为学会使用新应用。但是中级用户总想撇开菜单, 找到更加直接有效的工具，这些工具是直接命令 (immediate command) 和隐形命令 (invisible command)。

     如传统桌面应用程序的菜单栏中的命令

     模态2: 直接命令

     • 直接操作控件如拖放处理、 实时操控控件如滑块和旋钮、 甚至普通按钮及各种工具栏变体。

     即时模态在数据 (或者数据的表现形式) 上生效, 不需要中间步骤。 不论是菜单还是对话框, 都没有这种即时属性。 二者都需要一个中间步骤,有时候甚至不止一步。

     如实时操控控件如滑块和旋钮

     模态3: 隐形命令

     • 可视界面上不显示这些命令,只有隐形的按键, 滑动、挤捏或者轻弹手指。

     快捷键和手势进一步拓展了这个创意:可视界面上不显示这些命令,只有隐形的按键, 滑动、挤捏或者轻弹手指。 这种类型的命令界面则属于隐形模态 (invisible modality)。用户必须记住隐形命令, 因为通常界面上没有或者只有少许提示这些命令的存在。隐形命令还要一开始勍向用户标示出来，除非它们遵循广泛使用的惯例(例如在触屏上上下滑动来滚动界面)，或者通过可靠的途径告知新用户存在这些命令。隐形命令广为中级用户设置,更多地为高级用户所用。

     如command+v快捷键

     《设计心理学》中用现实中的信息和头脑中的信息来指代用户获取信息的两种不同方式，头脑中的信息比现实中的信息更易用，更快。

     诺曼所谈论的现实中的信息, 是指环境或者界面中信息提供不充分,不足以完成某些事情。例如, 挂着商业中心地图的电话亭就是现实中的信息。 人们不用记住金字塔的确切位置, 因为查阅地图就能找到它。
     相对应, 头脑中的信息, 即你已经学会或者记住的信息, 就像街头小巷的近道, 任何地图都是不会标出来的。
     头脑中的信息比现实中的信息更易用, 也更快, 但前提是得确保已学了, 未忘且最新。 现实中的信息虽更慢、 更麻烦, 但是非常可靠。
     教学式命令旨在通过现实中的信息来学会。 而隐形命令必须记住, 因此属于头脑中的信息。直接命令则介于二者之间。
     菜单项或者对话框属于教学式命令, 是因为它们必然充满了上下文信息。 而快捷键是隐形命令, 因为需要用户记住其功能及对应按键, 可能不会在可视界面上显示出来。

     1. 教学式命令：现实中信息来学习
     2. 隐形命令：必须记住的头脑中的信息
     3. 直接命令：介于两者之间

     记忆矢量

     新用户喜欢教学式命令, 但是当他们进步为中级用户, 缓慢、 重复、 冗长的教学式界面似乎开始变得乏味了。 用户想要找到更多直接命令来完成常用任务。 这种期望很自然也很恰当, 而且, 软件要想做到易用, 就必须满足用户的这种期望。 解决方案分成两步: 首先, 除了教学式命令之外, 还必须提供直接 (或者隐形) 命令; 其次, 必须提供一个途径, 让用户学会每个教学式命令相对应的直接命令。 这种途径称为记忆矢量 (memorization vector).

     给用户提供记忆矢量的方式有好几种：

     效果最差的是仅在用户文档中提一下；稍好一点的,是在应用的主在线帮助系统里提到, 不过这个方法仍然效果不佳；这些方法要麻烦用户去寻找记忆矢量, 而且是让用户自己意识到需要自己先寻找记忆矢量。

     用户需要自行查找

     再好一点的方式是把记忆途径直接集成到主界面。大多数桌面应用的菜单已经有了两种标准的方法。

     记忆途径居于主页面，无需查找

     值得注意的是, 移动操作系统常见的记忆矢量, 可能是因为没有“闲置” 空间或者复合交互来放置这些信号。 移动操作系统上与记忆矢量最类似的是用户初次使用设备或应用时演示的首次运行导览和教程。

     无论是pc还是mobile，因为空间问题，我们希望看到设计师多维度解决用户记忆矢量问题的创新设计
     图标按钮用图标来提供从菜单向工具栏过渡的矢量记忆，是一个优秀的技术

     2）有效工作工作集

     常做的事情总会重复（通过重复），中级用户最终会记住一部分命令和特性。这一组记下来的特性就是有效功能工作集（working set）。组成用户工作集的命令对用户个人来说都是特殊的，经过相似使用模式的用户工作集可能会有相当大的重叠。

     设计师在提供直接访问的最小工作集的同时，还需要提供其他方法把其他命令提升为直接模态

     3）上下文帮助和辅助界面

     最好的应用程序帮助应当在适当的时间、合适的位置在界面上提供辅助，但不需要用户打断流去把它找出来。无论是用户在第一次使用某个应用软件，还是使用单个的控件或特性的时候，大量模式支持上下文帮助，或者帮助用户更容易得完成任务。

     • 导览教程和覆盖层教程

     导览教程通常会在应用第一次运行的时候自动启动，有时如果应用软件发布的新版本有重要的新特性，也会自动启动。合理得解决了用户初始学习问题。移动端更依赖于直接和隐形的命令模态（因为没有足够的空间来容纳教学式命令模态）。

     导览教程的每一个屏幕上都应该有一个“跳过”按钮，覆盖层就像在界面上放置了一层透明薄片，薄片上嵌入了箭头和描述性文本。最终结果是一 组注释，指出了应用的关键特性或者行为，简要描述其用法。指导教程不会超过5～7屏幕，用户会不耐烦或者记不住。

     刚刚下载一个app，教新手如何操作

     • 库和模板

     设计原则：给用户提供一个现成模板库

     比如，在新建word的时候，会有很多可选模版

     • 输入与内容区域提示

     一种常见却不明显的情境帮助是“提示”(hint): —块小小的文本，通常用灰底，在输入 字段提供 简要说明或者使用范例。

     灰色的文字提醒，告诉你应该做什么，比如“you can add photot by tapping"

     • 向导的优缺点

     向导(wizard)是微软发明的一个习惯用法，迅速在开发者和用户界面设计师中风靡。向 导带领用 户进行一系列的操作步骤，向导的每个对话框都会按顺序问用户一到两个问题，最后应用会执行用户请求的配置任务。 尽管 问题的用意是好的，但是向导连珠炮弹似的提问，会让用户觉得像是在受审问，而且违反 了提供选择而 不是提问题(见第 11 章)这一设计原则。

     某些情况下，向导是合适的。一种情况是初次配置某一硬件设备时，需要注册、激活以及设备、服务握手等。iPhone 和 iPad 在让用户进入主屏幕之前，会开启一个简短的向导，让用户选择语言、激活各种服务。

     创建向导的更好方法是做出简单、自动的功能，不问用户任 何问题。 直接把活儿干完，合理地推测出(基于过往行为或者使用精心调查出来的默认情形) 恰当的属性和结构。 然后用户可以使用标准工具，把输出改成自己认为合适的样子。也就是说， 最好的向导实际上更像智能版本的库或者模板。

     • 工具提示(tooltip)

     工具提示是非模态交互帮助的一个例子，适用于pc或者触控笔应用非常有效。

     鼠标移动到哪里，哪里就有解释提供帮助

     • 覆盖式工具提示(tooltip overlay)

     通常由点击帮助按钮触发，针对主要功能的短板，工具提示一样的标签或者注释显示在当前屏幕上。覆盖式工具提示都是一起出现的，模态呈现，通常有个关闭按钮，点击关闭所有提

     “弹出式帮助”(pop-up help)

     4）传统的在线帮助

     • 概述(overview)

     例如，用户想要知道“输 入宏”命 令的工作原理，帮助系统的解释是“把宏输入到系统的功能”，这个解释一点用也没有。 用户要知道的是 适用范围、效果、力量、优势、缺陷、通用过程、为什么非要用这个功能、与 其他供应商的同类产品相 比为什么要用它。

     • 应用内用户指南

     应用内用户指南不应该是帮助的首选，而导览教程和覆盖层教程才是。有时候，重新制作界面提高其易学性，比创造一个真正好的索引要容易。尽管好的在线帮 助非常有用，通常也很关键，但那也扶不起一个设计糟糕的产品

     比如Excel的搜索

     （二）可定制性

     1）个性化

     人们喜欢照自己的喜好改变周围的事物。即便是初学者都想给常用的应用贴上自己的印迹, 完全按 照自己的偏好来改变，使应用软件体现自己的独特品味，更遑论中级用户了。个性化(personalization)这个词描述的就是对持久对象的装饰或修饰。

     • 给持久对象添加装饰有助于导航：

     个性化让用户的工作场所更亲切，更熟悉，更人性化

     • 移动持久对象却会阻碍导航：

     习惯之后的调整会很难适应

     2）配置

     配置对于专家用户来说是必需的。专家用户已经不需要比较传统的导航辅助，因为他们对 产品了 如指掌。专家用户可能每天都花好几个小时使用该应用软件，实际上，他们完成的大部 分工作可能使用的都是该应用软件。

     中级用户和专家用户的目的都是更好更高效得完成任务。只要应用能完成工作，多数中级用户不能配置应用，也不会咆哮。只要应用软件还能照他们预想的那样运行，他们还是会使用并欣赏这款应用的。

     灵活性非常重要，个性化和配置直接存在灰色区域。企业的it经理很重视配置，微软 Office 应用程序成为市面上配置度最高的套装软件并非偶然。

     用户的目的都是更好更高效得完成任务，无论个性化还是配置都是为了帮助用户更好的使用软件。
     如何给用户提供更多的选择，参考性的建议，易用的模版？

     3）特质模态行为

     通常，可用性测试表明，用户在用户界面习惯用法的效用问题上，几乎平分成两半：一半用户明确偏好一种习惯方法，而另一半用户则偏好另一种方法。他们的偏好是特质模态的。

     设计师必须满足也可以满足各个阵营的用户的需求。

     （三）本地化和全球化

     本地化(localization)指的是按特定的语言和文化翻译某个应用软件。全球化(globalization) 是指 让应用软件尽可能地在多种语言和文化下通用。没有隐喻意义的习惯用法对于全球化的界面来说应该相当安全。

     在创建必须本地化的界面时，需要谨记以下几点:

     • 有些语言中单词和词组比较长。例如，德语单词平均会比英语单词长很多，而西班牙语的句子往往比其他语言的都要长。要相应地安排按钮及其他文字标签的排列，尤其在空间有限的移动设备上。

     • 有些语言的单词，尤其是亚洲语言，很难按字母顺序排序。

     • 不同国家使用日、月、年的顺序不同，使用 12 小时制还是 24 小时制也不同。

     • 数字和货币中小数点的使用方式不同。有些国家逗号和句号的使用方法和美国不一样。

     • 有些国家使用星期记日(例如，第 50 周表示十二月中旬)，有些国家使用的历法也跟公历不同。

     (四）无障碍性

     无障碍性(accessibility)设计意味着，设计应用时应考虑到，无论是因为年龄、事故或疾病而有认知、感官或者移动障碍的人，还是没有此类障碍的人，都能够有效使用所设计的应用。

     1）无障碍的目标

     必须满足下列条件:

     • 用户能够感知和理解所有的指示、信息和反馈。

     • 用户能够感知、理解并轻易地操控所有控件并进行输入。

     • 用户能够轻易地导航，并且总能知道所处界面的位置及其导航结构。

     2）无障碍人物模型

     在设计的搜索和建模阶段，作为无障碍措施的一部分，可能会考虑创建一个无障碍人物模型(accessibility persona)，加入到人物模型集中。当然，创建这个人物模型最理想的方法，是采访那些 因为残障而影响使用产品的用户或者潜在用户。如果该方法行不通，还有一个针对性较弱的方法，创建一个临时人物模型，来帮助把重点放在无障碍问题上。通常，无障碍人物模 型会被当做次要人物模型， 它除了和主要人物模型有同样需要外，还有特殊需要，必须在不牺 牲用户体验的前提下，解决这些需求。 不过有些情况下，把无障碍人物模型当做主要人物模型 能够产生突破性的产品，正如 0X0 和 Smart Design 用 Good Grip 产品做到的一样——结果表明， 为患有关节炎患者优化的厨房工具，能让所有人更满意。

     3）无障碍指导方针

     1. • 利用操作系统的无障碍工具和指南。
     2. • 不能覆盖用户选择的系统设置。
     3. • 启用标准的键盘访问方式。
     4. • 为视觉不佳的人加入显示选项。
     5. • 提供只有视觉和只有听觉的输出。
     6. • 不要有闪动、闪烁、闪现等视觉元素。
     7. • 使用简单、明确、精练的语言。
     8. • 响应时间要能满足所有用户。
     9. • 使用一致的布局和任务流程。
     10. • 给视觉元素添加文本释义。

     利用操作系统的无障碍工具和指南。

     有些操作系统为视觉障碍者提供无障碍支持，如屏幕阅读器，以及声音导航辅助，如 iOS 的 VoiceOver 和 Android 的 TalkBack。

     1. 如果按键或手势已经用于为应用程序功能激活系统级无障碍特性，你的应用程序就不 应该使 用这些按键或者手势。
     2. 打开无障碍特性时，应用要能正常工作。
     3. 尽可能使用标准应用程序编程接口(API)进行输入，以保证与操作系统和第三方辅 助技术兼 容，如屏幕阅读器等。

     为视觉不佳的人加入显示选项。

     • 高对比度(不低于 80%)显示选项，在白色背景下，用显眼的黑色文本显示

     • 放大字体和加粗选项(最好能单独设置)

     • 如果可行的话，信息的展示还要为色盲用户考虑

     • 在默认界面中使用时，还要有减少界面元素动作和动画的选项。

     不要有闪动、闪烁、闪现等视觉元素。
     闪光或者其他形式的闪烁, 速度超 过每秒两次(2Hz),就会让视觉障碍用户晕头转向，还会导致患有癫痫及其他脑部紊乱 症状的病人疾病 发作。此外，对其他人来说，这也是很恼人的。自动滚动文本及其他动画，会 给视觉障碍用户带来困难， 让他们陷入混乱。

     使用简单、明确、精练的语言。
     越容易学会和使用。

     响应时间要能满足所有用户。
     允许用户选择较长的响应时间。根据经验来看，较长的持续时间约是应用程序中当前平均 响应时间 的 10 倍，包括简短通知从发出后的持续多长时间。
     该原则也适用于任何动作的计时器。
     通常情况下， 除非确有足够理由(如安全问题)，最好不要给动作设定超时时间，如果非要设定 的话，也要允许用户自己调整。

     使用一致的布局和任务流程。
     对于具有认知、运动神经或者视觉障碍的人来说，如果只需要记住并使用一种导航和动作范式，而不是几种不同的甚至相互矛盾的范式，那就得到 了最佳服务。

     给视觉元素添加文本释义。
     最后，确保桌面应用或者网页上的任何纯视觉元素或控件都标注了文本，以便屏幕阅读器 能够清 晰地读出来。
     例如，微软 Windows 就有隐形的工具提示，屏幕阅读器能把它们读出来。 在默认应用中， 用户是看不到这些提示的。

     ---

     03/21/20

     第十七章：整合视觉设计（行为原则）

     本章将讨论有效的目标导向视觉界面设计策略

     交互产品通过视觉完成目标

     1. 视觉艺术与视觉设计
     2. 视觉界面设计元素
     3. 视觉界面设计原则
     4. 视觉信息设计的原则
     5. 一致性和标准化

     （一）视觉艺术与视觉设计

     艺术是围绕情感或者思维关切的主题，是向艺术家，有 时向社会总体表 达自我的方式。给艺术家强加的限制很少，艺术家努力打造的产品越非凡独特，价值就越高。视觉设计师的重点则是清晰沟通。清晰地阐述用户体验目标和商业目标，对于设计界面中用以支撑品牌身份、用户体验和情感响应的部分来说，是宝贵的基础。

     （二）视觉界面设计元素

     视觉设计关注的是如何处理和安排可视元素，传达行为和信息。视觉构成中的每一个元素都有多种属性，共同创造含义。

     1. 情景，情景，情景
     2. 形状
     3. 大小
     4. 颜色
     5. 方向
     6. 纹理
     7. 位置
     8. 文字与版面
     9. 信息层级
     10. 动作及其时间的变化

     1）情景，情景，情景

     每一份设计指南都要关注其使用场景。

     2）形状

     人们倾向于通过轮廓来识别对象。

     3）大小

     大小是有序和量化的变量，人们按照物体大小排序，倾向于给这些差异赋予相对数量。大小在表达层级关系上很有用。大小差异足够大时，可以迅速吸引注意力，但要注意的是，这样也有可能增加成本。

     《图形符号学》中认为，大小是解离属性，如果物体很大或者很小，区别它们就很难用的上其他元素。

     4）色彩

     • 色值（颜色深浅）

     一个物体只有与背景相比较，其深浅概念才有意义。

     • 色调

     任何颜色的选择都应该首先考虑用户的目标、环境、商业目标、内容和品牌。然后才能考虑颜色色值、色调、与饱和度。

     界面上最好明智地使用颜色来传递重要含义

     要创造让用户跟踪隐含含义的有效视觉系统，应该使用有限数量的色调

     界面品牌和沟通需求会出现色调冲突

     • 饱和度（鲜艳或者暗淡）

     避免造成视觉负担

     • hsv

     5）方向

     当需要传达方向信息的时候，这是一个可以使用的有用变量。

     6）纹理

     屏幕上的元素并没有真正的纹理，但可以有纹理外观。纹理很少用来传达不同或者吸引注意，因为纹理需要大量注意力来分辨。传达纹理还需要更多的像素、更高色彩分辨率。

     不过，纹理能提供重要的能共性信号（affordance有一定物理联想）。看到物理设备上的橡胶纹理区域， 我们会认为这里可以抓握。用户界面(UI)元素上的褶皱或者隆起一般表示可以拖曳，按钮上的斜面或 者阴影使它看上去可以点击。

     目前流行的“扁平化”设计导致使用纹理或者拟物化逐渐减少。但我们发现，即便在高度极简的设计中，恰当地使用少量纹理也能够大幅改善用户界面的易学性。

     7）位置

     和大小一样，位置是有序和量化的变量：有利于传达层级信息。利用屏幕的阅读顺序连续定位元素。

     8）文字与版面

     人们主要通过形状来辨识文字。形状越清楚，文字越容易辨识，所以全部大写的文字比大小写混合的文字难以阅读，看起来也非常吵闹。
     必须在界面阅读文字时，应采用以下指南:

     1. 使用高对比度文字——确保文字与背景形成对比，不要使用可能影响可读性的互补色。 通用规则是采用 80%的对比度。
     2. 选择恰当的字体和大小——一般来说，Verdana 体或 Tahoma 体等清爽的无衬线字体最适于阅读。Times 体和 Georgia 体等衬线字体在屏幕上会显得“毛茸茸”，但可以使用 超高分辨率屏幕、足够大的字号以及次像素平滑技术来缓和这个问题。多数情况下， 低于10 像素的字号很难阅读。如果必须使用小字号，通常最好使用锯齿无衬线字体。
     3. 简洁地组织文字——使用最少的文字，清晰地传达含义，从而让文字易于理解。还要避免使用缩写。如果必须使用缩写，试试使用标准缩写。

     9）信息层级

     用户对视觉界面时，会经历一个下意识的过程：评估界面上最重要的对象或者信息，这些可见内容和空间之间有什么关系。为了让用户的解码过程迅速轻松，视觉设计师创造了信息层级，使用视觉属性的差异（大对小，明亮对黑暗，上对下等）来给界面分层。对于暂时式应用，信息层级应该非常明显， 在特定布局中，不同“级别”的重要性形成鲜明对比。对于独占式应用，信息层级可能更加难以察觉。

     10）动作及其随时间的变化

     任何元素都会随时间变化而变化，以传达信息、不同部件之间的关系。吸引注意，缓和不同模式之间的过渡，确认命令效果。

     例如，桌面 Mac OS 上，元素很少简单地出现和消失。 点击 Dock 上的 应用程序以后，程序会跳动，确认已经收到命令，应用正在加载。最小化窗口 不会让程序消失:“精灵” 似的动画使程序收缩变形，滑动到 Dock 上的缩略图位置。

     掌握组件如何随任务变化，很考验设计师。

     （二）视觉界面设计原则

     视觉界面应该做到如下几点:

     1. 传达风格/传播品牌
     2. 带领用户厘清视觉层级
     3. 在组织的每个级别提供视觉结构和涌流
     4. 在特定屏幕上告诉用户能做什么
     5. 响应命令
     6. 把注意力吸引到重要事件上
     7. 最小化视觉工作量
     8. 保持简单

     1）传达风格/传播品牌

     品牌考量不应该比用户目标更重要，但有效的界面应该体现产品线和机构的品牌承诺。

     如何实施：挖掘体验属性。这是一组形容词，可以用来一起描述应该如何感受 产品或者服务的任何交互(第 5 章讨论了如何创建这些属性)。这些属性往往展示成“词云”， 包括较小的词， 帮助变化属性词性或者消除歧义。一旦确定了，这些属性就成了界面设计的一 组指南。多数时候，这直 接影响视觉设计，但也可以用来指导交互设计师在功能相似的设计之间做出决定。

     2）带领用户厘清视觉层级

     重要性和关联性：在看到任何一组视觉元素时，用户会下意识地问自己 “这里什么重要” ，接着几乎立刻就是 “这些东西有什么关联?” 我们必须保证，用户界面要通过创建层级和建立关系，来回答这两个问题。

     根据场景，确定哪些控件和数据是用户需要立刻理解的，哪些次之，哪些只是偶尔需要用到。这种排列贯穿了视觉层级。

     设计师使用基本视觉元素(位置、颜色、大小等等)区分层级级别，但注意的是，往往改变其中一个属性达到效果就够了。

     • 建立关系

     视觉层级关系建立：视觉属性，元素关系，空间关系，位置关系。

     • 眯眼测试

     闭上一只眼睛，眯着另一只眼睛看屏幕，看哪些元素突出、哪些元素模糊，哪些元素看上去分组了。改变角度总能发现此前未发现的布局和构成问题。

     3）在组织的每个级别提供视觉结构和涌流

     利用视觉属性，元素关系，空间关系，位置关系来建立视觉层级关系。独占式应用有多个层级结构。

     • 对齐到网格

     对齐

     1. 对齐标签（左侧对齐>右侧对齐）
     2. 一组控件全部对齐
     3. 控件组和窗格之间对齐

     网格系统(grid system)

     理想情况下，网格系统中，不同大小的屏幕区域之间应该保持一致关系，这种关系一般指比例。三种常用比例：

     1. 黄金分割（1.61）
     2. 2的平方根（1.14）
     3. 4：3

     良好的布局网格是“模块化的”(modular),也就是说，应该足够灵活，可以应对必要的变化，同时尽可能地保证一致性。

     稳定+简介+一致

     网格布局的好处：

     1. 可用性一-由于网格会使元素的位置更加规则，用户可以快速学会如何找到关键的界 面元素。 如果屏幕的标题部分始终精确地出现在同一个位置，用户就无须思考或者浏 览界面。一致的 间距和定位可以辅助人们内在的视觉处理机制，设计良好的网格可以极大地提高屏幕的可读 性。
     2. 美学上吸引人——精心运用原子网格，在屏幕的不同区域之间建立好适当的关系，这 样的设 计可以创造出一种井井有条的感觉，使用者会感觉到舒服。
     3. 提高效率——将布局标准化可以减少创造高质量的视觉界面所需的工作量。我们发现， 在设计优化阶段尽早地定义并采用网格，可以减少界面设计的迭代(iteration)修改。 在精心定义的网格系统下进行设计，可以方便地修改和扩展，如果需要变更，也能让开发者做出最合适 的布局决策。
     • 创建逻辑路径

     除了要精确地遵从网格，布局上也必须正确地构建出高效逻辑路径，让用户可以沿着这个逻辑路径与界面互动。

     让用户可以沿着这个逻辑路径与界面互动。必须考虑到人们眼睛阅读的习惯是从上到下，从左到右(对于按此顺序阅读的西方人而言)。

     • 界面元素平衡

     完美对称的界面缺乏层次感，无法鼓励用户的眼睛在屏幕上流动。平衡的不对称为屏幕和主要屏幕区域提供视觉入口点。

     眯眼测试检测

     4）在特定屏幕上告诉用户能做什么

     • 使用图标

     图标的视觉语言传递抽象的概念

     William Honon：《the icon book》

     • 传达功能感

     最好依赖习惯用法，而不是向用户强加无法理解的抽象表示方法，还可以考虑增加工具提示或者文本标签。对于一些更显而易见的具体功能，可以运用以下指导原则:

     1. 同时表达动作和动作施加的对象，以增进理解。名词和动词结合在一起比单独用动词更易被人理解(例如剪切命令用一篇文档上加一个 X,比单纯使用剪刀这种隐喻图像 更便于理解)。
     2. 小心使用与目标用户想象中不同的隐喻和表现方式。例如，在西方社会中伸出大拇 指的手势 表示“0K”，让人觉得是表达同意的合适方式，但在中东(或者其他地区) 的文化中，这个手势是冒犯人的，因此在任何国际化应用程序中都不应使用这个图标。
     3. 在视觉上将相关功能分组.以提供空间上的使用情境。如果不行，就使用颜色或其他的视觉主题提供使用情境的信息。
     4. 保持图标简单，避免过多的视觉细节。
     5. 尽可能重用元素，这样用户只需要学习一次。
     • 将视觉符号与对象关联起来

     行为不同的元素要在视觉设计上明显区分

     • 简单地渲染图标和视觉符号

     彩色屏幕的图形能力通常分辨率很高，这诱惑着人们用越来越多的细节渲染图标和画面， 几乎达到和照片差不多的质量。但是，这种趋势最终并没有服务于用户的目标，特别是对于效率类的应用。

     失败原因：

     1. 不恰当地将注意力引向图标本身
     2. 小尺寸时不易辨认
     3. 视觉上不紧凑等
     • 尽可能预览视觉效果

     Photoshop 和其他图像处理软件早就用缩略图预览视觉处理操作的结果。微软 Word 的打印预览显示了在当前纸张大小和页边距设置下，打印出来的文档 是什么样子。很多用户难以把 1.2 英寸左边距视觉化，而预览控件就显示出来了。

     5）响应命令

     通过滑动、敲击、点击执行一个命令后，用户需要看到某种反映。用户针对某些选定文本选择了新的字体，文本立刻变化，显出新样子。这种响应除了工具本身之外，不需要额外的视觉设计。

     如果响应耗时超过十分之一秒，但不超过一秒，就需要提供细微的视觉线索，告诉用户己经接收到命令，完成时再提供另一个线索。

     如果响应耗时达到十秒，就必须提供某些线索，告知用户这一轻微延迟，表示过程正在运 行，常见的是使用某种循环动画和估计使用的时间。常见的例子是在网页上方显示一个能快速载入的像素进度条。

     如果一个过程耗时超过十秒，最好显示提示，解释延迟的原因，另外再显示一个运行进度更新， 让用户知道过程正在后台继续，过程完成后再配上有礼貌的提示，这样用户就可以返回任务。

     6）把注意力吸引到重要事件上

     用户只需看一眼就能捕捉到关键信息。这种信息不是用户主动获取的，而且应用主动提供的。设计的挑战是，很难在保持注意力信号有效的同时还保持体验一致。

     建立有凝聚力的视觉系统，保证体验一致。

     7）最小化视觉工作量

     界面上的视觉噪音一般是由过多的视觉元素造成的，视觉噪音有多种形式:

     1. 过分的装饰
     2. 没有增加任何信息的 3D 渲染
     3. 过度使用标尺、用户分离控件的元素视觉上“过重”
     4. 元素拥挤
     5. 颜色、纹理和对比过于密集
     6. 使用太多颜色
     7. 无力的视觉层级

     9）保持简单

     设计原则：删减东西，直到破坏了设计为止，再把最后去掉的东西加上。

     驱动简介的另一个概念是杠杆，即在界面中使用一个元素来表达多重相关意图。

     例如在微软的 Windows 8 中，窗口上方标题栏左侧有个小图标(参见图 17-5)。它一方面用来表示窗口的内容(比如是文件浏览器窗口还是 Word 文档)，另一方面还提供控制该窗 口的一些功能，比如最小化、最大化及关闭。

     （三）视觉信息设计的原则

     优秀的视觉设计应该是“将清晰的思考视觉化”，Tufte 认为在信息设计中有两个重要的问题。 1. 很难在一个二维表面显示多维信息(多于两个变量的信息)。 2. 显示器分辨率不够高，不足以显示高密度信息。

     视觉信息应该实现如下目标：

     1. 加强视觉对比
     2. 显示因果关系
     3. 显示多个变量
     4. 在一个界面整合文本、图形及数据
     5. 确保内容的质量、相关性和完整性
     6. 在相邻空间上显示事物，而不按时间堆积
     7. 可量化的数据就要量化

     1）加强视觉对比

     可视化展示趋势，时间，改变前后等等

     2）显示因果关系

     交互界面中应该使用非模态视觉反馈告诉用户行为可能结果，或提供如何完成操作的暗示。

     3）显示多个变量

     在交互式显示中， 用户可选择幵启或关闭变量，使对比更容易，相关性(因果关系)也更清晰。投资者通常对多个证券、指数及指标的相互关系非常感兴趣

     4）在一个界面整合文本、图形及数据

     如果图形中缺乏关键说明或图例，那么用户理解起来需要更多的力气，比带有标签和图 例的图形效率低。

     5）确保内容的质量、相关性和完整性

     确保所显示的信息能够帮助用户实现与其所在情境下的特定目标。

     6）在相邻空间上显示事物，而不按时间堆积

     如果你要表达按时间发生的变化，将这些变化安排在相邻的空间上显示，用户会更容易理 解，而不要彼此叠加。连环画就是一个这样的好例子，它在相邻空间上显示随时间推进的流和变化。当然这条建议适用于静态信息显示，在软件中只要技术上允许(比如内存足够大及网络连接速度足够快等)，使用动画会更有效地呈现时间轴上的变化。

     7）可量化的数据就要量化

     例如，在 Windows 磁盘属性对话框中，饼状图可以让用户了解到剩余可用空间的大 概情况，不过已用空间和可用空间的字节数也以数字形式显示出来。

     （四）一致性和标准化

     一致性意味着软件产品的不同模块要有相似的外观、感觉和行为。有时，这种特性扩展到开发商售出的所有产品上。这样用户会感觉到这些操作系统平台提供了无缝而舒服的用户体验。

     1）界面标准化的益处

     1. 单一界面标准能够通过提高产出和减少错误，改善用户学习界面的能力和提高生产率。
     2. 界面标准也有利于软件开发商。因为标准带来的一致性改善了易用性和易学性，降低了客户培训和技术支持的费用。
     3. 好的标准能够降低维护费用、提高设计和代码的重复利用。

     2）界面标准化的风险

     任何标准的主要风险在于根据标准创建的产品不可能比标准更好。

     多数界面标准强调的是界面的语法，即外观和感觉，但很少涉及界面更深的行为，或更高层次的逻辑和组织结构：无法融入场景，不考虑特定的情景中的具体用户行为和使用模式，而是关注人类感觉和认知的一般问题。

     2）标准、指南和经验法则

     一些从业人员和开发者对苹果或微软的用户界面标准奉若神明。两个企业都发布用户界面标 准。而他们又随意而频繁地违背标准，事后更新指导准则。

     因此界面标准最适合作为具体的指导准则和经验法则，僵化地遵循界面指导准则或不考虑 具体情 境中的用户需求，会强迫应用程序界面适应不恰当的交互模型。

     3）什么时候打破规则

     遵守标准，除非有极好的其他选择。

     4）应用程序之间的一致性和标准

     一致性并不意味着僵化，特别在一致性不恰当时。界面和交互风格 指南准 则必须随其所服务的软件而成长和演化。有时为了更好地服务于用户及其目标(有时甚 至是你的企业目标)，必须打破规则。当这种情况发生时，尽量使改变和增加与标准兼容。指导你的是规则的精神实质， 而不是规则的文字本身。

     5）设计语言

     视觉界面设计师最重要的工具之一是“设计语言”思想。把这门设计语言当做设计元素的 “词汇表”， 例如形状、颜色、版式，以及这些元素如何组织结合。

     设计语言往往通过标准和风格指南传达，但重要的是要注意，二者并不是同义词。仅仅因为有风格指南，并不意味着有成熟的设计语言，反之亦然。没有风格指南或者标准手册，也有可能拥有设计语言(不过，应该说，编写风格指南有助于设计师合理和简化设计语言)。

     ---

     第十八章：为桌面应用而设计（界面原则）

     绝大多数桌面应用采用独占式姿态，暂时式姿态只是配角。本章讨论独占式桌面应用的基本结构模式、组成模块等。

     桌面应用

     1. 剖析桌面应用
     2. 桌面系统中的窗口
     3. 菜单
     4. 工具栏、工具板、侧栏
     5. 点操作、选择、直接操作

     （一）剖析桌面应

     1）主窗口和辅窗口

     一个应用由一个主窗口(primary window)，以 及一个或多个辅窗口(secondary window)构成。

     主窗口：“独占式姿态“占屏幕大部分空间，通过窗格的形式，我们可以在不同的内容对象不同的功能组件和控件之间进行导航。

     辅窗口：呈现不频繁的属性和功能，最典型的一种辅窗口是对话框 (dialog)。

     2）主窗口的结构

     一般情况下，主窗口会被分成几个功能区:

     1. 一个内容区或工作区
     2. 一个菜单条
     3. 多个工具栏、窗格、工具板，用于在工作区导航、选择或操作内容对象

     描述的很像ps这样的软件

     • 菜单和工具栏

     菜单和工具栏是一系列有关联的动作的合集，用户可以运用这些动作指挥应用程序执行一些操作。

     • 内容窗格

     (content pane)包含了应用的内容，在大多数的桌面应用中，内容窗格形成了主工作区。一 个应用通常只有一 个主内容窗格。不过，一些可以并列查看或编辑多个文档的应用(例如 CAD 软件)，

     • 索引窗格

     (index pane)为用户提供导航，用户在这里访问并选取文档或对象，被访问的文档或对象最后会展现在内容窗格中，供査看、编辑、配置等。

     • 工具板

     工具板(tool palette)和工具栏(toolbar)看起来很相似，但工具板只有单一功能。可快速选择工具。

     • 侧栏

     可以方便地设置文档或对象的属性，而无须弹出模态对话框或非模态对话框。

     （二）桌面系统中的窗口

     常见的矩形。

     1）层叠窗口

     隐喻....因为我们真实世界中的办公桌桌面也是这样的，通常桌面上面堆叠着纸张。当你想要阅读或编辑某个文件时， 你从纸堆里把它抽出来，放到最上面，便可以幵始工作。

     2）平铺窗口

     在屏幕上同时显示多个应用程序。 平铺，意味着多个应用程序可以用统一的小矩形来均分屏幕，在均分的屏幕空间中运行每一个应用。

     例如，在 Windows 7 中，右键点击 Windows 的任务栏， 选择“堆叠显示窗口”，就可以看到平铺的窗口。

     3）虚拟的桌面空间

     层叠窗口不能解决多个运行应用之间的导航问题。

     虚拟桌面(virtual desktop)或会话管理器(session manager，UNIX 平台上用得较多)屏幕上会显示各个虚拟桌面的缩略图，每个虚拟桌面缩略图中会显示正在运行的应用和窗口的缩略图，这种应用和窗口的“元管理”(metamanagemem),对于高级用户来说是非常有效的，他们可以同时运行和管理很多应用。

     【应该是指类似苹果多个桌面的这种窗口】

     4）全屏应用

     我们正在进入一个全屏时代，当单个应用占主导地位的时候，会占据整个屏幕。

     5）多窗格应用

     多窗格窗口(multipaned window)的好处在于，独立而相关的信息可以在单个独占屏幕上轻松显示，并将导航和窗口管理的附加工作减少到几乎为零。微软的 Outlook 就是最典型的一个多窗格应用。

     多窗格的另一种形式是堆叠窗格(stacked pane)或标签(tab)，这形式在偏好设置、属性、以及其他各类对话框中用得最多。微软的Excel就是一个非常典型的例子。

     6）窗口状态

     软件的主窗口可以处于如下 3 种状态:最小化、最大化、多元化(pluralized)。
     多元是一种中间状态，窗口既不缩小也不全屏。当窗口处于多元状态时，它与另一些图标 及其他 在多元状态下的窗口共享屏幕。多元状态的窗口，既可以平铺，也可以层叠(实际上，通常是层叠)。

     7）窗口和文档：MDI vs. SDI

     如果想从一个表格中复制一个单元格，将其粘贴到另一个表格里，同时打开两个表格. 有两种方法来做到这一点。第一种方法:一个表格应用中，可以包含两个以上表格实例。第二种方法:同时打开多个表格应用，每个应用中只有一个表格实例。

     第一种方法： 多文档界面(multiple document interface)，简称为 MDI。用选项卡(Tab)的方式进行管理，ps。

     第二种方法：单文档界面(single document interface)，简称为 SDI。

     无论运用哪一种交互习惯用法，都要考虑实际运用场景的客观情况。

     8）窗口的运用

     不必要的房间

     每个房间都是有目标的，主副窗口功能不重合，有逻辑层次。
     例如，在 Adobe Photoshop 中，如果你要改变一个图片的亮度和对比度，这其实是一个很简单的操作，但你必须首先要进到image (图像)菜单中，打开 Adjustments (调整)子菜单， 然后选择 Brightness/Comrast (亮度和对比度)命令来设置。这便调用了一个对话框，你可以在这个对话框中进行调整。这种顺序如此常见，几乎不会引起注意，但不可否认这是一个拙劣的设计。 在绘图应用中改变图像的属性是首要任务，图片在主窗口中，所以改变它的工具也应该放在主窗口中。 亮度和对比度是重要的图像属性，并非绘图应用软件无关紧要的任务，而是不可或缺的重要组成。
     在 Adobe 的 Lightroom 应用中，这种情况有了很大的改善。Lightroom 应用被划分成了多个 视图或者说“房间”，每个房间都有其不同的用途，即 Library、Develop、Slideshow、Print、Web。在 Develop 房间中，亮度和对比度的调节可以在主窗口右边的窗格中进行，在此还可以 对图片进行其他的调节操作，

     必要的房间

     使用目标导向的思维方式，我们可以研究每个功能，并使之达到最好的效果。例如，如果有人用绘画软件画图，其目标是创建一副效果很好、让人满意的绘画作品。此时，尽管所有的绘画工具都与这个目标直接相关，但在所有的绘画工具中，铅笔、画笔、橡皮擦这三者，与绘画目标的关系最为紧密。 这三样工具应该紧密地合为一个工作间，就像现实中的画家在画布上作画一样，他会把这几样工具放在最顺手的近处。最常用的工具必须放在绘画者能顺手拿到的地方，远一厘米都不行。如果说让画家站起 来、走到另一个房间去取，则更是连想都不要想不应该的做法。

     （三）菜单

     1）把菜单作为教学工具

     这种教导性质应该是出于菜单的逻辑性。比如要找某一个工具，首先会判断这个工具的性质，然后到相应的菜单下面寻找。菜单中应该有更详细的文本描述。在菜单中为相关命令提供暗示，也给了用户一个学习的途径。例如，将菜单项相对应的快捷键或按钮图标放到旁边，可以起到暗示作用，这样用户便知道还有别的更加快捷的操作方法。在菜单中正确地放置这些暗示信息，用户在潜意识里会记住它们。从菜单中调出的每个对话框中，都应该设置一个全局的“撤销”或“取消” 按钮，用来让用户撤销操作。

     设计原则：用菜单来提供一条学习的途径

     2）禁用的菜单项

     当菜单项与所处状态无关, 或者与 所选对象无关时，该菜单项就变得不可用了，或者说不能发挥其作用了。cinema4D中就是这样，当前不能用的工具，就都是灰色的。

     3）复选标记菜单项

     挨着菜单项的复选标记，通常被用来“启用”和“禁止”应用界面中的某个方面(如打开或关闭工 具栏)，或者调整数据对象的显示特征(如显示轮廓、还是显示渲染完毕的图像)。

     1. 用于结构简单的菜单中，否则菜单显得臃肿
     2. 使用频繁的放到工具栏上
     3. 使用不频繁的放到对话框

     4）菜单上的图标

     设计原则：菜单项图标与工具栏上具备相同功能的按钮图标应该是一样的

     5）加速器（快捷键）

     1. 遵循标准。
     2. 形成日常使用加速器的习惯。
     3. 标明如何使用它们。

     6）助记符

     访问键可以使用 Alt 键、箭头键、菜单项或标题中的下画线字母来访问。例如，按下 Alt 键时，应用软 件就进入到了助记符模式，用箭头键可以导航到所需的菜单。助记符模式打开后，按下适当的字母键就可以执行相应的菜单项的功能。访问键的主要目的，在于为每个菜 单命令提供一个等效的键盘操作。

     7）级联菜单 vs单层分组

     级联菜单(cascading menu)，下拉菜单有一种变体，当用户选择了下拉菜单中的一个标有右箭头的菜单项后，它会向右弹出一个二级菜单，与己经激活的一级菜单同时显示。

     单层分组 (monocline grouping)或扁平层级只有一级深度。在很多情况下，这种扁平式的组织方式(来组织对象或者命令)， 对于新手用户来说极为有用，可以极大提升应用界面的可自学性(leamability) 和可被发现性 (discoverability)。

     （四）工具栏、工具板、侧栏

     1）工具栏和菜单

     设计原则：工具栏为有经验的用户提供快速访问常用功能的途径。

     工具栏和菜单一起配合工作，满足了用户从新手变成老手过程中不同阶段的需求。菜单起到了教学作用，工具栏提供了快速访问。

     2）工具栏 vs非模态对话框

     工具栏虽然也是非模态的，但它比非模态对话框好用。工具栏还具备非模态对话框不具备的个有用之处:

     第一，它们的外形与对话框不同，它们非常节省屏幕空间。
     第二，用完之后，不必取消它们，因为工具栏始终都是可见的。

     停靠工具栏(docking toolbars)用户可以将它从应用主窗口的边缘拖放至自己喜欢的位置，它会自动变成一个小窗口，多数情况下还会自动优化成一个更小的矩形。使用完毕后，它会自动变成一个小窗口，多数情况下还会自动优化成一个更小的矩形。

     3）工具栏按钮

     功能的视觉助记符：图标按钮还具备按钮的受范特征 (pliancy),以及能够快速识别的图像。不需要隐喻，可以通过菜单栏上对应的图标和文字来学习记忆。

     4）工具提示

     工具提示在图标的旁边弹出了一个暂时的、 很小的窗口，里面包含了一个文本标签。

     设计原则：所有工具栏和图标控件都应该使用工具提示。

     5）禁用工具栏控件

     一些应用干脆让禁用的工具栏彻底消失，但这是不受欢迎的。,,,让人迷惑。

     6）工具栏的新用法

     组合框加入了工具栏，空间变体扩展了工具栏的用户。

     

     7）可移动工具栏

     8）可定制工具栏

     9）情境（弹出）工具栏

     情境工具栏(contextual toolbar)是工具栏真正有意义的进化，与右键单击弹出的情境菜单 (contextual menu)类似，它是鼠标旁边显示的一小组图标按钮。

     在有些软件中，图标组和被选对象有关。如果被选对象是文本，图标按钮组则是一系列的格式选项，如果被选对象是图形， 则显示的图标按钮 允许使用者改变图形对象的属性。

     是指比如复制粘贴后马上弹出的改变字体的图标么？

     10）ribbon 控件

     比如 PowerPoint 2010中的File、Home、Insert、Design、Transitions、Animations、Slide Show、Review及View等)，本质上它也是工具栏，只不过更大，位置是水平的，它包含了多个带有文本标签的功能组，还包含了各式各样的图标按钮和文本命令。

     

     11）工具板

     工具板(tool palette)就成为图形制作和各类创作软件中最主要的交互方式。

     

     12）侧栏/任务窗格、抽屉

     侧栏 (sidebar)/任务窗格(task pane)和工具板类似，但是不同的是，侧栏不用对它们一个一个解锁或者撤销，（整个侧栏可以隐藏）

     抽屉(drawer)，是任务窗格的一个变种。这种窗格，在保留了屏幕上主体内容区域的同时， 还可以被大部分或彻底隐藏，其表现形式和一个弹出式的抽屉类似。尽管它对于尺寸较小的屏幕是很有帮助的，但无疑带来了屏幕管理工作。

     （五）点操作、选择、直接操作

     对鼠标这一章节真的没有耐心看下去，如果以后需要的话详见 page 379～413

     ---

     5/25/20

     第十九章：为移动设备和其他设备而设计（行为原则）

     1. 剖析移动应用
     2. 关于移动导航、内容、控制的习惯用法
     3. 多点触摸手势
     4. 应用间集成
     5. 其他设备

     （一）剖析移动应用

     桌面应用多数都是独占式的，而移动应用相反，它们多数是暂态的(transient)，是高度情景驱动的，这是由它们的本质特点所决定的。

     1）移动设备的外形大小

     1. 手持设备
     2. 平板
     3. 小平板

     2）手持设备上的应用

     • 堆叠

     堆叠(stack)可能是在非游戏类移动应用上使用最多的一种主要模式，这种外形迫使内容或控 件的显示呈列表型。

     • 屏幕轮显

     它特别适合多实例或多变体 的仪表盘 (dashboard)式的内容显示，使用者可运用向左或向右的滑动(swipe gesture)手势 进行快速导航。这 种模式最经典的例子是 iOS 上的天气预报应用。

     • 方位和布局

     自动适应横屏竖屏。

     3）平板应用

     • 堆叠和索引窗格

     平板应用主要也依赖于堆叠模式：垂直堆叠主要内容，以及一个或一个以上标签、导航、操作栏等。在附加的索引窗格里，还可以继续添加相关的导航和功能，将它们放置于窗格的顶栏或低栏中。

     • 弹出控制窗格

     平板设备的屏幕足够大，以至于弹出面板而不会覆盖整个屏幕，极大提升任务流效率。

     • 基于方向的布局

     垂直变水平后，我们要把覆盖取消改成相邻，有些应用甚至只能支持一种方向：

     移动布局 VS.类桌面布局

     平板应用可以当作桌面应用的缩小触屏版来设计。对于媒体浏览、其他类别的搜索和浏览、查看和网购类的应用来说，设计成桌面版缩小触屏版是适用的。

     类硬件控件布局

     对于某些应用，特别是音乐创作领域中的软件，模仿硬件的界面会令该领域内的用户非常喜欢。而且，不止单纯地对原来的硬件进行模仿，设计师还可以更有创意地设计出超越硬件操作的动作。

     4）小平板应用

     格窗：要避免多个相邻的格窗，太拥挤了

     工具栏：工具栏最好垂直放在侧边

     列表：单列的列表在小屏幕上显得过于单薄，即使垂直也是如此，网格、泳道、卡片展示最佳

     弹出对话框 vs 全屏对话框：根据大小来考虑

     （二）关于移动导航、内容、控制的习惯用法

     1）浏览控件

     绝大多数的应用都是针对浏览需求的

     列表

     列表内容的常见形式有:一行一行的项目、一段一段文本、一排一排的控件(如复选框、按钮)及其标签、图片或视频的缩略图等。

     列表通常会和标签栏(tab bar)在一起 【标签栏在底部】 苹果 iOS 上的“音乐”应用(music APP) 就运用了这种方式， 在界面的底端有一个标签栏，包含专辑、表演者、歌曲等标签，每个标签对应一个列表，每个列表有自己的内容层级结构。

     列表长度可以是有限的，也可以是无限的，即允许无限滚动(infinite scrolling)。无限滚 动用于列 出大量的数据(例如网页搜索结果)，用户每次滚动到列表底端，列表就会继续列出 更多的结果。这种 无限滚动的方式，对于有限的硬件计算能力来说，是一种必要的妥协。

     不过前提是列出新内容的等待时间要足够短，建议一定要小于 1 秒。

     网格

     最明显的一个例子就是 iPhone 的主画面(home screen)

     用张合手势(pinch gesture)来缩放网格，这个想法看起来很好很诱人，但通常并非如此， 特别是 当手机处于窄窄的垂直屏显模式时。

     和列表一样，也可以通过点击，进入到下一级内容；可以进行有限或者无限的滚动。

     内容轮显

     屏幕轮显使用水平滑动手势(swipe gesture)以全屏布局的方式在不同内容间导航。

     1. 一个屏幕上只能使用一个轮显，并且其位置在整个布局中要显著。
     2. 有时会在宽度上填满屏幕，设置一个小箭头
     3. 有时设置页标小部件
     4. 垂直屏显使用比较少

     泳道

     泳道 (swimlane)是一组垂直排列的轮显，每个轮显都可以独立水平滚动，对其他轮显没有影响。

     是一种很聪明的格子轮显方法，很好地平衡了轮显的自然浏览频率与信息密度。

     在 Netflix 应用中，大量运用了泳道来浏览按类型分类的内容。用户垂直滑动可以变换不同类型， 水平滑动可以查看某一个类型的具体内容。苹果的 AppStore 在其“精选”标签页中，同时 使用了轮显和一组泳道。这种组合的效果也不错，因为此时的导航手势对于屏幕上所有的元素是一样的。

     卡片

     为迎合低分辨率的显示器， 设计者将图片和文本信息整齐地结合在一起，用于信息和内容的展示和浏览等。Facebook 和 Linkedln非常常见。

     谷歌的卡片实际上封装了来 自其他谷歌服务的数据，例如天气、地图、股票、餐厅点评、日历和电子邮件 的通知等。轻点这些内容， 会将用户带到产生这些信息的应中，它实际上提供了一个深入交互的场所

     卡片最常见的组织形式是列表，但它们也会以网格、轮显和泳道的形式出现。Facebook 的 Paper 应用，以一种非标准的方式来组织卡片:屏幕的上半部分是一个类别卡，它循环展示单个海报。轻点一 下海报，海报就会扩展成一个全屏的卡片，

     2）导航和工具栏

     “栏”(bar)是手持移动应用中用来导航不同功能和内容区域的一种主要机制。

     标签栏

     标签栏中的每个标签都保持着各自的内容层级关系，并用列表和网格展现出来

     “更多...”控件

     该控件通常是一个标签，它可以将用户带到下一个屏幕， 或者显示更 多的导航选项。它通常还可以进入到编辑模式，用户在编辑模式下，可以从当前屏幕上拖过来一 个选项，放到栏上，拖过来的这个新选项会交换栏上的原选项，并占据原选项的位置。

     标签轮显

     同样解决“更多...“的问题，是轮显和标签栏完美的结合。

     导航栏和动作栏

     位于屏幕顶端，为列表或网格视图提供导航

     工具栏和工具板

     iOS 应用经常会把一个或者两个动作按钮放在导航栏的右侧，创作类的应用在创作和编辑的界面上，通常会在底端放置一个工具栏， 将底端 原来的标准标签栏替换掉。

     垂直的工具栏和工具板

     更多功能

     工具轮显

     菜单栏:移动设备上应避免使用的习惯用法

     这个做法很糟糕，原因有几个。首先，当用户看到一行文本标签时，第一反应是“这是个标签栏”，根本不会想到菜单栏会出现在平板上。其次，很多功能被隐藏在菜单里，它们一旦展现出来， 单从菜单标签看，很难看出来它们的功能到底是什么。最后，同时运用工具栏和工具轮显，完全可以替 代菜单栏的绝大部分功能，并且还具有视觉密度小、易于理解的优点。

     3）抽屉

     次要动作抽屉

     抽屉可取代导航标签栏，也可与应用中的次要对象交互。

     双抽屉

     将标签栏和工具栏最小化，从而释放出宝贵的屏幕不动产。
     釆用了两个抽屉: 一个是标准的从左侧滑出的抽屉，用于不同视图间的主要导航; 另一个是右侧抽屉， 用于次要功能。

     条目级抽屉

     在列表中，滑动单个条目(向左或向右)后，会将条目底下的工具栏展现出来，里面包含着针对该条目的一些操作动作。这样，屏幕顶端或底端的工具栏就没有必要存在了。这个方法看似巧妙，但它有几点不足:

     • 在缺乏视觉提示的情况下，用户难以察觉此功能。但如果加上视觉提示，则会占用宝 贵的水 平空间。桌面应用则可以用鼠标悬停在条目上方出现提示，也不会搞乱屏幕布 局，但移动应 用不具备此功能。
     • 抽屉滑过来时，条目被滑走了或者被模糊了，这使得用户必须要记住该条目是什么， 这增加 了记忆负担。
     • 每个条目都可以水平滑动，这意味着其他类似的水平滑动操作可能就没有办法再使用 了，例如滑动删除或打开全局的导航抽屉等，即便可以使用，可能也会搞懵用户。

     解决方法是增加解释和说明。

     要避免的抽屉行为

     不要过度使用动画式屏幕转换，弹出窗格和滑动窗格，尤其从不同方向出来的。

     设计原则：要限制动画式屏幕转换的次数和出现的方向。

     关于抽屉的争议话题

     抽屉的问题在于无法看到内部，因此不知道内部功能。

     可以采取一些补救措施，例如用文本按钮(例如用“菜 单”这两个字)来取代汉堡包图标。另外，我们还可以将抽屉的初始状态设置为打幵，让用户看到抽屉，或者在首次使用时弹出“首次使用帮助或提示”的覆盖层气球

     抽屉的好处在于，它保持了主界面的干净整洁，腾出更多的空间来展示和操作内容。

     4）轻拍显示及其他直接操作

     轻拍显示控件

     轻拍可以调出一些隐藏的功能

     直接操作控件

     将传统非直接操作变成了直接手势操作。虽然用户需要探索和尝试并花时间学习，但是直接操作很容易上手，很快变演化为侵入式的习惯操作。

     5）搜索、排序、筛选

     有些人认为，搜索是仅次于打电话的最常用的手机功能。

     隐式排序 VS.显式搜索

     移动应用最常用、最适合做的事情是浏览。运用这种浏览的行为， 应用按照用户需求，预先将搜索结果准备好。聪明的应用会跟踪用户浏览过的、喜欢做的、或 过去购买过的 东西，来推荐用户可能会需要的东西。

     构建搜索需求

     1：语音搜索(voice search)

     2：自动填充(auto-complete) 当用户开始敲击字母输入文本时，应用自动补充出一些常用 的词汇。这种方法极大降低了工作量，减少了一些键盘输入的痛苦。

     3：预加载(tap-ahead) 应用在用户单 击前预先为用户推荐一系列词语，并把它们加载到搜索框中。当然，预加载的推荐词语， 可能不是用户想要的。但对于网页搜索和专业领域搜索，这种技术提供了更精确的词条，

     4：最近/频繁搜索建议人们喜欢反复搜索同样的东西。任何搜索功能都应该记住用户曾经搜 索过的东西，并在用户触动搜索框时将它们呈现出来。理想状态下，这些搜索结果应该按照最常用和最近的条件排列出来。最好还能同时运用“预加载”搜索，这样便于用户进行相关条件和内容的搜索，就像谷歌搜索那样。

     5：自动推荐比自动填充更加智能的是自动推荐，它采用了模糊匹配技术，综合考虑自动拼写更正、受控词汇表、同义词匹配等因素。 通常来说，在自动推荐显示的结果中，上方是一小组严格按照自动填充建议出来的搜索项，下方是一大组推荐的搜索项。

     6：分类推荐在自动推荐的基础上，应用还可以使用分类推荐。搜索框会按照类别显示出推荐的搜索项。

     排序和筛选

     将排序和筛选结合起来，变成一组控件。

     很典型的就是yelp，redefine塞选的条件

     6）欢迎和帮助界面

     大多数移动应用都有的制约因素：

     • 有限的屏幕尺寸制约了屏幕上元素的数量
     • 屏幕上的控件通常不具备能供性提示
     • 触屏无法使用鼠标悬停

     导览/guided tour

     设计原则：让导览引导首次使用的用户

     由一系列的带有文本和图片的卡片轮显组成

     一般在首次使用时被激活

     用户可以任意时间调出

     可以任意时间退出

     覆盖层overlay

     使用原则：用覆盖层展示手势的用法。

     它将屏幕覆盖住，并在上面显示出提示和帮助，通常用手写的字 体显示， 并加上一些箭头，指向具体的控件，或标出该使用何种手势等

     工具提示覆盖层/tooltip overlay

     它在一个覆盖层界面上显示出当前页面上全部的主要功能，通常被用在复杂的创作类软件中

     不用在欢迎界面，用在帮助界面

     7）多点触摸手势

     

     8）应用间集成

     智能手机中的应用大多独立运行，创造了良好的生态系统：永和可以根据自己的需求， 从应用商店里，添加各种应用。

     缺点是应用之间的协作和数据交换变得比较困难。例如，iPhone 上有电话、联系人、日历、 消息、备忘录、提醒等诸多应用，但这些应用都是相互独立的，它 们之间几乎没有什么联系。

     目前有一些这方面的努力和发展，开始进行应用间集成工作。

     例如可以使用用户健康数据的一些app，ios的捷径。
     ifttt(if this then that)

     （三）其他设备

     嵌入系统：内置了软件系统的物理设备。

     嵌入式设备的交互设计，要特别关注使用情境，是一种非常态的一些交互界面，它们周围可能是很嘈杂的，有较大的干扰。此外，还要考虑设备屏幕和计算能力的局限性。

     1）一般性设计原则

     • 不要把你正在设计的产品认为是计算机。

     通常，对你设计的产品能做什么，用户有着非常具体的期望(例如 家电产品或者熟悉的手持设备)，或者几乎没有任何期望(例如公共信息台)

     • 把硬件和软件设计集成在一起。

     系统界面上的软件元素和硬件元素的设计，都很关键。从目标导向，人体工学及美学的角度来考虑，软硬件之间的交互同样也很关键的。

     • 让使用情境来驱动设计。

     多数桌面软件都是在相对安静的、私密的、静止的环境下使用的。而很多的嵌入设备则恰恰相反，这些系统的使用，或在持续移动中(比如手持设备)，或 虽然静 止但却处于公共场所下(比如信息台)。尽管也有些嵌入系统是静止的、且用在相对隐 私的场所下(比 如家用电器)，但它们仍然有明显的情境元素:比如一个人在手忙脚乱地准备 招待客人的晚餐时，肯定 没有心思去应付智能烤箱上复杂烦琐的控制系统。在车载导航系统 上，千万不要使用可按情境更改意思 的“软键”，这样不安全，因为司机的双眼离不开路面， 没有时间去看功能按钮上的标签。类似的，在生 产车间里的技术工人，也不应该把过多的精力用在弄懂难于理解的设备控制上，这样会分散人的注意力， 在某些情况下有可能会造成重大伤亡事故。

     • 模式的运用要明智，如果有的话。

     桌面计算机应用有丰富的模态(也称之为模式):
     软件的工具栏(比如 Photoshop 软件中的工具栏)就是很好的例子:选 择一个工具，鼠标和键盘动作就会被映射到该工具预先定义好的一组功能上; 再选择另一个工具，新的一组动作又会被映射到新选择的工具上。

     • 限定范围。

     在特定情境下使用的

     • 要根据显示器的分辨率来考虑导航。

     精心规划嵌入系统的显示屏，开发出信息的架构。

     • 尽可能简化输入。

     几乎所有嵌入系统的输入设备，都要比键盘或桌面类的鼠标设备简陋。这就意味着这些系统的输入，尤其是文本的输入，对用户来说是非常笨拙的、缓慢的和困难的。

     2）为专用手持设备而设计

     • 要考虑人们会怎样持握和携带该设备。此时，我们非常有必要制作一个物理模型，它可以帮助我们了解该设备如何被持握和携带。这样的物理模型至少要能够反映出该设备的真实尺寸、 形状、部件连接形式(比如翻盖等)，重量最好也要和真实产品类似。 这些模型可以被设计 者用于情境和关键路线场景剧本中，来验证所设计设备的外形和形式。根据设备的使用地点和使用时间的不同，按键上的标签会具有比较特殊的情境需求。比如，追踪快递包裹使用的手持机，一般来说不需用有背光的按键标签，而手机和电视机遥控器往往是需要的。

     • 尽早决定设备是单手操作还是双手操作的。同样，我们可以运用场景剧本来搞清楚在 不同情 境下哪些模式可被用户接受。对于主要是单手操作的设备，也可以考虑加入一 些需要双手但 仅仅是偶尔用一下的高级功能。

     • 避免使用多个窗口或者弹出窗口。在较小的、低分辨率的屏幕上，基本上没有空间容纳悬浮窗口。基于此，它们的界面应该采用独占姿态，完全占据屏幕空间。非模态的对话框，无论如何也要避免使用;模态对话框和错误警告，如果可能的话，也应该采用在第 15 章中讨论的一些技术来取代它们。

     3)为信息台而设计

     信息台的使用者，和独占桌面应用的用户相比，是最典型的非频繁使用者，而且绝大多数情况下，每次遇到的信息台，他们最多只使用一次。

     而且，信息台使用者要么在使用前已经有了具体的目标，要么完全没有明确的目标。

     信息台通常不提供键盘或者鼠标设备，即使有这些输入设备，人们使用起来也不是非常顺手。
     最后，信息台通常都处在公共场所，充斥着噪音和干扰，使用者身后可能还站着一个人在等待。

     交易型 VS 探索型

     交易型信息台，一般提供限定范围的交易或者服务，比如银行的自动取款机，机场、火车站、汽车站、电影院的售票机等。自动 加油机和自动贩 卖机等，也可以被认为是一种简单的交易型信息台。交易型信息台的用户们， 心中具有明确而具体的目 标:取现金、买票、买巧克力棒或者获取某个具体的信息。【目标明确】

     探索型信息台最常出现在溥物馆和展览馆。教育和娱乐类的信息台，通常并不会吸引参观 者的注意，但 它们提供了一些辅助信息，【无明确目的，需要吸引人们。鼓励探索。】

     在公共场合下的交互

     交易型信息台无须故意去吸引使用者，这是一条原则。然而，它们的位置应该放在显眼的地方， 并且应该可以很好地照顾使用者的来去。为了便于人们找到它们，可以同时在附近安放 指路标牌或者周 边地图等。有些交易型信息台，尤其是自动取款机，还要考虑安全因素

     在规划交互设计和工业设计的同时，我们还应该进行建筑学上的规划。

     探索型信息台....安放一些指路标牌或者周边地图。它们既不能离景物或者展品太近以避免阻挡，也不能离得太远——这样人们才知道 它们与景物或展品是有关系的。必须要有足够的空间让人们聚拢在一起:探索型信息台经常是 几个人一起在用(比如一家人)。

     在同一个地点放置几个信息台才合适呢?这是一个比较特殊的问题，对于交易型信息台，很多 公司会在暗访地点做人流调查，以确定最佳的数字。人们不会 在交易型信息台前逗留过长时间，他们通 常也不太讨厌排成队等待使用，因为他们脑子里都有 明确的目标。探索型信息台则不太一样，它们鼓励 长时间的逗留，这就不能吸引旁观者了。

     由于潜在使用者对于探索型信息台的内容有较少期待，因此他 们没有足够的动机排队等待使用， 因此可以认为多数人只有在探索型信息台空着的时候才会走上前去。

     所以交易型信息台可以数量上节制一点，因为人们可以等待，但探索性的信息台可以多一点，
     因为人们只愿意在空着的时候去试试看。

     设计信息台界面时，还要注意声音的使用。由于探索型信息台与生俱来就要吸引人注意， 因此可以使用丰富的声音反馈和音频内容，但音量要适度。公共物品容易变脏，且容易传染疾病。因此，在满足用户达成目标的 前提下， 我们应尽量把信息台做成非接触式的。

     管理输入

     信息台输入原则：

     • 确保单击对象足够大。单击对象只有足够大，才便于手指的操作，对比度要高、色彩要鲜明， 屏幕上各个对象之间不要太近，以防不小心的误操作。对象通常不得少于 20 毫米，这是使用 者在不慌不忙并且是靠近屏幕使用的情况下设定的。如果使用者距离 触摸屏有一臂的距离， 或者是匆忙间使用的时候，就要适当地增加对象的大小。这里有 一个相对原始的方法可以用 来检查点击对象的尺寸是否足够大:先把屏幕按照实际尺寸 大小打印出来，在手指尖上蘸上 墨水，然后在不同情境下用真实的速度试验，单击对象，如果你发现有指印触到或者超出了 单击对象的边缘，那就得增加对象的尺寸了。

     • 保守使用软键盘输入。在触摸屏上使用屏幕上显示出来的软键盘来输入数据，似乎很不错。 不过，这种方法仅仅适合输入很少量的文字，这不仅是因为该输入法难于使用， 而且通常会在屏幕上留下重重的指纹。

     • 避免使用拖放操作。在触摸屏上很难掌握拖放操作(drag-and-drop),因此信息台的使 用者基 本上从来不会花费时间在触摸屏上去学习和练习这种操作。另外，滚动操作也尽可能不要使用，除非是非常必要。

     4）为十英尺界面设计

     基于电视机的界面，中国有时也称为 3 米界面列表、网格、轮显、泳道等设计也可以很好地同这些十英尺界面对应起来，下面是一些有关十英尺界面设计的注意事项:

     • 屏幕的布局和视觉设计要清楚，即使人在房间中较远的位置上也可以轻松看到。即使是高清 晰电视(HDTV),人同电视之间的距离也不会特别的近(至少，不会比人与计算机显示器的距离还近)。这就意味着文本和其他导航对象的尺寸必须要大，因此，这也基本上决定了屏幕上信息的组织。

     • 屏幕上的导航要简单。人们不会把电视看做计算机，遥控器的导航方式也是有限的， 。。。。在这一点 上，TiVo 做得非常好。

     • 始终牢记控制集成。很多人都很讨厌必须要用好几个遥控器来操控与电视相连接的娱乐系统。 把其他家庭娱乐设备的常见功能的控制集成到你正在设计的这个遥控器上(配置越简单越好)， 你会发现你满足了很多人的需求。这就意味着某个产品的遥控器或者 控制台需要知道其他设 备的操作命令，也需要了解和跟踪其他设备的操作状态。逻技公司(Logitech)的 Harmony 系列万能遥控器可以做到上述这几点，可以把这种遥控 器通过 USB 连接到电脑上进行配置。

     • 遥控要尽可能简单。很多人都发现复杂的遥控器让人退缩，家庭娱乐系统的遥控器上 的大多 数功能极少被用到。

     • 缓解以上问题的一个解决方法是在遥控器上加一个小显示屏，这样可以根据具体情境来显示 相应的控制，也可少用一些按钮。这些控制可以通过触摸屏来实现，或者屏幕 旁的软键。这 两种方法有各自的缺点:很多触摸屏都没有触感反馈，这样用户必须要抬 头看电视屏幕才知 道刚才的触摸动作是否正确。软键没有触感反馈的问题，却在遥控器 上添加了更多的按键。 遥控器加上了这个小显示屏，也会引诱设计者在显示屏上设计出 可以导航的多页面内容或者 控件。尽管有一些成功的例子，但是任何具有两个显示屏(电 视屏和遥控器上的小显示屏) 的设计方案都可能分散用户注意力，这具有一定的风险， 用户可能会被搞得迷惑不解，并产生厌烦情绪。

     • 重点要放在用户的目标和活动，而不是产品的功能。

     5）为汽车界面设计

     在汽车行业被称为“远程信息处理一 telematics”

     1. 手离开方向盘的时间要尽可能短。常用的导航控制(例如播放、暂停、静音、跳过、 扫描等) 应该直接放在方向盘上(供驾驶员使用)，以及中心控制台上(供乘客使用)。
     2. 从一个屏幕到下一个屏幕的显示布局要一致。保持布局的一致，这样驾驶员才能保持不同情境下的一致的方向感和关系。
     3. • 尽可能地运用直接控制对应关系。上面硬件控件上直接带有标签，比硬件控件旁边放置一个软键要好。触摸屏按钮如果能有直接的触感反馈，也比软键对应临近硬按键的控制方式好。
     4. • 小心选择输入方式。对于驾驶员来说，使用旋把或者旋钮比一组按钮要容易得多。较少的控 制可以避免搞乱界面，另外旋把也较为突出，比较容易触及，并且如果设计得当的话，还能以一种优雅和直观的方式来进行粗调和细调控制。
     5. 硬件控件的物理外形的区别，要尽可能的大，这样触摸起来就知道是什么。
     6. 显示屏在视觉设计上的对比度很强烈，视觉层次要非常浅，这样一眼看过去就能抓到所有信息。
     7. 模式和情境的转换要简单并且易于理解。在宝马汽车中的 iDrive 系统里，汽车娱乐、 车内气候控制、导航等系统都可以通过一个旋把和摇杆的组合控制系统来操作。这个 方式的初衷是 想让事情简单，但如此极端的做法让控制不堪重负，要使用这个宝马的控制系统，用户必须要首先在界面上浏览，才能切换模式或者情境。模式(例如 CD模式、FM 模式、气候模式、导航模式等)的访问应该是直接的，应该是单个触摸或者按键动作就可以完成的，并且这些模式键的位置也应该是固定的，在不同界面中应 该是一致的。
     8. 提供声音反馈。驾驶员如果可以听得到命令确认，其视线便无须离开前方的道路。不 过，要注意音量的大小，确保反馈的音量不能太大或者产生干扰。对于车载导航系统， 语音反馈提示驾 驶方向是很有帮助的，前提是这个语音提示要足够早。语音输入也是很有帮助的，驾驶员说 话就可以操作界面。不过，由于汽车环境中噪音可能会很大， 有的时候很难识别语音命令， 有时候需要重复或者更正，这就没有按键来得准确。语音输入是很好的市场营销点，但我们认为，判断这种技术的优劣，还是要看是否提升了驾驶员的用户体验和安全。

     6）为语音界面设计

     语音界面，比如语音留言系统、自动呼叫中心等。基本原则如下：

     • 按照用户的心理模型来组织和命名功能，在任何设计中都很重要，但在所有功能都是用语音来描述的系统中更加重要，因为此时唯一的情境就是现在所处的功能。语音界面一定经过完 整的情境剧本的验证，从而决定出最重要的功能，让这些功能最容易被访问到。这意味着要把最常用的选项放在最前面。

     • 一定要明示出当前可选的功能。用户进行完每次操作后，系统都应该说出现在可以进行的功能，以及如何调用这些功能。

     • 任何时候都可以返回到上一步和最高一级。每次操作完成之后，语音界面应该告诉用户如何返回到功能结构的上一步(一般是树形结构的上一个节点)，以及如何返回到功能树的最高一级。

     • 任何时候都可以转到人工接听电话。如果可以，则每次操作完成后，系统都应该给出 如何转 到人工服务的方法，尤其是在用户遇到困难时。

     • 给用户足够的时间来响应。系统通常需要的是键盘输入信息或者语音输入信息。可以 通过测试来决定等待时间的长短;要记住，用电话的小键盘来输入文字信息，是又慢又不方便的。