用户体验要素—以用户为中心的产品设计

1.用户体验为何如此重要

什么是用户体验：

用户体验并不是指一件产品是如何工作的，用户体验是指“产品如何与外界发生联系并发挥作用”，也就是人们如何“接触”和“使用”它。

如果说按钮时的“嘀嗒”声似乎无关紧要，但如果这个声音决定你是否能够喝到咖啡，拿它就变得很关键。

从产品设计到用户体验设计

提到产品设计，人们往往会想到产品的感官方面的表现（其表现最直接），而忽略听觉方面的要素。

功能

产品设计一般是由功能决定，而用户体验设计通常要解决的是应用环境的综合问题，要综合包括：

• 视觉设计；
• 功能设计；
• 同时解决产品面临的其他问题。

用户体验与网站

用户的困境：
产品或者网站（内容或交互为主）的使用过程中，用户依靠自己的智慧与经验找不到”出路“。

提供优质的用户体验是一个重要的、可持续的竞争优势。

企业在财务营收上更加关注的是投资回报率（return on investment）ROI；衡量产品达到“商业目标”方面的效率有多高，一般会使用转化率（conversion rate）：
$$\frac{3个注册者}{36个访问者}=8.66\%的转化率$$

互联网类的产品，转化率的提高意味着收入的提升。与简单的销售数字比较，转化率可以让你更加强烈的感受到在用户体验上的投入所得的回报。

任何在用户体验上所做的努力，目的都是为了提高效率：

• 帮助人们工作得更快
• 减少他们犯错的几率

以用户为中心的设计（user-centered design）思想：在开发产品的每一个步骤中，都要把用户列入考虑范围之内。目的是：创建吸引人、高效的用户体验。

2.用户体验要素

用户体验的整个开发流程，都是为了确保用户在你的产品上的所有体验不会发生在你“明确的、有意识的意图”之外。也就是说，要考虑到用户有可能采取的每一个行动的每一种可能性，并且去理解在这个过程的每一个步骤中用户的期望值。

这个庞大的工作，可以分解成各个组成要素，以帮助更好的解决整个问题：

用户体验构建的五个层面：

1.表现层surface：你看到的是一系列的网页，又图片和文字组成；

2.框架层skeleton：按钮、控件、照片、文本区域的位置；用于优化设计布局，以达到这些元素的最大效果和效率——当你需要时，能记得标识并找到购物车按钮；

3.结构层structure：比框架层更加抽象，框架层时结构的具体表达方式。框架层确定了页面上交互元素的位置；而结构层则用来设计用户如何达到某个页面，并在他们做完事之后能去什么地方。框架层定义了导航条上各要素的排列方式，允许用户可以浏览不同的商品分类；结构层则确定哪些类别应该出现在那里。

4.范围层scope:结构层确定网站各种特性和功能最合适的组合方式，而这些特性和功能就构成网站的范围层。这个功能（或任何一个功能）是否应该成为网站功能之一，就属于范围层要解决的问题。

5.战略层strategy：范围层由战略层决定，包括用户需求和企业商业目标。

五个层面由底向上逐步开展，而且相互由重叠部分。

3.战略层：产品目标与用户需求

用户研究以及需求管理，产出商业需求文档（需求和商业相结合）

基础——明确两个基本问题：

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

产品目标

1.商业目标：或者说是产品目标

2.品牌标识：

视觉层面上的商标、色调、字体设计

情感方面的情绪反应、概念、形象。

3.成功标准：

KPI，一些可以追踪的指标：用于衡量是否满足了我们自己的目标和用户需求。

好的成功标准：不仅影响项目各阶段决策；也为衡量用户体验工作价值提供了具体的依据；与用户使用该产品的方式有一定关系（转换率与成单率）。

依赖广告收入的网站：印象数（impressions）——网站上每一个广告的每天被展示的数量。但必须衡量用户需求与自己的目标，不能只看此类指标的增长。

用户需求

首先得确认自己的用户，以及他们的需求。

1.用户细分：

方法：

• 人口统计学标准：性别、年龄、教育水平、婚姻状况、收入等
• 消费心理档案：用来描述用户对于这个世界，尤其是与你产品有关的某个事物的观点和看法的心里分析方法。

不同用户群体的需求可能不同或是冲突，用户细分，研究不同用户群体的不同需求，从而设置相应的产品方案满足对应群体的需求。

可用性与用户研究

《人人都是产品经理》

团队角色和流程

拟定决策时，普通员工经常被忽略，而这些人就是负责企业每天正常运作的人。这些人通常更加知道“什么行得通，什么不可行”——特别是用户据需求方面。

战略文档在项目进行期间，应该被所有的参与者频繁的使用，以帮助他们做出正确的决定，提高他们对这些事情的理解。

战略应该是设计用户体验流程中的起点，但不意味着项目开始战略就完全确定，其是可以演变和改进的。

4.范围层：功能规格和内容需求

将用户需求转变为产品需求，确定产品范围，即立项中的需求开发，产出产品需求文档？？？

带着“我们想要什么、我们的用户想要什么”，我们才能弄清楚如何去满足这些战略目标。也就是，把这两项内容转变为产品应该提供给用户什么样的内容与功能，战略就变成了范围。

定义项目范围，同时在做两件事：

• 这是一个有价值的过程；
• 同时能产生有价值的产品；

用文档来定义需求：

• 这样你才能知道你正在建什么？
• 以及你不需要建什么？

如果你不能有意识的管理你的要求，你将陷入可怕的“范围蠕变“——范围像滚雪球一般逐渐变大。

截至到此，内容大多与产品的工作流程类似

5.结构层：交互设计与信息架构

产品架构与交互设计，产品的业务流程、数据流程；产品各个页面之间的逻辑结构，以及每个页面要实现哪些功能

在定义好用户需求并排列号优先级别之后，我们已经对最终产品将会包括什么特性已经有了清楚的图像。然而这些需求并没有说明如何将这些分散的片段组成一个整体，结构层——就是为网站创建一个概念结构。

其适当的将我们的关注点从抽象的决策与范围问题，转移到更能影响最后的用户体验的具体因素。

交互设计：关注描述"可能的用户行为"，同时定义“系统如何配合与响应”这些用户的行为。即，用户移动，系统响应；接着用户再移动，回应系统的响应；如此往复。交互设计，要求系统能够预测用户的移动。

6.框架层：界面设计、导航设计和信息设计

单个页面的整体布局

将结构层中的大量概念化的东西进行细化，确定详细的界面外观、导航和信息设计，让晦涩的结构变得实在。

1.界面设计：的全部事情就是选择正确的界面元素。这些元素要能帮助用户完成他们的任务，还要通过适当的方式让它们容易被理解和使用。

哪个功能会在哪个界面上完成，再结构层的交互设计中已经决定；这些功能在界面上如何被用户认知到，则属于界面设计的范畴。

2.导航设计：

• 首先，必须提供一个在各网站之间跳转的方法；
• 其次，导航设计必须传达出这些元素和他们所包含内容之间的关系；
• 最后，导航设计必须传达出它的内容和用户当前浏览页之间的关系；

3.信息设计：使用一种可以反映用户的思路和支持他们的任务和目标的方式来分类和排列这些信息元素。

如个人信息行的设计——设置分类：个人信息、联系方式、其他联系方式。

4.线框图：

页面布局是将信息设计、界面设计、导航设计放置到一起，形成一个统一的、有内在凝聚力的架构。

线框图是对一个页面中所有组成部分以及他们如何结合到一起、最直观的描述。是整合框架层全部三种要素的方法：

• 通过安排和选择界面元素来整合界面设计；
• 通过识别和定义核心导航系统来整合导航设计；
• 通过放置和排列信息组成部分的优先级来整合信息设计。

把这三者放到一个文档中，线框图就可以确定建立在基本概念结构上的架构，同时指出表现层的设计应该的前进方向。

7.表现层：感知设计

页面的感官呈现（不只是视觉方面）

在这个五层模型的顶端，注意力转移到产品用户会首先注意到的地方：感知设计。

这里内容、功能、美学汇集到一起产生一个最终设计，完成其他四个层面的所有目标，并同时满足用户的感官感受。

1.感受的五个方面：

• 嗅觉和味觉
• 视觉
• 触觉
• 听觉

8.要素的应用

创造良好的用户体验，最重要的工作内容是大量收集偁待解决的非常细微的问题。“成功的方法”和“注定会失败的方法”的差异，归根结底就以下两点：

1）了解你正在试着去解决的问题：这个问题是哪个需要改变哪个层面，例如一个紫色按钮是个问题，是：

• 颜色—表现层
• 位置—框架层
• 功能—结构层

2）了解这些解决办法所造成的后果：要记住你所做出的每一个决定对其上、其下层面都有可能会产生的“连锁反应”。

提出正确的问题

将每一个决定都建立在对其背后议题的理解之上，回答每一个决定的问题：你为什么要这么做?