序文

在独立担任一个产品半年后，本人对产品战略层及范围层有了更多的考虑，深感Garrett巨匠的《用户体验要素》之魅力，很多东西虽然看似根底精练，但是经得起不时咀嚼，而且每次都能有新的发散，所以第二次拜读本书，并结合本人的经历和实践案例，重新梳理了一套用户体验要素，分享给大家。

一、概要

用户体验设计就是 “以用户为中心的设计”，即发明“每件事都依照正确的方式在任务”的用户体验 ，让用户门庭若市，就像《Don't make me think》里提到的“这会让用户觉得本人更聪明，更能掌握全局，这会让他们成为老用户”。我们可以围绕“以用户为中心的设计”得出一套产品设计的思想方式： 从笼统到详细逐层击破五个层面，包括战略层、范围层、构造层、框架层和表现层 ，最终到达用户体验设计目的。

二、自下而上地建立

在辨别谈这五个层面之前，我想特别阐明下本书中关于这五个层面之间的一个重要观念 “自下而上地建立，且让任何一个层面中的任务都不能在其上层面的任务完成之前完毕” ，虽然每个层面都是依据它上面那个层面来决议的，但并不意味着各层面都必需互相独立，“较低层面”的决策都必需在设计”较高层面“之前做出（图表一），而是”较低层面“的决策只需在”较高层面“设计完成之前完毕即可（图表二）。

比方设计”构造层“时仍可对由于构造层设计而影响的”范围层“决策停止更新，但是”范围层“的一切决策必需在”构造层“设计完成前完毕（而不是开端前完毕）。经过这个我想到了产品的任务流程， 传统的瀑布流任务流程就是第一种，互相独立且完成第一步才干第二步，而矫捷型开发流程则更像第二种 ，效率也更高。很多东西都是由此触彼，希望大家可以把体验要素五个层面跟产品流程结合起来，可以极大地增加返工，进步任务效率。

三、五个层面

1、战略层

战略层的制定决议了产品的根本走向，而战略层又是以企业目的为前提，依据产品目的和用户需求来制定。

产品目的

产品目的即 企业要经过产品失掉什么 ，次要经过三个方面来权衡：商业目的、品牌标识和成功规范。以下以领取宝的蚂蚁森林为例。

• 商业目的：复杂说就是替企业赚钱或替企业省钱，蚂蚁森林属于后者，它不是盈利性产品，但是它属于领取宝产品的战略支持层面，它的商业价值是提升整个领取宝产品的用户活泼度。
• 品牌辨认：品牌辨认可以是概念零碎，也可以是心情反响，用户与产品发生交互时不可防止地在脑海中构成的品牌抽象。比方，蚂蚁森林有助于领取宝竖立正面的品牌抽象，经过公益的结合，提升“企业品德”，取得用户好感。
• 成功规范：指一些可量化可追踪的目标，用来显示产品能否满足了我们的目的和用户需求。比方，蚂蚁森林自身的日活月活等以及它的上线后对领取宝产品用户活泼度的提升、对阿里/领取宝品牌抽象的提升等。

用户需求

用户需求即 用户希望经过产品失掉什么 ，而战略层制定的一项重要任务就是确定用户需求，次要有用户细分和用户研讨两个方面。

用户细分办法：经过用户细分构建完好的用户画像

• 人口统计学：包括性别、年龄、教育程度、婚姻情况、支出等。
• 消费心态档案：用来描绘用户关于这个世界，尤其是与你的产品有关的某个事物的观念和看法的心思剖析办法。
• 用户认知水平：用户关于互联网产品的熟习水平和顺应水平，是小白用户还是重度用户。

用户研讨办法：经过用户研讨确认用户需求。

• 市场调研办法：问卷调查、用户访谈、焦点小组
• 现场调查：一整套完好、无效且片面的办法，用于理解在日常生活情境中的用户行为
• 义务剖析：每一个用户与产品的交互行为都发作在执行某一义务的环境中
• 用户测试：请用户来帮助测试你的产品，最终目的是寻觅令产品更容易运用的途径，详细可参照《Don't make me think》一书，可用性测试也是我本人常用的验证产品方案可行可用性办法。

创立人物角色：也可以称作用户模型或用户简介，代表真适用户需求的虚拟人物。

• 经过用户调查和用户细分进程中失掉的分散材料重新关联起来，赋予一张人物的面孔和名字，创立出代表真适用户需求的虚拟人物。我们依然以蚂蚁森林举个例子：
  

2、范围层

制定完战略层，我们对“企业想要从产品取得什么”和“用户想要从产品取得什么”有了一个较明晰的认知，接上去要做的就是对已确认需求停止进一步详细拆分细化和排定优先级，思索提供应用户什么样的功用和内容。

功用需求

功用型方面思索的次要是详细满足用户哪些需求，需求又大致可以分为三类：障眼需求、基本需求和潜在需求。举个例子，就像我上一篇文章 《从一个包子的降生谈产品任务流程》 中提到的：一个南方人希望装置第三只手，缘由是这样他就可以一只手拿馒头，一只手夹菜，一只手做作业，这就是 障眼需求 。由于他的 基本需求 是边吃饭边做作业，而完成方式有很多更好的方案，比方把馒头和菜蓬勃发展的行业不仅给从业者提供了巨大的发展机遇，也带来了全新的挑战。整合一同做成包子，这样就可以一只手拿包子，一只手做作业，而不是奇葩地装置上第三只手。经过这个需求我们发现 潜在需求 是提升做作业的效率，而不是一定要占用吃饭工夫。

内容需求

内容型方面需求与功用需求相配合、交融，无效地搜集和管理内容资源。内容包括但不局限于音视频、图片和文字，内容特性想要到达的规模，将对你所做出的用户体验决策发生极大的影响。我们直接举个例子，以下为某基金排行，优先展现全部的月排行，展现内容重心为各基金近一周和近一月的涨跌数据，并以近一月涨跌降序陈列。

确定优先级

范围层决策的一项重要任务就是排定优先级，在调研进程中会发现少量的用户需求，有时分一个战略目的会对应多个需求，一个需求会对应多个功用，但是在快节拍的互联网环境中，留给产品上线或迭代的工夫很无限，我们必需学会排定功用的开发优先级，疾速迭代。

功用规格阐明

文档不能处理成绩，但是定义可以 ，我很喜欢这句话。功用规格阐明不需求包括产品的每个细节——只需求包括在设计或开发进程中呈现有能够混杂的功用定义，次要包括以下几种规则：片面但不纤细、悲观正面表述、详细和防止客观的语气。这也是PRD文档的一局部，我前面会详细再写篇PRD文档内容的文章，这里就不展开论述。

3、构造层

构造层就是将范围层中那些分散的需求/功用片段组成一个全体。

交互设计

功用方面思索的次要是交互设计，关注于描绘“能够的用户行为”，同时定义“零碎如何配合与呼应”这些用户行为。交互设计是一门大学科，可以详见我其他专门的文章，这里次要论述概念模型。 概念模型就是在用户惯有思想里“交互组件将怎样任务”的思想模型 ，被举得最多的例子就是电商平台的购物：挑选商品—放入/移出购物车—结账—订单和发票。不止电商产品，大局部互联网产品的概念模型都可以在理想生活中找到映射，比方滴滴问世之前大家的打车行为、美团问世之前商家的促销行为等。

信息架构

内容方面次要思索的是信息架构，信息架构关注的就是 出现给用户的信息能否合理并具有意义 。关于用户来说，能否疾速的找到想要的东西将极大地影响用户体验，所以产品的敌对水平也很大局部取决于 信息构造的目的：设计出让用户容易找到信息的零碎。 信息架构的设计准绳：与战略层的产品目的和用户需求绝对应；辨认用户心中至关重要的信息并出现。

我们以某基金产品中单个基金的展现界面为例：该基金产品目的是为广阔投资者提供专业、及时、片面的基金资讯。用户点击某个基金最想看到的是该基金的收益状况。所以该界面重点出现的是该基金最近净值以及当日涨跌状况，然后是近期收益状况。 信息架构设计的构造化办法：

层级式构造、矩阵构造、自然构造、线性构造；从上到下&从下到上，要具有“包容生长和顺应变化”的才能。以下举个某产品的信息架构为例子：
关于构造层设计的论述中，给我感受很深的一个观念是： 构造质量最重要的规范，不是“整个进程一个需求多少尽量少的步骤”，而是“用户能否以为每个步骤都是合理的”以及“以后步骤能否合理地延续了上个步骤中的义务”。 这个思想最直接的表现例子就是挪动端产品的注册登录分步方式，而不是挤在同一个页面。

4、框架层

经过构造层设计，我们的产品曾经有了一个全体的抽象，就像一团体有了一副骨头架子。接上去我们要做的就是在适宜的地位恰如其分地填充上血肉，确定很详细的界面外观、导航和信息设计。

界面设计

• 阐明：从功用方面思索，界面设计就是提供应用户做某些事的才能，布置好能让用户与零碎的功用产品互动的界面元素。经过它，用户能真正接触到那些“在构造层的交互设计中”确定的“详细功用”。
• 目的：用户一眼就能看到和运用最重要的东西，如下面基金界面中，最新净值和日涨幅放在了最显眼的地位。
• 做法：基于用户最常采用的行为，交互元素的规划要让用户用最容易的方式获取和运用。

导航设计

• 阐明：提供应用户去某个中央的才能。
• 目的：完成跳转、传达各导航按钮和它们所包括内容的关系，传达导航内容和以后阅览页面之间的关系。
• 做法：清楚地通知用户“他们来自哪里”“他们在哪里”“他们可以去哪里”。

信息设计

• 阐明：微观的信息架构，详细页面上的信息出现。
• 目的：用一种能“反映用户的思绪”和“支持他们的义务和目的”的方式来分类和陈列这些信息元素。
• 做法：将信息分类，按优先级陈列，遵照用户的思绪。

5、表现层

在 框架层，次要处理的是放置的成绩 。界面设计思索可交互元素的规划，导航设计思索在产品中引导用户挪动的元素的布置，信息设计思索传达给用户的信息要素的排布。接上去就是 表现层，次要处理并补偿“产品框架层的逻辑排布”的感知出现成绩 。就像一团体在骨骼架上填充完血肉，但还是显得流畅，方便面世，这时分还需求雕琢上精密的五官，水嫩的皮肤、细长的手脚指等。

嗅觉/味觉/触觉设计

在互联网产品中较少运用到这些方面，在AI产品中能够会较为罕见，此处不做详细展开。

听觉设计

听觉设计在游戏类产品中较为罕见，在非游戏类产品中多用作告诉提示，此处也不做详细展开。

视觉设计

表现层设计中最为罕见的就是视觉设计，我们做重点论述。

• 让产品“说话”

一个好的视觉设计，可以 正确地延续下层确立的产品思绪，给予相应视觉效果支持。 比方传递品牌抽象、进步付费转化率等，举个例子，下图为某个职场社交软件，选择蓝色为主色彩，无论加载页还是icon等都以商务范为根底，很好地支持了职场社交的品牌抽象。

• 视觉比照和引导

在不毁坏网站构造状况下，增强各个模块之间的区分 ，把用户的留意力吸引到界面中的关键局部。

用户的阅读轨迹是流利的途径 ，各个设计元素不会分散用户留意力，视觉引导支持用户去完成他们的目的义务。

异样以方才那个基金界面举例：关键信息采用绿色色块展现，一眼就能看到；次重要信息采用白色色块，两头用灰色色块隔离，模块明晰不突兀；涨跌幅辨别采用红绿色字体，看到跌幅是绿色的可一定水平降低心里冲突；想要用户发生点击行为的“购置/定投”采器具有引诱力的橘黄色展现；整个用户阅读轨迹也十分顺畅，并可以很快聚焦重点内容。

• 外部视觉设计的分歧性

视觉设计的分歧功能够使产品的设计无效地传达信息，而不会招致用户迷茫或焦虑。 这边举个反例吧，某公司作为一个挺大的公司，这设计真的不敢恭维，我第一次用的时分都有点晕，各页面跳转后觉得不是同一个产品里，估量一个要素是各局部内容的产品经理和设计团队不同，而且还没有一致的设计标准；另一个要素是该公司降生于PC时代且如今PC端业务还很微弱，很多中央把网页作风带入了挪动产品中。

• 设计分解品和作风指南

设计分解品 也可以称为视觉模型，确切地说，它就是 从已选定的各个独立的组件中树立起来的、一个最终的可视化产品 。从框架层的线框图到表现层的设计分解品，是从一个个惨白组件过渡成为一个无机全体的进程。

作风指南 的树立是由于：随着工夫推移，我们的决策缘由会逐步从记忆中消逝；当人们分开这份任务后，后来者可以很好地承继这些规范。所以我们需求作风指南来承载这些设计决策，这份文档确定了视觉设计的每个方面，从最大到最小范围内的一切元素以及某一个模块或功用的详细规范。其实从下面一个例子就可以看出作风指南有多重要了。

四、总结

体验要素五个层面间无论自上而下还是自下而上都是毫不相关的，假如更高层面比方表现层设计地乌七八糟，用户能够很快就会分开而不会留意到你的范围层决策多么英明，你的交互设计做得多么好。假如更低层面比方构造层设计错误，那么更高层面的决议和设计就得到意义，只会是花架子。所以我们在用户体验设计进程中需求依据实践状况，在自上而下和自下而上中获得均衡，真正做到以用户为中心的产品设计。

最初，感激您的阅读，有兴味的冤家也可以看我上一篇文章《从一个包子的降生谈产品任务流程》。

古道千，已经创业者，现于上海，喜欢看书、旅游、摄影，团体微信：qianxunlaosheng，欢送交流。