About Face 4

推荐度：★★★★★
书评：此乃神书，不过不要第一本就看它。

0 前言

1. 设计原则：包括设计实践的广泛思考，以及关于如何充分利用具体的用户界面和交互设计术语的规则和提示；
2. 设计模式：讲述了一套交互设计术语，这些术语通常用来处理具体的用户要求和设计关注点；
3. 设计过程：讲述了如何理解和定义用户需求，如何把需求翻译成设计框架，最后在具体环境中充分应用设计原则和模式。
4. 设计互动系统的步骤：
   1. 探究目标领域；
   2. 理解用户及其需求；
   3. 定义解决方案框架；
   4. 丰满设计细节；
   5. 测试解决方案对用户的效率。

1 数字产品的设计过程

1. 以人为本的设计：
   1. 理解用户的期望、需求、动机和使用情境；
   2. 理解商业、技术以及行业的机会、需求和制约；
   3. 以上述知识为规划基础来创造产品，让产品的形式、内容、行为可用、易用，令人满意，无论在经济还是技术上均切实可行。
2. 现代产品开发三原则（拉里·基奇）：
   1. 功用性（capability）：我们创造什么（技术）；
   2. 可行性（viability）：什么能支撑生意（市场）；
   3. 称许性（desirability）：人们需要什么（产品、设计）。
3. 三种概念模式：
   1. 实现模型（系统模型）：有关机器和程序实际的运作方式；
   2. 心理模型（概念模型）：人们对复杂的产品不需要了解工作原理，只需要创建一种快捷的认知来解释复杂的机制；
   3. 呈现模型（设计模型）：设计师选择如何向用户呈现程序的功能。
4. 目标导向设计过程：
   1. 研究：用户及应用领域；
   2. 建模：用户及使用情境；
   3. 需求：定义用户、业务及技术面需求；
   4. 框架：定义设计架构和流程；
   5. 提炼：行为、形式和内容；
   6. 支持：开发阶段的要求。

2 理解问题：设计研究

1. 定性研究方法：
   1. 启动会：聚集利益相关者提出基本问题，如：产品是什么？用户是谁？用户最需要什么？
   2. 文献综述：查阅相关文献，如：内部资料、行业报告、网络搜索。
   3. 产品/原型和竞争者审核：检查现有版本产品或原型，以及主要的竞争对手。
   4. 利益相关者访谈：对管理者、开发、运营等各部门代表人员进行一对一访谈，了解产品初期设想、预算与日程、技术限制与机遇、商业驱动、利益相关者对用户的看法。
   5. 主题专家（SME）访谈：对于一些高度复杂，技术性极强或需要考虑法律因素的领域来说（如金融、教育、医疗等），与产品所在领域的权威人士进行访谈。
   6. 客户访谈：了解客户在当前解决方案中遇到的难题，购买产品的决策过程等。需要注意客户不等于用户，客户指购买产品的人，实际上很少使用产品，如：学校购买信息系统，客户是某一位学校领导或部门主管，用户是老师和同学。
   7. 用户访谈：与现有用户和潜在用户进行交流，了解用户何时、因何原因、如何使用产品，对产品的期望和当前产品的问题和建议。
   8. 用户观察：对于一些用户不能准确评估的、不愿开口的行为，可以通过观察来发现。
2. 情景调查：基于“师傅带徒弟”，用户是师傅，访谈者是学徒
   1. 情境：在用户熟悉的环境（工作学习环境）；
   2. 伙伴关系：采取合作的方式，对工作的观察和讨论可以交替进行；
   3. 解读：根据收集到的用户行为进行研究，避免主观臆测；
   4. 焦点：巧妙引导，而不是和调查问卷一样提问回答或是自由发挥。
3. 人种学访谈方法：
   1. 人物模型假设
      1. 哪些不同类别的人可能会使用这些产品？
      2. 他们的需求和行为可能会有何变化？
      3. 需要探索哪些行为范畴和环境类型？
   2. 访谈团队和时间
      1. 一人负责引导访谈并适当做笔记；
      2. 另一人负责详细记录访谈内容，查找提问的漏洞；
      3. 每场访谈约一个小时。
   3. 访谈方法：
      1. 在交互发生的地方进行访谈；
      2. 避免按照固定的问题进行提问；
      3. 假装成门外汉，而非专家；
      4. 开放式问题（为什么？是什么？）与封闭式问题相结合（你是？你会？） ；
      5. 不要把用户当作设计师，也不要讨论技术问题（如何实现），避免让受访者提出解决方案；
      6. 鼓励讲故事；
      7. 请求演示和讲解；
      8. 避免诱导性问题（X 功能是否对你有帮助？如果可能，你会使用 X 功能吗？）。

3 为用户建模：人物模型和目标

1. 人物模型以研究为基础，数据质量排序由高到低分别为：
   1. 用户访谈；
   2. 利益相关者和主题专家提供的信息；
   3. 焦点小组、市场调研提供的信息；
   4. 文献综述、前期研究收集的信息。
2. 产品设计应该解决三个不同层次的认知和情感处理过程（唐纳德·A·诺曼 《情感化设计》）：
   1. 本能：用户初见产品时的感受；
   2. 行为：补充用户自己行为、隐含假设和心理模型的产品行为；
   3. 反思：通过反思讲设计与生活经历相融合，将实际意义和价值同产品本身联系起来。
3. 用户目标：
   1. 体验目标（本能）：用户想要什么样的感觉，视觉设计、动效设计、微交互；
   2. 最终目标（行为）：用户想要做什么，使用产品执行某一个任务的动机；
   3. 人生目标（反思）：用户想要成为什么，系统功能、设计概念、品牌战略。
4. 非用户目标：客户目标、商业目标、技术目标等。
5. 用户最重要的目标是：维护自己的尊严，不让自己感到愚笨。如果产品让用户犯大错，无法顺利完成自己的工作，或者让用户感到厌烦，就是在让用户觉得自己很愚笨。
6. 人物模型（persona）：
   1. 叙述中务必包括所有重要性为类型的总结；
   2. 不要包括过多虚构描述，细节描述要恰到好处，只要能涵盖基本的人口统计数据，能将行为类型编成一个故事就足够了；
   3. 不能将未观察到的细节加入行为描述中；
   4. 不要在人物画像描述中引入解决方案，而是突出重点；
   5. 不要在人物画像描述中列出区间或均值。

4 设立愿景：场景和设计需求

1. 需求定义过程：
   1. 创建问题和愿景陈述；
   2. 探索和头脑风暴；
   3. 确定人物模型期望；
   4. 构建情境场景；
   5. 明确设计需求。

5 设计产品：框架和提炼

1. 交互设计框架定义过程：
   1. 定义形式要素、姿态和输入方法
      1. 形式要素：web、移动端等；
      2. 姿态：用户投入的注意力和产品的行为；
      3. 输入方法：用户和产品互动的方式，鼠标、触摸屏等；
   2. 定义功能性和数据元素
      1. 数据元素：用户可以访问、反应和操作的基本主体（如照片、邮件、订单）；
      2. 功能元素：用户针对界面中的数据元素及其显示所做的操作；
   3. 确定功能组和层次：把数据和功能纳入屏幕、框架或网络等高层次容器元素；
   4. 勾画交互框架
      1. 手绘：设计整体且高层次的框架，不要考虑细节，易于迭代和分享；
      2. 工具：添加细节，完成低保真原型图（线框图）；
   5. 构建关键线路情景剧本
      1. 关键线路情景剧本：人物模型最频繁使用界面的主要路径；
      2. 故事板：描述设计方案如何帮助人物模型完成其目标；
   6. 通过验证性的场景来检查设计
      1. 替代场景：常见的例外情形、基于次要人物模型需求和目标的其它场景等；
      2. 必须使用的场景：必须执行但又不常用的情形（如一些删除、修改操作）；
      3. 边缘情形场景：产品必须要有但是不太常用的功能（如错误反馈、缺省页）。
2. 视觉设计框架定义过程：
   1. 开发视觉体验特征：三到五个形容词（情绪板）；
   2. 开发视觉语言研究：尺寸、颜色、字体、组件等（可以拿出多套方案）；
   3. 将已选择的视觉风格应用于屏幕原型。
3. 工业设计框架定义过程：
   1. 与交互设计师就形式要素和输入方法进行合作；
   2. 开发粗略的原型；
   3. 开发形式语言研究。
4. 服务设计框架定义过程：
   1. 描述用户旅程；
   2. 创建服务蓝图；
   3. 创建体验原型。
5. 细化外形和行为：
   1. 完成像素级设计稿；
   2. 提炼出一套视觉风格指南。
6. 验证与测试设计（可用性测试，在设计基本定型、技术开发前进行）：
   1. 命名：部件、按钮标签是否合理？某些词语反响是否更好？
   2. 组织：信息是否能进行有意义的分类？是否符合用户预期？
   3. 初次使用和可发现性：常用功能是否便于新用户寻找？指令是否清晰、必要？
   4. 有效性：用户能否有效完成具体任务？有没有犯错？哪里出错？是否经常发生？

6 创造型团队合作

1. 思想伙伴：
   1. 创造者：进行无边无际的创意构想，进行自由的创造、思考和探索；
   2. 综合者：对创造进行指导和聚焦，只有当用户需求得到满足，设计结果才能得到保证。
2. 强大的创造者可能会不暇思索得投入到一个不完整的设计方案或者过分沉湎于头脑风暴，他们需要一个综合者在合适的时间做出决定，保证设计顺利进行。综合者会在团队内部开始对话，针对已提出的创意提问一些意图和价值方面的问题，而非直接提出解决方案。随着谈话的进行，综合者需要明晰思路，快速发现设计中内含的价值或者直接终结。
3. 设计会议中：
   1. 创造者：拿起画笔表达想法，将构思具体化；
   2. 综合者：列出好的方案的优点或重新了解问题、用户目标和使用情境，倾向于讲故事和提示。
4. 设计会议后：
   1. 创造者：画出交互结构和流程；
   2. 综合者：通过图表和文字来解释设计流程或者基本理论。
5. 核心设计团队：2~4人。
6. 敏捷：鼓励建立规模较小的团队，专注工作，经常讨论，优化时间和能量，减少浪费。

7 良好产品行为的基础

1. 设计价值：
   1. 合乎伦理（有用、贴心）；
   2. 目标明确（有用、可用）；
   3. 实用（切实可行）；
   4. 优雅（高效、艺术性、能打动人）：少既是多。
2. 设计原则：
   1. 概念原则：界定产品定义，产品如何融入广泛的使用情境；
   2. 行为原则：描述产品在一般情境与特殊情境张应有的行为；
   3. 界面原则：描述行为及信息有效的视觉传达策略。
3. 设计模式：
   1. 节省新项目的设计时间和精力；
   2. 提高设计方案的质量；
   3. 促进设计师和程序员的沟通；
   4. 帮助设计师成长。

8 数字产品的礼仪

1. 关心用户喜好：记住用户的行为和偏好（如记住密码和用户的选择）。
2. 恭顺：尊重用户意愿。
3. 乐于助人：在回答问题的基础上提供其它有用信息，但是不要提供鲁莽（自以为是）的帮助。
4. 具有常识：不要在不合适的地方提供不合适的功能（如常用操作和危险操作放在一起）。
5. 有判断力：记住用户的信息但不是自动记录（如密码、银行账号等）。
6. 预见需求：如提供建议、自动加载下一页。
7. 尽责：如文件名重复，不能草率地覆盖。
8. 不增加负担：对自己的问题保持沉默，应该更聪明、自信并自主地解决问题。
9. 及时通知：及时通知用户关心的事情。
10. 敏锐：记录用户偏好，将其设置为默认。
11. 自信：减少二次确认，做好恢复准备。
12. 不问过多的问题：提供选择而不是询问问题。
13. 即使失败也不失风度：如提交表单后提示错误返回上一步，帮助用户填上没有错误的信息。
14. 知道什么时候调整规则：如允许延长时间。
15. 承担责任：不要将责任推给用户。
16. 帮助用户避免低级错误：对危险操作增加提醒，但是不要责备用户。

9 平台和姿态

1. 桌面软件姿态：
   1. 独占姿态：通常被最大化，主导用户的工作流（如office、abode系列软件）
      1. 目标锁定中级用户；
      2. 慷慨使用屏幕空间；
      3. 使用保守的视觉风格，避免视觉疲劳；
      4. 提供丰富的视觉反馈；
      5. 支持丰富的输入方式；
      6. 以文档为中心。
   2. 暂时姿态：在打开短暂的时间后关闭（如系统工具、插件等）
      1. 明亮而清晰；
      2. 保持简一；
      3. 记住用户的选择。
   3. 后台姿态：隐藏在后台，无需用户操作
2. 网络姿态：
   1. 信息类网站：以信息为中心（如个人网站、企业门户）
      1. 平衡独占和暂时姿态；
      2. 详细信息的展示最好以独占姿态完成；
      3. 偶尔才需要查询或参考的网站倾向于暂时姿态。
   2. 事务性网站：除信息内容外还包含了复杂性为的功能因素（如搜索引擎、电商网站）
      1. 平衡独占和暂时姿态；
      2. 关注内容的信息架构和页面组织，专注于交互设计。
   3. 网络应用：类似于桌面应用
      1. 独占式网络应用：如在线原型工具；
      2. 暂时姿态网络应用：如在线填写问卷。
3. 移动设备姿态：
   1. 卫星姿态：导航+内容；
   2. 独立姿态；
   3. 平板电脑姿态。

10 为中级用户优化设计

1. 大多数用户既非新手又非专家，而是属于中级用户。
2. 新手和专家随着时间推移都会倾向于成为中级用户。
3. 设计目标：
   1. 迅速轻松将新手培养成中级用户；
   2. 不要在中级用户成长为专家用户的过程中设置障碍；
   3. 最重要的是，保证永久的中级用户在技术范围的中段探索时有愉快的体验。
4. 战略方法：
   1. 新手：向新手提供帮助，在不需要帮助时就应该消失；
   2. 专家：快速访问常用功能，提供高密度信息；
   3. 中级：快速进入最常使用的工具，快速访问常用功能，知道高级功能在哪里，提供在线帮助。

11 编配与流

1. 流：当人们投身于某个活动中时，会对周边干扰视而不见。
2. 为了创造“流”，与软件的交互必须变得透明，让用户感觉不到用户界面的存在。
3. 编配：和谐的组织，描述用户对交互产品的期望合理。
4. 和谐交互策略：
   1. 遵循用户心理模型；
   2. 少即是多；
   3. 让用户指示而不是讨论；
   4. 提供选择，而不是提出问题；
   5. 让必要工具近在咫尺；
   6. 提供无模态反馈：少使用模态对话框；
   7. 设计要以防万一，但应预测其可能性：不要让可能发生的事情影响对几乎必然事件的处理；
   8. 上下文信息：可视化地展示信息，而非简单的使用数据或文字；
   9. 反映对象和应用程序的状态：提供无模态反馈；
   10. 避免不必要的报告：不要告诉用户运行中的琐事，也不要为了报告而停止进程；
   11. 避免空白状态：提供默认偏好、缺省页；
   12. 区别命令和设置：不要在每次命令中都进行一次设置，应该将功能和设置分开；
   13. 隐藏弹射座椅的操纵杆：避免用户发生灾难性误操作；
   14. 为响应而优化，但容许延迟：
       1. 0.1秒以内：感受不到延迟；
       2. 1秒左右：注意到延迟，但不会被打断；
       3. 10秒以内：明显感觉到延迟，需要提供一个进度条；
       4. 10秒以后：用户不会继续关注，需要交代剩余时间和进度，可以支持后台运行、取消任务。

12 减少工作 消除负担

1. 导航负担：
   1. 多个屏幕、视图或者页面之间的导航：将所有主要交互放在单独的主视图里，使其包含多个独立窗格以避免这个问题；
   2. 窗格之间导航：使用标签窗格或选项卡；
   3. 工具和菜单之间导航：经常使用的功能应该以工具栏、选项板及其等效方式来提供；
   4. 信息导航：滚动（垂直、水平）、链接、平移、缩放。
2. 拟物化负担：不要盲目依赖拟物化隐喻。
3. 模态负担：
   1. 不要愚蠢的打断进程；
   2. 不要让用户请求许可；
   3. 任何输出之处应该允许输入。
4. 样式负担：不要过度使用样式图形和界面元素。
5. 消灭负担：
   1. 减少要去地方的数量，尽可能减少滚动；
   2. 提供导航标志，保持页面视觉连贯，但太相似也会引起混乱；
   3. 提供概览：文本、图形、注释滚动条；
   4. 恰当地把控件映射到功能上：空间映射、逻辑映射（如将升/降序明确为最近/远）；
   5. 避免层级关系：使用“单层分组”，不要将文件夹层层嵌套，让用户在复杂的树状结构中导航；
   6. 不要复制机械时代的模型：克制使用拟物化，充分利用数字化环境。

13 隐喻、习惯用法及能供性

1. 界面范式：
   1. 实现中心范式：基于工程师对事物工作原理的理解；
   2. 隐喻范式：
      1. 基于用户在真实世界的实际经验在界面上建立视觉与功能之间的联系；
      2. 有益于新手理解，但全局隐喻已经限制了软件的能力；
      3. 按照习惯来设计，旨在真正合适、强大的隐喻正中下怀的时候使用隐喻才会更好。
   3. 习惯范式：
      1. 并不关注技术或者直觉，而是通过学习简单、非隐喻的视觉或行为习惯来完成目标和任务；
      2. 图形界面大都是习惯用法范式；
      3. 好的习惯用法只需学习一次。
2. 能供性：我们认为对象能做什么。
3. 顺从：对象或屏幕区域对用户输入及其他操控的响应
   1. 静态提示：以静态视觉能供性作为对象本身的一部分；
   2. 动态提示：动态地改变对象的视觉能动性，以适应输入焦点或者其它变化；
   3. 光标提示：鼠标经过时改变光标。

14 重新思考数据输入、存储和检索

1. 数据输入：
   1. 及时提供错误反馈，但不应停止活动；
   2. 通过自动完成或下拉菜单等帮助输入；
   3. 记住用户的动作，保证每个动作可以明确地撤销。
2. 数据存储：
   1. 自动保存，关闭时不必弹出“确认保存更改”窗口；
   2. 创建副本：和原始文档一模一样并放在相同文件夹，对原始文档的后续修改不会影响；
   3. 命名和重命名：单机标题栏编辑名称；
   4. 在文件系统中存放和定位：把文件放到用户能找到的地方；
   5. 还原所做更改：撤销用户更改；
   6. 放弃所有更改：主菜单提供一个“放弃更改”，提供清晰的警告，并相对容易撤销本操作；
   7. 创建版本：系统创建版本，用户可以选择一个版本为当前活动文档。
3. 数据检索：
   1. 基于位置的检索；
   2. 基于标示的检索（文件名）；
   3. 基于属性的检索（标签）。

15 防止错误 通知决定

1. 富视觉非模态反馈：通过视觉效果展示详细信息（如图标展示状态）。
2. 听觉反馈：避免负面声音反馈、提供正面声音反馈。
3. 撤销与恢复：不要在保存后就无法撤销。