《用户体验要素——以用户为中心的产品设计》读书笔记

用户体验要素

• 战略层
• • • 产品目标和用户需求
• 范围层
• • • 功能规格和内容需求
• 结构层
• • • 交互设计和信息架构
• 框架层
• • • 界面设计、导航设计和信息设计
• 表现层
• • • 感知设计

阅读日期：2019/10/21-2019/10-29

版本：第二版

全书围绕五个要素——表现层、框架层、结构层、范围层、战略层而展开，详细地叙述了五个层面的具体含义与方法，在读者心中建立起了一个完整的提纲，日后的积累也能逐渐填满提纲。

如豆瓣上的评论一样，本书的翻译是他的缺点之一，有的翻译生涩难懂，有的翻译已经脱离了时代。

但这也并不妨碍此书在广度上为我们所呈现的知识。

战略层

产品目标和用户需求

战略层定义：

明确我们要通过这个产品得到什么？

明确我们的用户要通过这个产品得到什么？

1.产品目标

• 产品目标：明确定义“成功的条件”，即成功标准，有利于验证产品是否达成目标。比如用户在每一次访问网站时的平均停留时间是多少？
• 品牌识别：要树立起用户心中的品牌形象，通过颜色、字体、商标等。

2.用户需求

• 用户细分：创造用户细分群，因为不同的用户群有不同的需求，并且有时候这些需求还是彼此矛盾的
• 可用性和用户研究：市场调研方法——现成调查、任务分析（从环境中直接研究行为）、用户测试
• 创建人物角色：计划阅读《赢在用户》进行深入学习

3.战略文档

• 提供目标清单，不同目标之间的关系分析，并说明这些目标如何融入更大的企业环境中去。

范围层

功能规格和内容需求

范围层定义：

这样你才知道你正在建设什么？

这样你才知道你不需要建设什么？

1.功能规格

• 定义需求：第一类，人们讲述的、他们想要的东西。第二类，真正解决问题的方法。第三类，人们不知道他们是否需要的特性。
• 人物角色：通过创建虚拟的人物来帮助我们更好的理解用户需求。
• 场景：把人物角色放到一个简短的故事中去，简单描述一个人物角色会如何完成这些用户需求。通过想象“我们的用户将会经历怎么样的过程”，来帮助我们找到能帮助他顺利完成这个过程的潜在需求。

  

  2.功能规格说明
• 乐观：这个系统不允许用户购买没有风筝线的风筝 → 如果用户想买一个没有线的风筝话，这个系统应该引导用户到风筝线页面
• 具体：最受欢迎的视频要重点关注 → 上一周被播放最多的视频要显示在列表的最前端
• 避免主观的语气：这个网站的风格是闪耀的 → 网站的外观应该符合企业的品牌指南文档

3.内容需求

• 不要混淆某段内容的格式和他的目的。FAQ只是指他的格式，不要忽略“常见”这个词，他的目的是可以随时提供用户普遍需要的信息。

4.确定需求优先级

• 参考：【思考】需求的优先级排序——滴滴迭代

结构层

交互设计和信息架构

范围层定义：

交互设计和信息架构都强调一个重点：确定各个将要呈现给用户的元素的模式和顺序。交互设计关注于将影响用户执行和完成任务的元素。信息架构则关注如何将信息表达给用户的元素。

1.交互设计

• 概念模型：如购物车，在典型的电子商务网站概念模型中是一个容器。
• 错误处理：一，将系统设计设计成不可能犯错的那种。比如自动挡汽车。二，使错误难以发生。帮助用户找出错误并改正他们，但是要注意不要过度。三，系统为用户提供从错误中恢复的方式。如撤销功能。提供大量的警告。

2.信息架构

• 结构化内容：设计组织分类和导航的结构，让用户可以高效率、有效地浏览网站的内容。

  

• 结构方法：基本单位——节点。分为层级结构、矩阵结构、自然结构、线性结构。
• 组织原则：战略告诉我们“用户的需求是什么”，范围则告诉我们“什么样的信息将满足那些用户需求”。在创建结构时，我们就要具体地识别出用户心中至关重要的那些信息。
• 架构图：记录概念关系——哪些类别需要放在一起，而哪些需要保持独立？在交互过程中，哪些步骤要怎样的配合。

  

框架层

界面设计、导航设计和信息设计

框架层定义：

结构层界定了我们产品将用什么方式来运作，框架层则用于确定用什么样的功能和形式来实现。

界面设计 按钮、输入框、和其他界面控件 提供给用户做某些事的能力

导航设计 提供给用户去某个地方的能力

信息设计 传达想法

1.界面设计：个人认为本书的论述有些过时，在此不再赘述。

2.导航设计：

• 提供用户一种在网站间跳转的方法。
• 传达这些元素和它们所包含内容之间的关系。
• 传达它的内容和用户当前浏览页面之间的关系。

3.信息设计：

• 用反映“用户的思路”和“支持他们任务和目标”的方式来分类和排列这些信息元素。

4.线框图：

表现层

感知设计

五感：嗅觉、味觉、触觉、听觉、视觉

1.忠于眼睛：眼球追踪

• 眼睛遵循的是一条流畅的路径。
• 为用户提供有效选择的、某种可能的“引导”。

  

  2.对比和一致性：栅格布局

  3.内外部一致：品牌识别

  4.配色方案和排版

  5.设计规范文档