一、什么是交互设计？

先来看一下百度百科的定义

交互设计（英文Interaction Design, 缩写IXD)，是定义、设计人造系统的行为的设计领域，它定义了两个或多个互动的个体之间交流的内容和结构，使之互相配合，共同达成某种目的。交互设计努力去创造和建立的是人与产品及服务之间有意义的关系，以“在充满社会复杂性的物质世界中嵌入信息技术”为中心。交互系统设计的目标可以从“可用性”和”用户体验“两个层面上进行分析，关注以人为本的用户需求。简而言之，交互设计是解决特定场景下的人群如何高效使用机器或软件的目标行为。

为什么要做交互设计

在使用网站，软件，消费产品或各种服务的时候（实际上是在同它们交互），使用过程中的感觉就是一种交互体验。随着网络和新技术的发展，各种新产品和交互方式越来越多，人们也越来越重视对交互的体验。当大型计算机刚刚研制出来的时候，可能为当初的使用者本身就是该行业的专家，没有人去关注使用者的感觉；相反，一切都围绕机器的需要来组织，程序员通过打孔卡片来输入机器语言，输出结果也是机器语言，那个时候同计算机交互的重心是机器本身。当计算机系统的用户越来越由普通大众组成的时候，对交互体验的关注也越来越迫切了。因此交互设计作为一门关注交互体验的新学科在二十世纪八十年代产生了。

从用户角度来说，交互设计是一种如何让产品易用，有效而让人愉悦的技术，它致力于了解目标用户和他们的期望，了解用户在同产品交互时彼此的行为，了解“人”本身的心理和行为特点，同时，还包括了解各种有效的交互方式，并对它们进行增强和扩充。

通过对产品的界面和行为进行交互设计，让产品和它的使用者之间建立一种有机关系，从而可以有效达到使用者的目标，这就是交互设计的目的。

二、交互设计常用原则和定律有哪些？

尼尔森十大可用性原则

1、状态可见原则

系统应该让用户时刻清楚当前发生了什么事情，也就是快速的让用户了解自己处于何种状态、对过去发生、当前目标、以及对未来去向有所了解，一般的方法是在合适的时间给用户适当的反馈，防止用户使用出现错误。

即在用户操作界面功能时给予实时反馈，例如：页面加载状态提示、按钮点击后的状态变化、进度条提示等。

2、环境贴切原则

设计的一切表现和表述，尽可能贴近用户所在的环境，将现实环境的操作功能巧妙的转化为线上功能，使其贴近用户。使用用户能听懂的专业术语，涉及到专业化语言时要转化成用户熟悉的语言。

即模拟真实的事物，使用户更容易理解。例如：天气应用中的天气插图、音乐播放器的胶片都是生活中熟悉的场景和物品，降低理解成本。

3、操作可控原则

对于用户的误操作，提供二次确认或者撤销的功能，这样可提高用户的操作可控性。

例如：删除联系人二次确认提示、消息可撤回操作。

4、一致性原则

遵循统一的产品设计规范／逻辑。这里的一致性包含产品和跨平台产品之间的一致性。

一致性包含视觉交互、文案描述、组建样式等，例如：微信小程序设计规范。

5、防错原则

设置防错的机制，减少用户犯错。在用户选择动作发生之前，就要防止用户容易混淆或者错误的选择。

例如：用户名称校验提示、手机号码位数限制等。

6、易取原则

减少用户记忆负荷，在适合的时机给用户需要获取的信息。

例如：验证码读取、找人转账提示等。

7、灵活高效原则

提供灵活的操作和高效的获取信息能力。

例如：手机号码一键登录、消息关键字识别等。

8、优美简约原则

保留产品最主要的信息，如果不是优先级最高，要尽一切可能避免去影响产品的简洁和美观。

9、容错原则

用户在使用产品过程中出现了问题，及时准确的告知用户出现问题的原因。

例如：信息输入提示、搜索无结果等。

10、提供人性化帮助

在用户需要的时候提供必要的帮助说明。

例如：新功能引导、解释说明文案等。

七个交互设计定律

1、菲兹定律

点击一个目标的时间同以下两个因素有关：

（1）设备当前位置和目标位置的距离（D）。距离越长，所用时间越长；

（2）目标的大小（S）。目标越大，所用时间越短。

该定律经常运用于鼠标从点A到点B的运动。

例如常用按钮的尺寸设计等。

2、希克定律

一个人面临的选择（n）越多，所需要作出决定的时间（T）就越长。

交互设计中要合理设置选项，以免用户使用中决策时间过长，降低使用效率。

3、米勒7±2定律

乔治米勒对短时记忆能力进行了定量研究，他发现人类头脑最好的状态能记忆含有7（±2）项信息块，在记忆了 5-9 项信息后人类的头脑就开始出错。

例如：手机号码的分位显示、应用中标签栏数量等

4、邻近性法则

人们通常将距离近的事物划分为一组。

界面设计中可以用对象间的相对距离来区分信息层级。

5、复杂性守恒定律

每个应用程序都具有其内在的、无法简化的复杂度。无论在产品开发环节还是在用户与产品的交互环节，这一固有的复杂度都无法依照我们的意愿去除，只能设法调整、平衡。

例如：在智能手机出现之前，手机上的操作按钮都是实体按钮。在智能手机出现手，手机被整个屏幕占据后，所有的操作都集合在了手机系统之中，等于把物理操作转移到了系统操作中，其本身的功能复杂程度并没有发生改变，只是转移了而已。

6、防错原则

大部分的意外都是由设计的疏忽，而不是人为操作疏忽。因此，在设计中要有必要的防错机制；在此，特别要注意在用户操作具有毁灭性效果的功能时要有提示，防止用户犯不可挽回的错误。

例如：登录时用户名校验，手机号码位数限制等。

7、奥卡姆剃刀原则

“切勿浪费较多东西去做，用较少的东西，同样可以做好的事情。

”这个原理称为“如无必要，勿增实体”，即“简单有效原理”。

在设计中可以使用户关注最主要的信息而非其它无关紧要的事物，从而提升使用效率。

三、交互设计如何开展工作

首先在交互设计师拿到需求后不要急着打开软件开始绘制线框图，而是要先分析需求，了解产品的战略层和范围层的业务目标。把握产品设计大方向，只有方向对了后面的工作才是有价值的。

把握了产品方向，下面就该进行需求的分析，

首先针对需求考虑5个问题：

1、为什么要做这个功能？（业务需求）

2、产品期望得到怎样的成果？（业务目标）

3、谁来使用？（目标用户）

4、他们要怎样使用？（用户需求）

5、如何让他们都来使用？（将业务目标转化为用户行为）

清楚这5个问题后，再根据交互设计流程进行一步一步的进行

这实际上就是对需求的战略层分析。

我们进一步分析业务需求（业务目的、业务目标）和用户需求（目标用户、用户体验目标），把握关键因素（用户的动机、担忧和影响目标达成的障碍）。

归纳这些需求，明确设计策略。

将“业务目标”转化为“用户行为”，通过引导用户的使用来帮助产品实现目标。

从设计“用户行为”到设计“用户界面”，用户行为决定了用户界面，用户界面也导致了用户会出现什么样的行为。

设计需求分析方法就是要帮助用户创造动机、排除担忧、解决障碍。

四、如何进行用户研究，方法有哪些

评估的形式及方法

常见的评估形式分为三类：

1、评估主体：根据评估的主体不同来进行区分，即谁来做评估。

按照评估主体来区分主要有两个主体：用户和专家

用户评估主要靠收集用户使用数据，也就是用户测试，它的数据相对客观，但时间和费用较多，评估范围较窄。

专家评估是让工程师及设计师等专家基于自身的专业知识和经验进行评估的一种方式。专家评估相对主观，但费时少、费用少、评估范围窄。

两种评估方法可以相互补充，并结合使用。

2、评估性质：例如定性评估、定量评估或着其它方式。

按照评估的性质来区分可以分为定量评估和定性评估。

定量评估是指对可以计量的部分进行评价，如点击量、使用率等，可以用数据来说明。

定性评估是指对非计量性的部分进行评价，如流畅度、舒适性、创造性等进行评价。它只能表示一个度，无法准确用数据来说明问题。

3、评估过程：按照评估的过程来进行区分。

从评估的过程来区分可以分为理性评估和感性评估。

理性评估相对客观，从客观的角度出发判断客观事物。

感性评估更为主观，评估结果并没有客观规律。

在实际应用中也需要将理性评估和感性评估结合使用，才能完整的完成我们的任务，达到我们的目标。

常见的评估方法有四种：

1、原型评估方法：在产品研发过程中，对于界面设计以及程序的测试来获得用户的反馈是至关重要的。以用户为中心和交互式设计的重要因素之一就是原型方法，原型方法的目的是将界面设计与用户的需求进行匹配。

一般来说原型评估方法分为三大类型：

（1）快速原型：原型迅速成型并分配实施，在原型实验收集的信息基础上，系统从草案中得以完善。

（2）增量原型：应用与大型系统，从系统的基本骨架开始，需要阶段性的安装，及系统的本质特征是在初次安装完成后允许阶段性测试，以减少遗漏的重要特征。

（3）演化原型：对前期的设计原型不断进行补充和优化，直到成为最后的系统。

2、简易测试评估方法

在条件不允许的情况下，可以采取简易的方法来对用户体验进行评价。步骤是：

（1）实验室环境准备：准备好测试用的电脑或其他媒介。两个房间，房间1用来对被测试者进行测试，房间2用于设计师和工程师的观察。

（2）被试选择：分为用户组和专家组。

（3）进行测试：房间1中被试者根据自己的选择进行操作和测试，同时说出自己的内心想法，观察员在调查表上记录被试者的每一次的操作情况，包括出错情况和被试者的口语描述，当被试者在测试过程中遇到困难或操作无法进行时，观察员要给予一定的客观提示。房间2中通过相关设备将房间1的情况传输到房间2，设计师和工程师实时观察和记录被试者的情况，以便今后对产品做进一步的修改和完善。

（4）结果分析：通过多次测试后，将测试结果汇总，提取出交互设计中存在的问题，以及对交互设计有益的建议形成测试报告。

3、眼动评估方法

眼动追踪可以用来评价对产品（包括硬件产品和软件产品）设计的感性意象，评测产品设计特征。眼动评估的主要指标有注视热点图、搜索过程测量指标、兴趣区域即用户视觉注意的焦点区。可以结合口语分析法了解用户的所想 和所做。

4、脑电评估方法

通过对脑电信号的分析，研究者可以探索大脑的认知加工过程和受试者的心理状况。近年来脑电评估方法在人机交互心理学等领域应用广泛，被用来评估交互设计、人机界面、产品设计等方面的内容。但是脑电评估也有一定的缺陷，例如空间分辨率上的局限性，因而对某些认知过程和脑区的定位并不是很准确。第二，在许多相似的实验研究中，由于研究者采用了不同的实验材料和方法等，实验结果也存在差异性。第三 ，由于采集记录时间的滞后性，脑电所记录的并不一定是当下被试者所想到的内容。

采取哪种方法来开展用户测试和评估，要根据不同的任务结合不同的环境来开展，比如：时间、成本、资源等。

启发式评估法

是专家评估法的一种，也被称为经验性评估，最初由Nielsen博士提出。简单来说，启发式评估是一种简易的可用性评估方法，使用一套相对简单、通用、有启发性的可用性原则，让几个评审根据专业知识和经验来进行评估，发现产品潜在的可用性问题。

启发式评估的两大要素：评估者和评估参照的原则。   

对评估者的要求主要有四个方面：

（1）人数：推荐3-5人，有时会更少

（2）知识：最好同时具有可用性知识及设计知识

（3）身份：最好是非设计者本人，否者不具有客观性

（4）岗位：设计师或用户研究员

评估参照的原则有：尼尔森十大可用性原则、八项黄金法则、首页可用性指南、ios设计指南、拓展原则、HHS网页设计与可用性指南等。具体需要根据实际项目来选择，常用的是尼尔森十大交互原则。

什么时候适合使用启发式评估法？

交互设计和UI设计阶段、测试优化和产品发布后的阶段。

启发式评估的优缺点有哪些？

优点：成本低、效率高、发现大多数可用性问题，甚至是用户测试时不会出现的问题。

缺点：不能代表真实用户，相对主观、有时候发现问题过多、对评估人员知识背景要求较高。

什么时候适用？

（1）适合时间、资源有限的情况下快速发现可用性问题，降低风险及成本。

（2）版本变动不大的情况下，小成本检验。

（3）作为可用性测试的之前准备。

启发式评估流程是什么？

（1）准备阶段：确定范围、背景调查、参考评估原则、评委邀约、材料准备

（2）执行阶段：任务走查、整体走查、结果记录

（3）分析阶段：汇总讨论、报告总结、优化方案

可用性测试

先来看一下我们在平时工作中常常会听到这样的问题

产品经理：我们的用户觉得产品好不好用？使用过程中会不会遇到问题？他们是否满意？

设计师：设计的过程有一些纠结的地方，不知道实际用户是怎么理解和操作的怎么办？

产品开发后：想在大推前检验一下产品是否靠谱，适不适合大推？

当我们遇到这样的一些问题时，如何找到方法快速得到答案呢？

那就是接下来要介绍的可用性测试方法。

可用性测试是一种常用的、高效的方法。

它的定义是：通过观察具有代表性的用户，完成产品的典型任务，从而找出产品可用性问题并解决，目的是为了改善产品，让产品更容易使用。

什么时候适合做可用性测试呢？

一般是在：交互设计或UI设计、测试优化、正式发布三个阶段来做。当然是越早做越好，可以尽早发现问题并及时调整。

类型分为两种：形成式和总结式

形成式特点：小样本、发现问题为主、不能做定量对比。

总结式特点：大样本（30人以上）、定量的评估、可以做对比评估

可用性测试可以解决什么样的问题？

1、发现问题，产品在体验上是否存在问题

2、检验实现，期望的设计目的有没有达成，是否满足了用户的期望

3、产品评估，用户是否会满意

4、理解用户，了解用户行为习惯，了解用户认知，找到某些问题的原因

测试流程是什么？

整体上分为4个阶段：1、准备  2、测试  3、分析  4、优化

1、准备阶段要做的有哪些？

确定目标：确定测试目标决定了后面测试过程要怎样去设计

常见的测试目标有：

·对整个产品做可用性评估

·对新增的功能模块进行评估

·提前观察新方案对新老用户有怎样的影响

·提前检测改版是否达到预计目标

·设计时存在争议，如何选择解决方案

·某个环节流失率较高，检测是否为设计原因导致

·需要拓展某一类特殊用户，测试针对这类用户在设计上是否需要作出调整

准备测试方案

方案中应当包含以下内容：

·测试目的：明确测试的目的及范围，测试目的决定了测试方案

·测试关注点：与负责的设计师一起梳理测试中要关注的问题

·用户招募：招募要求，样本配比，招募渠道

·经费预算：奖励的形式和额度

·时间计划：用于把控时间计划

撰写测试脚本：设计测试任务，通过用户行为去观察提问来获得我们想要的内容

基本的流程有：

·暖场：3min，简单聊天，消除用户的紧张情绪

·测试说明：2min，对测试内容规则做说明

·测试前访谈：10min，了解用户基本信息

·简单试用：3min，让用户熟悉产品

·测试执行：30-45min，提示任务并观察

·事后访谈：15min，针对疑点问点追问，填写评价表

·道别：5min，支付礼金，送用户离开

招募用户

招募什么样的用户呢？

·根据测试目的来定，找出与测试目标有关的筛选纬度

·特别考虑用户使用行为相关的特征，例如竞品使用经验，使用产品的目的，用户的活跃度等

·挑选最核心的纬度，转化成用户招募的条件，并尽量客观化，具体化，可衡量

·避免设置交叉条件过多，导致样本代表性降低

·学会辨别真假的用户信息

招募多少用户合适？

·以发现问题为目的快速可用性测试，6-8名即可

·考虑产品的复杂性，覆盖人群差异性，适当做调整，拓展到10-15名

招募渠道有哪些？

·公司内部

·现有产品用户库

·公司其他产品用户库

·熟人，朋友等

·推广渠道：官微、公众号、门户网等

·社区，论坛，qq群等

·第三方调研公司

准备测试素材：低保真或高保真原型，或线上已经可以使用的产品，也可以准备一些量表工具来辅助测试。在测试

过程中需要用到的电脑或手机设备，摄像头，纸，笔，桌椅等。

测试场地选择：

·专业可用性测试实验室：一般对测试质量要求较高，旁听人数较多且需要采集丰富的数据的时候采用此方法。实验室有两个房间，一个测试间，一个观察间，中间有单向玻璃分隔。测试间中有多角度的摄像头，用来记录测试过程，观察间可以同步看到测试间里的情况，

·普通测试环境：在观察人数较少（小于3人），条件有限时使用。

预测试阶段：正式测试前进行预测试，保证测试流程通畅

·走查：记录可能出现的问题

·预测试：找人先测试一下

·调整：调整测试流程

正式测试阶段

测试参与人员有

·主持人：引导整个测试流程

·记录员：记录操作行为，访谈内容，发现问题等

·产品团队：参与旁听，观察，结束后交流

·用户：完成测试及访谈任务

测试过程中需要观察的要点：

·用户是否独立完成了任务

·是否存在无效操作或不知所措的情况

·用户是否满意

结果分析

边测试边总结，越及时越好

·测试完一个用户，做一次小结

·测试结束当天写小结，与设计师当场讨论

·重要问题反馈后再总结分析报告

·边测边改，边改边测

结果分析4个步骤：1、对发现分类  2、整理不确定项  3、评定优先级  4、结果记录

撰写报告

从4个方面来写：

·总体如何

·有哪些问题

·严重程度如何

·建议是什么

·除此之外，还可以围绕关注的问题，未满足需求补充分析

优化跟踪

在测试之后需要出优化的方案，测试优化的过程是循环的。

测试之后如果还有其他问题没有得到解决，可以结合其他的一些测试方法来得到。

问卷调研

问卷调查法是以书面提出问题的方式搜集数据的一种研究方法，研究者将所要研究的问题编制成问题表格，让受访对象以邮寄、当面作答、在线作答或追踪访问的方式填写，从而了解被试者对某一现象或问题的看法和意见。问卷调研可以用于需求挖掘阶段，也可以用于产品上线后的评估阶段。

如果是想了解用户对产品上线后的满意度，可以使用问卷调研的方法。它比较适合去了解用户的认知态度，也可以附带了解用户的行为习惯，

问卷调研的优缺点

优点：统一性、灵活性、量化性、匿名性

缺点：（1）只能获得书面的信息，而不能了解到生动、具体的情况。（2）缺乏弹性，很难做深入的定性调研。（3）调查者难以了解被调查者是否认真作答，是不是自己填写的。（4）填写问卷比较容易，有些别调查者会随意选择，或者按照社会主流观点选择，这样会使调查失去真实性。（5）回复效率低，对无回答者的研究比较困难。

问卷调查的使用场景

适用于：（1）需要进行定量分析的调研。（2）需要匿名进行调研的问题。（3）对已有假设进行检验。（4）寻找问题隐藏的关联。（5）对产品设计用户认知及态度的评估。

不适用于：（1）发现和描述具体问题。（2）探索受访对象的模糊态度。（3）获取创新想法。（4）获取精确的行为数据。

问卷调研流程

1、确定目标：确定调研目的、对象、分析目的和应用对象。

2、调研方案：通过访谈、经验、理论等，确定调研框架，题目选项，分析思路，投放渠道，相本配比等。

3、问卷设计：问卷设计，问题美化，投放渠道。

4、问卷测试：多人测试，确保问卷的可读性，逻辑通畅

5、问卷投放：按照计划好的投放渠道进行投放，回收数据，数据清洗

6、问卷分析及填写报告：分析及报告填写，调研结果落地

数据分析

概述：通过在网站或应用中进行数据埋点，获取用户对产品的使用和行为数据，并进行基于产品体验优化的数据进行分析。

数据分析可以做什么？

1、可以做到用户从哪里来，来了多少

2、获取用户属性，用户地域，用户设备

3、访问了哪些页面，使用了哪些功能，消费了多少钱，消耗了多少时间

4、哪些流量可能存在问题，忠诚度如何，活跃度如何，有没有达到目标，和行业相比如何

5、流失情况如何，离开之后是否还回来

可以作为产品的眼镜和大脑，提供客观衡量的依据，可以持续优化改进。

数据获取方式的对比

日志文件：优势，完整的服务端请求记录。

                  缺点，日志的获取和清洗有过滤成本，许多页面操作无法记录。

JS页面标记：优势，数据获取可控、灵活，可以对页面操作记录进行记录，获取数据比较完整丰富。

                      缺点，需要在页面植入JS标记代码，某些情况下无法获取，如当用户禁用JS功能时。

常用的数据监控平台

1、第三方监控平台：如Google Analytics、百度统计、腾讯云分析等

2、自研平台

数据分析流程

1、监控  2、定义  3、埋点  4、测量  5、分析  6、优化

Web分析常用的指标

PV：是指页面浏览量，网页浏览数实施评价网站流量最常用的指标之一，用户每一次访问网站中的页面均被记录，对统一页面多次访问，访问量累计

UV：是指独立访客，是通过互联网访问、浏览这个页面的自然人

UPV：是指唯一身份综合浏览量

访问：是指在一定时间范围内，网站所有访问者对网站发起访问的总次数，从访客来到网站到最终关闭网站所有页面，记为一次访问

识别用户的方式：IP、IP+User Agent、cookie、User ID、设备ID、其他

复合指标

跳出率：指用户来到网站，只浏览了一个页面就离开的访问次数，占全部访问次数的百分比，简称“来了就走”。跳出率可以被用来衡量流量和页面质量，高跳出率表示访问者对着陆页面不感兴趣，没有继续访问更深入的页面。也可能页面设计存在问题，也可能是导入的用户不匹配。跳出率可以通过调整广告渠道，优化页面内容来降低。

退出率：访问者离开网站一次被记录为一次退出，某一范围内退出的数量/该范围的综合访问量就是退出率。如果关键流程中的某一页面退出率高，代表某一页面可能出现了问题。

访问时长：网站停留时长，页面停留时长，应用使用时长。访问量是访问质量的一个衡量指标，较长的访问时间说明用户与产品进行了较多的互动。

访问深度：可以理解为单个用户平均访问的页面数，是PV/UV的比值。访问深度也是访问质量的一个衡量指标，可以考察用户是否和网站进行了较多互动。这个比值越大，代表网站的粘性越高。

转化率：指在一个统计周期内，完成转化目标行为的次数占总访问次数的比率。根据设置不同目的进行计算，例如注册转化率、付款转化率等，是一个重要的分析指标。

移动端基础指标

移动端的基础指标监测与web端略有不同，但分析思路大致相同。指标分为：新增设备、累计设备、启动次数、单词使用时长。

常见分析内容

流量分析（哪里来？）、用户分析（什么样的用户？）、行为分析（如何使用的？）、路径转化（表现如何？）、流失分析（粘性如何？）

A/B test

A/B测试是一种帮助网页优化实验的方法。A/B测试的目的在于通过科学的实验设计和采集数据的方式，来获得具有代表性的实验结论，从而寻找到更好的产品策略。

简单来说，就是为同一目标制定两个方案，让一部分用户使用A方案，另一部分使用B方案，记录用户的使用情况，对比两个方案的结果，选择更符合的方案。

A/B test一般会在产品改版正式上线之前使用，来验证新的设计是否可以提高产品的表现。

A/B test可以测试的元素有：标题、图片、颜色、社交元素、段落文本、按钮、导航、任务流程、页面布局、价格、视频等。可一次只改变一个元素或一次改变多个元素的方式来测试，这就是两个测试类型单变量测试和多变量测试。

A/B test工具

Google Website Optimizer：搜索巨头提供的免费A/B test工具，一个很好的入门级工具，但是没有一些先进的功能。

Visual Website Optimizer：一个易于使用的A/Btest测试工具，包含功能有所见即所得的编辑器，单机地图，访问者分割和标签等。

Unbounce and Performable：集成着陆设计的A/B测试工具。

Vertster,SiteSpect,Webtrends Optimize and Omniture's Test&Target：企业级测试工具

App Adhoc Optimizer：国内A/B Test工具，同时支持前端（Web/H5、IOS、Android）及后端（Node.JS、PHP、Java）AB测试服务的专业Saas平台

Optimizely：是网上现有的最专业的AB测试工具之一，它的价格要比其他的工具高很多（也可以免费使用一个月），它提供了一些非常好的功能。

Unbounce：对于登录页面的测试来讲非常不错，而且它不仅仅是个测试工具，还可以在无需自己编写任何代码的情况下来创建登录页面。

如何做A/Btest

1、确定目标，例如提高网站的付费转化率，降低跳出率等

2、测试方案，建立假设：购买按钮的颜色会影响点击率？缩短流程可以提高复费率？改变导航可以降低跳出率等？

3、创建相比较的两个版本，改变其中的变量

4、发布测试，将部分流量导向B方案，但不一定是5：5

5、数据分析，收集数据，对比AB版本的转化率、跳出率、留存率等

感谢阅读！

文章来源：站酷   作者：_微光
分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

这一篇，我们来探讨下交互设计的善意。

善良常常被用来形容人，偶尔被用来形容产品，很少被用来形容交互设计。

就像人们会说，iPhone 有人文关怀，而很少会说，iPhone 的交互设计有人文关怀。在笔者看来，原因之一，是交互设计很难将人文关怀囊括完，而产品本身则基本可以。

类似的道理，本文探讨的善意，始于交互设计，但不局限于交互设计，还包括产品和企业的善意。

一家之言，欢迎交流探讨。

01 为什么选择善意？

一个 3 岁小孩流落街头，无家可归，会让无数人起恻隐之心。我们普通人的微小善意，有时可能是一种本能反应，或者说是一种感性反应。

“他内心是有时邪恶，还是对人们始终良善”，这是李宇春《年轻气盛》里的一句歌词。

恶是否为本能，笔者不知道。科学家的解释是，有些基因中会带有恶。可以肯定的是，善恶皆为人性，共存于人类当中。

感性和理性是会此消彼长的，林黛玉和薛宝钗就是两个极致的例子。同理，人类体内的善恶，也会此消彼长。

一款产品，在做决策时，很大程度上是基于理性。

这种理性决策，很多时候是无意为善，也无意为恶。但遗憾的是，那个非善非恶的中间地带不会一直存在，有些无意为善和无意为恶，最终会成为非善即恶，比如开屏页是否放广告这件小事（下文有详述）。

既然善恶会此消彼长，而且产品的有些理性决策会导致非善即恶，那么不可避免的，有时候，善恶会变成一道二选一的选择题。

接下来，我们就从理性的角度探讨下，为什么选择善意。

1 长期主义

最近几年，互联网从业者有个共识：创业是件九死一生的事儿。因为据数据统计，90% 的创业公司活不过三年。

这是一个值得深思的社会现象，背后的原因究竟是什么？直接原因，往往是资金断裂。深层原因，会有很多，比如产品不够好、方向不够准，等等。

那么，核心原因呢？笔者认为，和创始人的执念有关。

有两类执念可以避免此类悲剧。第一类是做出优秀产品；第二类是长期主义。

做出优秀产品这块，有很多例子，最典型之一是特斯拉。特斯拉曾面临多次危机（资金、产能等），但都挺过来了，这肯定和产品深受车主喜爱有关。

笔者也见过两个普通创业公司的例子。他们都有一颗做出好产品的心，都很重视 UI、交互、用户体验这些基础的东西，而且把 UI 做的比较优秀，交互和用户体验做的还不错。其中一家靠着用户的付费在平稳发展，另一家连产品带团队被大厂收购了。

长期主义这块，典型例子之一是巴菲特。巴菲特信仰并践行价值投资，价值投资依赖长期主义。最近几年，长期主义在国内也被越来越多的提及。

个人的理解，长期主义至少包含两个要点，分别是：积累、多赢。因为，没有积累就不会有成就，没有多赢成就就不会长久。

中国女排，世界冠军。排球界有个说法，叫三年成型，五年成才，八年成器。互联网行业，也大致如此。这是积累。

用户，员工，投资人，三方利益都兼顾好，才是多赢。

俗话说，顾客是上帝，大家都知道对用户好；投资人作为强势一方，利益也往往有保障；员工的利益是否有保障，往往取决于创始人，所以存在很大变数。

回到主题，长期主义和善意，有什么关系？

通常而言，多赢能否实现，关键在于员工的利益能否得到保障。

笔者在网上看过一个有意思的评论，说当下的年轻人，如果收入、成就感、高兴这三点有两点达不到，就会辞职。

所以，员工利益得到保障的标准，可以简单定义为“三中二“，即收入、成就感和愉悦这三点满足两点。

再来分析一下现状：相比员工，公司是强势一方；人们仍受最大程度剥削剩余价值、官僚思想等观念影响；恶性加班等风气存在；僧多粥少的就业行情。

在这样的大环境下，如果公司对员工没有爱和善意，员工的利益是很难得到保障的。

最后，总结一下：公司有善意，员工利益就有保障，就能实现多赢，从而有望实现长期主义。

2 美好生活

前段时间，因为给武汉捐款 5000 万、并且疫情期间蔬菜按成本价销售，一些网友被胖东来这个商超刷屏了。

胖东来来自河南许昌，一个三四线城市，也是笔者的家乡。目前仅在许昌和新乡有店。

在一些关于胖东来文章的评论区，很多网友在喊胖东来去自己的城市开店。

为什么有这么多呼声？简单分享几个例子。

顾客方面，胖东来有 6 类购物车，包含婴儿手推车、儿童购物车和老年人购物车。老年人购物车自带凳子，可供休息，同时还配有放大镜。

员工方面，有高薪、高福利和利润分红等。胖东来比较为业界称道的高福利有：每周二闭店，春节闭店 5 天，工龄满 1 年即有 30 天带薪年假，一天最多工作 7 个小时。

从网上的报道、评论以及公布于网上的企业文化来看，胖东来一方面主张工作和生活（爱情、家庭、休假等）的平衡，一方面在践行和传播幸福、快乐、尊重等很多积极的文化价值观。

看新闻的时候，笔者注意到，老板于东来经常会提到“美好”这个词儿。实际上，在笔者看来，胖东来本身就代表了一种美好生活，一种物质和精神双丰盛的美好生活。

对于这样的美好生活，用户和员工自然喜欢。可这对企业有什么好处？

胖东来曾经意欲退出新乡市场，新乡合作商家和市民纷纷请愿，政府也多次出面挽留，最终胖东来留下来了。可见，胖东来在新乡已经深入人心，顾客自然会大力支持它的发展。

胖东来有一句 slogon，能够很好的解释这一切，那就是：爱在胖东来。

同样，既提供体面的收入，又关注员工和用户的精神需求，给他们带去美好生活，当然需要更大更多的善意。

在当下中国，能提供高薪的互联网公司已经很多了，但是能在精神层面让员工感觉良好、感觉愉悦、感觉幸福和快乐的公司却为数不多。

对于所有企业而言，这又何尝不是一种机会？

02 交互设计里，有哪些善意？

现实中，像胖东来给顾客和员工提供的这种美好生活不常有。但是退一步讲，还是有很多产品对用户展现了很多微小善意，值得我们学习。

这种微小善意主要有三类，分别是：不打扰，护尊严，人为先。

1 不打扰

我们生活在一个信息爆炸的时代，不被手机上的信息过度打扰，是一个刚需。有三类信息，如果把握不好度，就会对用户形成打扰。它们分别是：广告、推送、推荐。

广告这块，主要有两类会形成打扰，分别是：时机不佳的广告，过长的广告。

这方面，微信是个榜样，值得学习。比如开屏页广告，就是时机不佳的广告，因为大家不想在这里看到广告，微信就没有放。朋友圈里也有较长的视频广告，微信的常见做法有两类，要么先展示一张图片，要么先是无声播放。是否看完整的视频广告，选择权在用户手里。

推送这块，常见的有手机系统的通知和 App 内的红点消息。

系统通知，目前也有被滥用的趋势。根据使用情况和感受，个人的建议是这类推送控制在 1-2 类。第 1 类是关于核心功能，比如微信推送新消息，搜狐新闻推送新闻；第 2 类可保留一定的弹性，核心原则是对用户有价值，比如偶尔的活动通知。

目前有两种情况会对用户形成打扰和困扰，第一种是过于频繁的活动通知；第二种是推送和核心功能相差甚远的信息，比如金融类产品推送新闻。

红点消息，有一类会对用户形成打扰，那就是来自官方的过于频繁的各类活动、促销等信息。

推荐这块，主要指 App 内的 Banner 和专题。目前对用户形成打扰的主要是一级频道的一些专题。

一种是过多，比如网易云音乐的首页，就有 9 个专题；一种是位置不佳，比如 Keep 的“探索”频道就包含了课程的推荐，但是在“运动”频道还有两个专题来推荐课程。

2 护尊严

护尊严，就是尽最大可能，维护用户的形象和尊严。

最近几年，常有产品花巨资撒红包给用户抢。产品的初衷自然是好的，而且看起来也是一件皆大欢喜的事情。但是这件事很难提升产品的美誉度，也就无法增加用户对它的喜爱和忠诚程度。

为什么会这样？

让用户抢自己撒的红包，这件事能维护用户的形象和尊严吗？非但不能，可能还会对此造成伤害。因为可能会显得用户爱占小便宜，也可能会使用户处于被施舍的一方。总之这种事对用户来说，并不酷。

一款产品，要想赢得用户更多的喜欢、尊敬乃至忠诚，就最好不做哪怕仅是微弱伤害用户形象和尊严的事情，同时多做一些相反的事情。

3 人为先

人为先，是当用户利益和企业利益发生尖锐矛盾时，去追求一种用户利益在先的双赢局面。

大家都知道，吸烟是有害健康的，但是烟草公司又是要赚钱的。泰国香烟那种既触目惊心又恶心吓人的包装，就尽他们最大的可能诠释了“吸烟有害健康”，是真正的用户为本，让人心生敬意。

泰国香烟的这种做法，值得一些极易让人上瘾的游戏厂商借鉴和学习。

03 交互设计：如何做到善意？

上一大段，是善意的三类表现。这一大段，再探讨下做到善意的一个原则。

以社区型内容型产品为例，这个原则就是：先服务后管理。

这里的服务，是指以服务者的心态做好用户体验，并不局限于交互设计。这里的管理，指的是一些必要的管理，一般是用户的行为规范和用户违规时的处理，比如评论里骂脏话、发布侵权文章等。

所有用户都是需要被服务的，只有少数行为不当的用户才是需要被管理的，所以我们要先服务后管理，以免误伤了不需要被管理的用户。

服务本身就是一种善意，笔者把它分成了两个阶段，分别是：体验的初始阶段，体验的完整过程。

初始阶段对应的是：初始服务；完整过程对应两类服务，分别是：家常服务，极致服务。

1 初始服务

初始服务，是当用户刚开始用这款产品时，能给他们留下良好印象的服务。

如何做到？不出现任何轻微恶意和管理倾向即可，再提供一些便利和帮助则更好。

下面分享一个反面例子。

在个别城镇的卫生死角，有时会看到这样的标语，“此处禁止倒垃圾！违者罚款 200！“。结果那个地方往往有很多垃圾。

为什么会这样？

这个标语，有两层意思：第一，你很可能会在这里倒垃圾；第二，禁止你这么做，做了要罚钱。

也就是说，某种程度上，这个标语在用恶意揣度别人，同时也在很严的管理别人。

看到这个标语的人很可能会这样想：既然认为我会在这倒垃圾，那我索性就倒了；禁止我？凭什么？还罚我钱，吓唬谁呢，况且你有证据吗？

下面再分享一个很好的正面例子。

笔者有一个宜家的退货经历。把一个已经拆过的桌子打包送到了宜家，宜家没有检查里面的零配件（很多螺丝之类的），直接退了。这样宽松的退货条件，宜家可能会蒙受一定损失，比如小概率的零件丢失，但宜家还是把这种服务提供给了顾客。笔者当时的感受是宜家挺信任我们的，对宜家就多了几分好感。

2 家常服务

家常服务，是指一种稀松平常，但又让用户感到舒服自在的服务。

举个例子，你去好朋友家里玩，朋友给你倒了一杯水，并端出一盘削好切好的苹果，你们一边吃一边聊。你和朋友是平等的关系，他这种简单的招待并不会使你感动，但却使你有一种接近在自己家的那种舒服自在。

笔者在用微信公众号（后台）时会有这种感受。在星巴克和肯德基时也会有类似感受。

家常服务，如何实现？第一，要有良好的初始服务，这是基础；第二，要有周到且较高品质的交互设计，这是关键。

以微信公众号为例，和微信一样，它的交互设计也做到了周到和较高品质。下面看看微信公众号的初始服务。

面向大众的资讯平台大多都有一个发文规范，多是关于禁止的行为，通常都会用一个单独网页来展示，有 1-2 页纸那么多。

通常情况下，多数作者是不会违反发文规范的。对于这部分作者，当他们首次看到 1-2 页密密麻麻的发文规范时，可能会产生抵触心理，即便自己不会违规。就好像高中开学第一天，班主任二话没说，直接就立了 20 条班规，同学们会是什么心情。

微信公众号的做法就很巧妙，它把这些规范分割成了三部分。

第一部分是严禁的红线行为，以高度概括的一行文字呈现，所有人都能看到，但是得仔细留意才能注意到。这是规范性质。

第二部分和竞品一样，也是链接出来的一个单独网页。链接入口也和竞品一样，在关联性最强的发文页面右上角。不同的是，这一页展示的是规则，主要以问答的形式呈现，给人感觉是有帮助的信息。这是服务性质。

而竞品的这个页面，通常都是禁三禁四的规范，给人的感觉可能是紧张、压抑甚至抵触。

第三部分是次于红线的禁止行为，比如侵权、低俗内容等。这部分内容的管理办法被以公告的形式分散在公告列表里。而且公告列表里内容多样，还有很多一般的通知，所以这个公告列表也不会像竞品的那一页规范一样，给人紧张、压抑的感觉。性质上是中性。

另外，这部分的入口在后台首页右上角，和发文模块是分开的。所以不会违法规范的作者一般不会去公告列表里翻这些内容，也就看不到。

微信公众号就是这么巧妙的让多数作者看不到“班主任”的“20 条班规”，同时还让他们看到了“班主任”的“常见问题回答”。

这就是微信公众号在发文规范方面的初始服务。另外还有一个加分的细节，就是检测疑似错别字的功能，很贴心，虽然目前还不是很准。

3 极致服务

极致服务，是指让用户感动的服务，比如海底捞和胖东来的服务。

这种服务，一般是由许多细节积累而来，是一种做加法的服务，而且背后往往依赖人力。

好的交互设计，一般都是在做减法，而且纯粹是界面、机器在和用户打交道。所以极致服务难以复制到交互设计上。

不过，一款互联网产品，除了交互设计，还有其它方面的内容。

B 站就是一个例子，它以不走寻常路的方式，在两个方面做到了较为极致的服务。那就是：视频无广告，比较积极、欢乐的弹幕氛围。

结语

以用户利益为先，不打扰用户，维护用户的尊严，这是交互设计里的三种善意，值得我们学习。

先服务后管理。服务作为一种善意，也能够引来用户的善意，最终形成良性循环。

杜绝任何轻微恶意和管理倾向，再提供一些便利和帮助，便能做到良好的初始服务；

在初始服务的基础上，提供周到、高品质的交互设计，就能做到良好的家常服务；

交互设计难以做到极致服务，但是其它方面有机会。

最后，用刘备的一句话来结束本文。

勿以善小而不为。

文章来源：站酷   作者：SnowDesign

分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

一、好的收藏体验该怎么做？

用户喜欢在网上收藏各种东西，把收藏到的东西占为己有，满足自我的占有欲，每个用户都为此而乐此不疲。

很多互联网产品在用户点击收藏后，让用户去选择收藏夹。其实用户并不喜欢去选择，他们只想简单的把自己喜欢的东西收藏下来。

选择本身并不是一件很容易的事情，尤其是对于那些有选择困难症的人来说。实际上，我每次都是选默认那个。

这并不是一个好的用户体验。

微信收藏润物细无声

当然也有一些做的很好的体验，比如微信的收藏，收藏后会出现一个“收藏成功”的非模态反馈。

同时可以添加标签，但这个并非强制，为了满足那些有这种需求的用户。添加标签的目的是为了方便用户在日后的检索。

在收藏列表，微信会根据收藏的内容自动分成链接、文件、图片和视频等，最近使用位于第一位。

也就是说并不需要用户去创建自定义分类。

你也可以搜索标签来找到之前收藏的内容。通过这些方式基本上满足了大部分用户的需求。

拼趣（pinterest）智能识别收藏夹

网站会根据你采集的图片在极短的时间内，自动识别出图片对应的收藏夹类型。可以直接采集到对应的文件夹。

然而经过测试，经常会出现误差。因为图片的分类其实很复杂的，属于高度自定义，很显然，智能识别并不是一个好的解决方案。

花瓣的快速采集

花瓣是一个设计师收集灵感的网站，该网站常见的用户使用场景是，设计师在浏览素材时，会大量采集自己感兴趣的素材，但每次都要选择文件夹，非常繁琐且低效。

后来花瓣网加入了快速采集的功能，其逻辑是网站会默认选择上一次采集的收藏夹，这大大提高了用户采集图片的效率。

而如果你需要选择其他文件夹则可点击普通采集。这两种采集方式满足了设计师的不同需求。

二、互动信息的隐私保护

社区类产品有各种点赞，收藏等互动信息，但用户又不想被别人知道这些信息。

因此，在规划产品时需要考虑到用户互动隐私的保护，这是用户侧的刚性需求。

私密的点赞列表

抖音个人主页的点赞列表，我记得刚开始是公开的，且不能设置为私密。

用户点赞的视频会出现在这里，却少有人希望这些信息被别人看到，总有些点赞视频你并不想被别人看到。

如果点赞列表可见，那么用户在点赞的时候就会有所顾虑，这不利于平台的互动率。

特别是随着抖音上熟人也越来越多，强关系社交场景在渐渐加强。

抖音后来也发现了这个问题，把它设计成了默认隐藏。（当然可以自己设置为公开，但只有极少数用户会这样做。）

由于点赞是私密的，用户可以随心所欲的点赞自己喜欢的视频，毫无社交压力。

这是为何？

源于人性心理学：窥私欲。人人都喜欢窥视别人的隐私，而不喜欢自己的隐私被窥视。

不然为何如今的QQ空间基本上都设置了权限，毕竟，谁想被别人窥视当年那个煞笔的自己呢？

公众号“在看”和视频号“私密赞”的逻辑

现在订阅号打开率越来越低，朋友圈分享曾是订阅号流量来源的一大入口。

朋友圈早已沦为了一个人设打造的阵地，现在的人发圈越来越谨慎。

用户似乎越来越不愿意在朋友圈分享文章了，除非是有利于自己人设打造的内容。

为了减轻用户的这种社交压力，微信推出了“在看”的功能。

用户点了“在看”后，此文章会出现在看一看这个模块，且七天前的分享将不可见，这就相当于一个弱化版的分享功能。

这将大大减轻用户分享的社交压力。对于公众号主来说，相当于增加了一个流量入口，激发他们创作更多的内容。

视频号点赞也是同理，会被朋友看到，导致用户在点赞的时候就会有所顾虑。

他会考虑，我点赞了这个视频，我老师、上司、父母、亲戚、朋友会不会看到？他们会怎么想？

但他在抖音上点赞是没有这么多顾虑的，单纯的喜欢就行。

第一，抖音是弱关系平台；

第二，抖音上的点赞默认是私密的。

因此，微信才推出了私密赞的功能，需要长按才能触发。

这并是一个优雅的解决方案，一是操作成本有点高，二是用户存在较高的学习成本。

微信作为一个强关系社交场景，这正是微信与抖音不一样的地方。

以上两者的目的都是一致的，那就是为了减轻用户的社交压力。

三、确定按钮放左边还是右边？

同时用过mac OS和windows系统的用户不知是否发现，这两个操作系统的弹窗按钮“确定”和“取消”的位置是不一样的？

mac的弹窗按钮确定在右，取消在左；而windows的刚好反过来，确定在左，取消在右。

为什么会有这样的差异？哪一种更加合理？

模态反馈定义

在交互设计中，这种弹窗叫做模态反馈，艾伦·库珀在《About Face 4》中提到：模态模式一种临时模式，它通过遮罩将用户当前看到的内容和之前看到的内容区分开来，界面中只有 popup（弹出层）组件具有可交互行为，需要用户操作才能退出该模式。模态的优势在于让用户专注于完成某个任务而不被干扰。

哪个优先级更高

首先我们要明白这两个按钮哪个使用率更高，一般来说，“确定”的点击率要远远高于“取消”。这是因为大多数用户对于自己的操作行为是明确的。

所以这两个按钮在视觉上一定要做出差异化，“确定”的视觉层级要高于“取消”，这样用户才会一目了然，不会感到困惑。

两者背后的逻辑差异

回到刚才的问题，逆向思考这两者背后的逻辑差异。

windows弹窗的背后逻辑：

人的阅读习惯是从左到右，所以把点击率更高的按钮放在左边更加符合人的正常阅读习惯。

mac弹窗的背后逻辑：

根据一般的任务的流程，“取消”在左代表返回上一步操作，而“确定”在右代表进入下一步任务流程。

看上去似乎都有道理，这两种交互方式本身没有绝对的对与错。只要在整个系统中保持一致性，让用户形成操作习惯就没有啥问题。

从个人的使用习惯而言，个人更倾向于mac的这种方式。

四、手机的实体键怎么放才合理？

手机上的实体按键电源键和音量键通常有两种分布方式，放在左右两侧或都放在右侧，前者以iPhone为代表，后者以安卓手机为代表。

这两种方式有什么区别？哪种方式更加合理？电源键和音量键属于完全不同类型的两种按键，且都是高频使用，它们的功能自然不用赘述。

用户场景

我们先来看看都放在右侧会有什么问题，以下使用场景相信用户不会陌生：

用户a，在地铁上玩王者，声音有点大，想把声音调小，结果不小心按到了电源键，导致手机息屏，而此刻你正在激烈的团战，内心有一万只“草尼玛”奔腾而过……

用户b，每次按电源键（解锁或锁屏）都会不小心同时按到音量键，结果直接就截图了！这种情况发生了不止一次，因为这两个按键离的太近了……

用户c，自家的小米11，电源键位于中间位置，右手拿时大拇指会触碰到，左手拿时中指刚好会触碰到，而电源键又有指纹锁功能，导致手机在不断的解锁，而你毫无察觉……

通过上面的案例，可以得出结论：若按键都放在右侧，会导致用户经常误触而造成不必要的麻烦。

放在两侧就不会有这样的问题。可以有效防止误触，尤其是盲按，不用担心按错，减少误操作的几率。

电源键并非一开始位于右侧

值得一提的是，iPhone手机的电源键一开始是位于顶部位置，这是为何？

因为刚开始时手机都是小屏幕（3.5～4寸左右），对于iPhone5S及以前的手机来说，单手操控，拇指Home，食指电源，刚刚好。

所以电源键放在顶部既按得到又可以减少误操作。

后来随着手机大屏的趋势（4.7寸以上），这个时候单手已经不方便按到顶端了，从6代开始就把电源键放在右侧了。

但无论是哪种方式， 两个按键都是分开放。

按键不在中间的原因

还有一个小细节，iPhone的实体键不是在右侧正中间，而是在靠上的位置。

iPhone设计理念是单手持握，并且大多数人右手握手机，大拇指经常会碰到右侧边框，若果放中间，这样会造成误触音量键和静音键。

其实上面的案例3就已经说明了按键放在中间的弊端。

我想起了当年的锤子T1，左右按键一样大且位于两侧的中间，这是典型的为了追求完美的对称而向用户体验妥协。

iPhone从初代开始就已经建立了自己的设计理念，不管是工业设计还是界面设计，并沿用至今。

五、iPhone静音键有存在的必要么？

从初代开始，iPhone机身左侧音量键上方就有一个静音键。

这些年来，iPhone一直在减少各种实体按键以及外部接口，比如3.5mm耳机孔、home键。

但直到如今这个静音键却一直保留下来，为何iPhone对于这个按键情有独钟？

静音键开启后，任何来电或通知都是无声的，震动也会消失。

在无需点亮屏幕的情况下实现一键静音，方便快捷，深受用户的青睐。

哪些场景用户会开启呢？

根据自身的使用习惯以及用户研究，无非以下几种使用场景，比如看电影、开会、上课等：

1.进电影院看电影前，我一般都会拨一下，避免在看电影的过程中被来电铃声打扰，影响了自己和别人观影。

2.开会的时候也会拨一下，以防在开会的时候突然被来电铃声所打扰，避免不必要的尴尬。

3.学生党在上课前一般也会开启，这样整节课都不怕打电话进来了。

总之，就是不希望自己的手机铃声打扰到自己和别人，带来不必要的麻烦。

如果是虚拟静音键，需要先解锁手机，对着手机屏幕一顿操作。

而实体键不需要这么麻烦，可以盲操作，放在裤兜里都不影响操作。

安卓手机为何没有实体静音键？

这个按键这么重要，却很少看到安卓手机上有（除了一加基本上没有）。

实体静音键并非苹果首创，之前的Palm、Blackberry（黑莓）早已有这样的设计。

可能的原因是安卓控制中心很早有静音按钮，甚至有些定制系统还可以把静音按钮直接放在桌面上，设置静音非常方便，也就没必要再多加一个实体键了，显得多余又徒增成本。

一加三段式按键

上面提到过的，作为安卓阵营唯一的静音键，一加手机引以为傲的三段式按键，该设计可以通过物理键直接实现在静音、免打扰与正常模式当中快速切换。

但个人认为这个设定复杂了，三种模式远比两种模式复杂。用户并不一定能搞明白，有一定的学习成本。

iPhone设计静音实体键的初衷

在早期，iPhone的控制中心并没有静音按钮，想要设置个静音并不是一件容易的事情，而这个功能又是必须的，苹果索性直接做了一个实体物理键。

这样静音的时候只需要把静音键拨过来就可以了，一步到位，使用体验也很好，所以一直保留至今。

虽然现在iPhone的控制中心已经加入了勿扰模式，但考虑到老用户的使用习惯，以及品牌调性，苹果对于这个实体按键的去掉还是显得很谨慎。

考虑到之后iPhone在防水、机身内部空间的改进，不排除苹果终有一天会取消iPhone上这个静音键。

静音键的缺点

静音键虽好，但也并非没有缺点。用户有时候会无意中触发这个按键而不自知，或者开启后忘记关闭，导致错过了一些重要的电话。

静音并非绝对

虽然开启了静音键，但并不是绝对的静音。如果是闹钟，铃声还是会响起，因为闹钟的优先级要远高于静音模式。

苹果这是考虑到了如果有用户不小心触发了静音键，或者开启后忘记了关闭，害怕用户耽误了重要事情。

这就很好的解释了为何明明开启了静音模式，却还可以调解音量大小的原因所在。细微之处方见真功夫。

六、经典的旋钮式交互

在日常生活中，旋钮是个很常见的东西，比如音箱，微波炉，收音机，老式电视，车载旋钮……

在机械产品上，旋钮凸起的把手和它下面的圆盘刻度，是最明显不过的旋转暗示，符合人的自然感知。

旋钮式交互是个人非常偏爱的一种交互方式，我认为这种交互跟iPhone的home键一样经典，主要原因有三：

1.操作简单

旋钮操作简单，看到这种按钮，一岁小孩子都会忍不住用手去抓。对于用户来说，几乎不需要学习成本。

2.尽在掌控

在旋转的过程中，可调大调小，一切尽在用户的掌控之中，用户感觉到有十分的安全感。

3.即时反馈

在调节的过程中，调大调小都能立刻收到即时的反馈，这是用户最喜欢的交互方式。

我们在触摸屏上很少看到这种旋钮式交互，因为这种交互是要建立在抓住旋钮实物的感受。

而触控屏是个二维的世界，没有真实抓握的手感，无法还原出三维世界的真实手感。

汽车上最常见的旋钮就要数音量和空调了。然而自从特斯拉在车上推广大屏幕后，越来越多的国内厂家开始盲目跟风，把绝大部分的功能按钮集成到屏幕中，比如空调，不仅不方便，行车中使用还容易造成危险驾驶。

车上的触控体验跟手机上是完全是两码事，使用场景也完全不同。最大的区别在于后者没有安全问题。

都知道开车不玩手机，可是行车时操作中控屏跟玩手机有什么两样？

车载旋钮有什么优势？

1.驾驶更加安全

对于驾驶员来说更加安全，通过旋钮调节空调，熟悉后完全可以实现盲操，边开车边操作毫无压力。

如果是触控屏，你必须看着屏幕，一顿操作猛如虎，而在开车过程中眼睛哪怕离开前方一秒钟就意味着危险。

而安全是汽车驾驶的重中之重。

2.更加真实的反馈

用户的操作有真实的物理反馈，旋钮阻尼。

屏幕上虚拟按键反馈根本无法与实体旋钮相提并论。

3.更加稳定的机械结构

软件系统用久了会变卡，可能会死机，难免会有bug。而这些不稳定因素将成为汽车驾驶的潜在危险因素。

一旦屏幕失灵，或者系统死机了，那所有按键都失效了。

虽然特斯拉为了提升其车载系统的稳定性下了很大功夫，但是问题从来都没有停止过。

但是硬件基本上很少会出问题，物理旋钮才让人100%放心。

无论厂家如何吹嘘，虚拟屏幕按键在大多数情况下都不会比实体按键有更好的使用体验。

因此，有一些实体键出于安全驾驶的考虑还是应该保留，将各种功能按钮都集成在屏幕里并不见得是一个明智的选择。盲目的把实体按键变为触摸按键存在安全隐患。
文章来源：站酷   作者：CdzhcHappy

分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

目录

1.百度网盘 ：会员标识

2.当当：搜索记录隐藏

3.当当：分享动效 ➕ 一键制作朋友圈分享海报

4.抖音：点击复制 ID

5.飞书：效率工作—语言自动转化

6.美团：优惠卷新到提示

7.墨迹天气：一键登录（大部分应用已上线该功能，部分应用仍未上线）

8.起点读书：长按可进行互动

9.腾讯视频：亮度调节的动效设计

10.微博：点赞动效设计

11.知乎：删除搜索记录

12. QQ：可隐藏会话

13. QQ 音乐：搜索入口的听歌识曲

14. QQ 阅读：长按复制的放大设计

一、百度网盘：会员标识别

在开通会员后百度网盘会进行对于应用图标的更换，使得应用图标更加高级，在分享链接时也会加入会员分享的标识。

属于用户激励体系中的一个板块，增强用户的标识和身份。

二、当当搜索记录隐藏

搜索隐藏功能设定。

我们在使用各大应该的搜索功能时总会遇到过这样的场景，当你要某人或者在某种场景下需要进行搜索时，来不及删除自己的搜索记录出现社死的情况。

而当当的搜索隐藏就可以完美的解决这个问题，退一步讲我们可以思考一下为什么别的成熟型应用，没有采用这样的方式。大部分是没有这个功能，其余则是在搜索这一个功能上已经添加了其余用户体验的设计。所以在这一块就没法加入这个设计。

三、当当：分享动效 ➕ 一键制作朋友圈分享海报

在当当应用中点击分享进入页面后不同于传统的分享页面，而是把分享到微信和分享到朋友圈进行了动态设计。并且在分享到朋友圈的右上角加上了海报的标识。我们点击会自动跳转生成海报。

这样的设计可以更加吸引用户的眼球并且自动生成海报可以激发用户在朋友圈转发的次数。

动效展示

四、抖音：点击复制 ID

主页 ID 点击可进行复制  很多应用都有 ID 。但是当我们要进行 ID 搜索的时候，我们便需要一遍一遍的反复查看或者记住这个 ID 然后再进行搜索。

目前部分的应用也上线了类似的功能,让用户点击 ID 区域可进行复制。对于用户体验的提升有着很显著的效果。

五、飞书：效率工作语言自动转化

飞书属于一款协同办公类的应用

在飞书的设置用有语音直接转换文字的说明，飞书本身便是一款协同办公类的产品。此产品效率便是产品关键词之一，所以加入这样的设置可极大的提升用户的体验。

六、美团：优惠卷新到提示

有提示用户新到多少张优惠卷的提示

可以促进用户消费的同时能帮助和提醒用户去使用消费卷不仅提高了商家的销量还使得用户在消费中发现自己的优惠卷及时使用

七、墨迹天气：一键登录（大部分应用已上线该功能，部分应用仍然未上线）

一键登录

应用登陆中目前主流为（1.第三方登录，登陆之后需要再次绑定手机号。2.手机号注册登陆，登陆之后可选择是否绑定第三方。3.一键登录，登陆之后可以选择是否绑定第三方）在设计流程中，设计开发者需要尽可能的减少对流程的复杂化。

一键登录在为看来是最喜欢的一种登陆方式。导致现在如果需要各种注册绑定，除非必要的情况下，我会直接放弃这款应用。

八、起点读书：长按可以进行互动

长按页面可以框选当前的段落，并且出现互动选项。

 

增加用户和用户之间，用户和作者之间的互动。使得用户在读书的同时有着较强的参与感。

九、腾讯视频：亮度调节的动效设计

滑动可调节亮度

 

左边的小动效的设计加上右边的渐变进度条，使用户可以更加明确的知道自己所处于一个什么样的观看环境，并且加入了渐隐渐现的出场和入场。

 

用一个小巧的动效设计帮助用户确定自己的亮度属性，

动效展示

十、微博：点赞动效设计

点击点赞会出现彩色的波浪并且不断扩散的同时有小表情弹出。

增加趣味性和互动性。

动效展示

十一、知乎：删除搜索记录

清空时会在进行确认，再次点击全部删除方可删除。

在下方列表中可逐一删除，上面清空中不是点击后就全部清空。而是再次出现，起强调和确认的作用。

增加用户体验，帮助用户进行二次确认和防止用户误触。作为一款咨讯类应用用户的搜索记录也是比较重要的。

十二、QQ：可隐藏会话

前几天发现的一个神级功能（虽然我已经不用 QQ 进行社交了），当时我外甥和我讲述了这个功能他么00后戏称为养鱼神器。

在好友的设置中可隐藏会话，开启隐藏会话以后。此联系人发来的消息不会显示在联系人列表。需要自己手动去设置隐藏会话列表去寻找。

应用的功能更加多样化满足多种不同的需求。

十三、QQ 音乐：搜索入口的听歌识曲

在搜索入口加入了听歌识曲且进入界面后可进行听歌识曲和哼唱识别的切换

搜索歌曲界面的使用场景为：1.用户得知该歌曲的名称或者歌词进行搜索。2.用户听到了某一首很好听的歌曲想进行搜索。此时在场景二的情况下，正好可以进行听歌识曲。听歌识曲此功能在比较旧的版本属于主页中的一个模块，把听歌识曲放到搜索入口处更加符合用户场景。

对用户场景进行细致的研究，增加了用户体验。

十四、QQ 阅读：长按复制的放大设计

长按复制会有放大镜设计

当用户处于复制文案的场景下时，由于复制需要拖动，在拖动的过程中会按压住自己所处于的复制内容位置。所以在用户进行复制时加入放大镜的设计会使得用户清楚的明白自己复制到哪里，不需要后续用户在进行删减。

极大的加强了此场景下的用户体验

动效展示

文章来源：站酷    作者：张阳光Designer

分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

一、GUI和VUI的定义：

1.1GUI

GUI（Graphical UserInterface）图形界面，市面上最常见的交互方式。点触，滑动，作为主要输入方式。图像显示作为主要输出方式。

1.2VUI

VUI（Voice User Interface）语音界面，常见没有屏幕的智能音箱/耳机，靠语言输入和交流，如我们常见的小艾同学，天猫精灵等。

二、GUI和VUI的发展历程：

2.1GUI的发展历程

1973年第一个可视化操作的Alto电脑在施乐帕洛阿尔托研究中心（Xerox PARC）完成。Alto是第一个把计算机所有元素结合到一起的图形界面操作系统。它使用3键鼠标、位运算显示器、图形窗口、以太网络连接。

1981年施乐公司推出了Alto的继承者Star，Alto曾首次使用了窗口设计。

1983年苹果电脑公司推出Apple Lisa个人电脑，是全球第一款搭载图形用户界面（GUI）的个人电脑。

1984年苹果电脑公司推出Macintosh。

1986年首款用于Unix的窗口系统X Window System发布。

1988年IBM发布OS/2 1.10标准版演示管理器（Presentation Manager），这是第一种支持Intel计算机的稳定的图形界面。

1992年微软公司发布Windows 3.1，增加了多媒体支持。

1995年微软的Windows 95发布，其窗口操作系统的外观基本定型。

1996年微软发布Microsoft Bob，此软件具有动画助手和有趣的图片。

1996年IBM发布OS/2 Warp 4，它的交互界面得到显著改善，至今仍有不少ATM机运行这样的系统。

1997年KDE和GNOME两大开源桌面项目启动。

1997年苹果电脑公司发布Mac OS 8，这个系统具有三维外观并提供了SpringLoaded Folder功能。

2000年苹果电脑公司推出Mac OS X系统的默认外观Aqua。

2001年微软发布Windows XP，实现了主题支持。

2003年Mac OS X v10.3提供了一键单击访问任何已打开窗口的功能。

2003年Sun公司的Java桌面系统为GNOME桌面添加了和Mac类似的效果。

2006年微软发布Windows Vista，对此前其视窗操作系统的外观作了较大的修改，实现了Aero功能。

2.2VUI的发展历程

20世纪90年代，诞生了第一个可行的、非特定的（每个人都可以对他说话）的语音识别系统，交互式语音应答（Interactive Voice Response，IVR）系统的出现代表了VUI的第一个重要时期。人通过电话线路进行交互并执行任务，如机票预订、银行转帐、业务查询等。

目前很多像siri、Google这类集成了视觉和语音信息的APP，以及Amazon Echo这类纯语音的设计产品，逐步发展并成为主流。随着语音识别技术、AI技术、互联网技术的发展，我们已经可以在手机设备中用语音处理很多事情，但还有很多事情目前无法通过语音完成，需要我们探索。

三、GUI和VUI的设计要领：

3.1GUI

        交互的多样性：

不同于PC机通过鼠标来点击，在触控设备上通过手指点按，由于手指的精确度相对于鼠标指针差很多，所以子啊移动页面设计当中的交互元素一定得辨识作用，手机并没有悬停操作所以图标如果特征不明显时一定要加文字识别，设计时也应注意图标和菜单元素的尺寸。

拖拽和移动是很相似的交互工作，被拖拽的元素始终跟随着紧贴屏幕的指尖

除了使用单指之外，还可以用两个手指放大，缩小图片，如果设计了一些新的多指交互一定要给用户提示和指导。

3.2VUI

3.3VUI的适用场景

智能家居

在智能家居领域VUI应用越来越广泛，相信在不久的将来我们一定能够享受到更多的VUI所带给我们的便利。

辅助驾驶

车载语音交互系统使得我们可以在开车的同时接听电话、听广播等。

企业应用

未来大型企业中将会多领域应用VUI，用于书写、记录等工作。

医疗教育

智能记录病例、管理病例的出入。

四、VUI的语言设计注意事项

过多的声音干扰，不但会增加用户的心智负担，将会引起用户感到厌烦，尤其是，语音在资讯的负荷量上又比单纯的声音来的更多，考量是否存在存在的必要性就放在格外重要。而言，可以寻找替代的方式，透过震动和灯光甚至状态变化来提示，减少使用者的认知负荷，并确保声音只会在特定的时间点出现，并提供使用者自行设定关闭声音的功能

除了声音本身的设计外，还要考虑整体环境的影响因素，可能周遭受非常的吵杂。换句话说，在KTV的包厢，吵杂的环境，会使用者无法听到消防警铃响，而容易造成危险事件的产生。也因为如此，消防警铃的声音频率设计就应该介于2kM到4kM，因为研究指出人类的耳朵对于这个范围的声音最敏感

从音量的角度来看，耳朵对不同频率的音量有不同的感知程度，有些声音听起来很响亮，有些则是很沉闷因人而异，但比较客观的量化体验指标就是分贝（decibel，dB） ，在尺度上超过70分贝以上，会让人产生忧虑不安，并引发各种症状，因此要尽量避免尺寸大小过大的设计， ，，降低主动的侵入性。基于这些因素总和来说，还要考量到用户和产品间的距离，与产品愈近，对于体积的需求量较大，反之为然

在声音体验设计（Amber Case，2018）一书指出，当警告或提示音出现的频率愈高，就应该设计成愈短，但不足就是，如果把声音设计成短而急促，从而使用者需要集中相反地，事件发生时间间隔长且久，则声音提示更需要明显且激烈的声音来提醒用户，例如手机铃声响时，需要告知用户

文章来源：站酷    作者：张阳光Designer

分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

先举个例子来理解一下：我要点击手机上的确认按钮所需要的时间，和 手与按钮的距离（D）   按钮的大小（S）有关。  当距离越长，所需要的时间越长。当按钮越大，所需要的时间越短。

自我理解：我们将日常看到的界面元素进行去色彩和去信息化，把这些控件/元素等都变成灰色色块，其实也就变成了最简单的原型图。这些灰色色块抛开了视觉上的属性，其实有两大最基本的属性，即色块的位置和大小。  菲兹定律告诉我们，要通过控制色块或者说界面元素的    大小和位置（绝对距离和相对距离）   来进行界面布局，进而控制交互时间，达到我们设计或者业务层面的目的。

     

a  合理的自身大小

这里是说合理的大小。一般来讲越大用户越容易到达，但是屏幕的大小是一定的，某一按钮/目标越大就会降低其他按钮/目标的大小。所以大小是相对制衡的，要根据具体情景和需求制定合理的大小（包括肉眼大小和实际热区大小）。但是关于手指点击的最小热区有规定是44x44px，一般的图形的热区大小都要高于这个大小，才能便于点击。其他大小要根据功能需求进行制定。

b 控制合理的相对距离

相对距离指的是界面内部各个元素与控件之间的距离。一般通过研究 整个流程 的交互动作，相互关联的操作元素/操作手势 距离会相对比较近，这样能有效减少操作的时间。

c 特殊的绝对位置：屏幕边界

屏幕边界是可以确定的（鼠标向某一方向一直移动终会停留在屏幕边界），但是屏幕中央确是较难确定的（四个方向鼠标均能延展出去）。一些重要和主要的操作放在屏幕的边界，可以方便用户快速到达，也是菲茨定律的普遍应用。

d  反向设计：增加时间来达成业务目标

业务目标有时候是与用户目的是相违背的，也需要根据具体场景来判断菲茨定律的使用走向。在特殊情境下也会通过距离和自身大小来反向增加使用时间来完成目的。

自我理解：席克定律也在研究交互时间。我们需要通过控制席克定律所总结的两大因素：数目和复杂程度 进而去左右界面布局的形式，从而缩短交互时间，达成良好的体验。

a 精简选择的余地

选择增加也就意味着事情可以发展的方向更加多元化，用户就需要权衡事情该往哪个方向发展，而这就需要时间。不要让你的用户思考太多，所以一般给出的选项在满足需求的情况下要尽可能的少。（这里注意：一般情况下要少但也不能太少，强迫用户也是不可取。）

b  减少事情的复杂程度

事情越复杂，越难处理。尽可能的将复杂的事件通过交互或者版式等手段进行简化，让用户觉得容易把握，而不是大量事物/流程/元素的堆砌。

自我理解：米勒定律对人的记忆数目进行了定量的研究，即 5-9 个是人脑接受起来比较合适的，多了就容易混乱。

a 控制选项的数量

同一类型或者同一层级的元素出现，数目一般控制在5-9个。

b 将多信息进行分段处理，便于理解记忆

面对有大量信息的时候（数字/文字/段落）将其分割到5-9个等大脑容易记住的数量。

c 顺应时代的取舍

看到了有一些设计并没有按照米勒定律去执行，因为随着时代的发展，有一些定律并不是万能适用的。定律不可照搬，要根据具体情境去做取舍，以最终效果为导向。

自我理解：和四大基本原则的亲密性原则类似，即在界面布局的时候性质相同的事物要相接近，不相同的要远离，这样更符合人们的既定认知。

a 将相近的功能的分为一组

在面临很多复杂功能时，简单的堆砌显得啰嗦，需求又不能随意删减。这时候就可以将相类似的功能放在同一个组别里面进行收纳整理，这与席克定律也相接近。

b 按照事物性质和关联程度严格把握布局的间距

这里与视觉设计也有很多重叠，即落实到页面的高保真的细节。保证内容想接近的元素间距要小，内容有区分的间距要大。

自我理解：任何事物都有其复杂性，不可避免。某些事物一旦失去其复杂性，其作用本质就可能失去效果。不要抱怨某些流程和工作，他们的复杂性是其发挥作用所必然带来的。所以才需要你来优化和简化。

a 把复杂性降到最低点

事物的复杂性是固定，但是要思考你所面对的是最简程度的复杂性么。首先优化内部系统的整个流程和不必要的步骤能够有效降低系统本身的复杂性。

b 把复杂性进行转移 组合 隐藏

再把复杂性降低到最低程度之后，事物/流程仍然表现出一定复杂性时。就要考虑造成复杂的元素是什么，是否要将造成复杂的元素进行收纳组合，甚至隐藏。

自我理解：在相同前提下我们选择最简单有效的。单纯的炫技是可耻的。

a 给用户清晰的引导

想清楚这张界面的主要目的是什么，顺着这个目标去引导用户，其他元素的视觉层级要让步，来让用户抓住重点。

b 少即是多

少代表流程/步骤/界面元素的减少，多意味着用户量的增加 体验感的增强。

c 衡量产品功能的取舍

产品在功能迭代改版上，会出现大量不同的声音和方向。但功能不是越多越好，用户的时间是确定的，在某一功能上消耗的时间长，在其他功能上就短了。奥卡姆剃刀就要求我们找到主功能点，其他功能点要做出让步妥协甚至砍掉。

自我理解：关于防错定律和我的上一篇文章入门（一）的放错和容错原则基本近似，只是分类的更细致一些，分解到了操作的前中后阶段来防止错误。上一篇有更多解释。

a  操作前  禁止操作或者预告结果

有一些功能在你操作之前就禁止操作，避免了错误的发生。或者通过告知操作之后会产生的不良后果

b 操作中 提醒用户

在操作过程中，进行错误提醒，有效避免错误的进行

c 操作后给用户弥补错误的机会

用户在使用app的过程进入错误的路线，需要给用户弥补的机会

自我理解：这一点主要体现在产品设计上，通过对未完成任务的提醒，来去博得用户的注意力，进而达到商业目的。

a 倒计时/读条等交互反馈

倒计时会给人一种紧促感，逼迫用户去注意，无形之中给用户规定了任务，这个任务也就是咋们的业务目标。倒计时 读条等交互方式也应该谨慎恰当使用，因为不是每一个任务场景都需要给用户紧迫感。

b 定向反馈提醒

这一点也是利用未完成任务的相关信息反馈达到让用户去完成任务的业务目的。

自我理解：在上一篇一致性原则里面讲到了和竞品保持一致/和迭代版本保持一致，其实是我拓展的。这一定律是明确指出了一致的根本原因。在产品设计的时候，用户的心理就是我希望你的使用方式/操作和主流一致，超出预期的就会有人群不接受，就会有用户流失。

a 能不创新就不创新

创新意味着改变，改变的不仅仅是你的界面还有用户习惯和长久以来的认知模型。破坏习惯重建习惯是有很大风险的。

其实能看到很多Dribble页面很有特点，也不是完全没有落地性，但是实际国内产品并没有看到这样的设计，原因就是不符合雅各布定律。

b 好的的产品都是创新的 不同的

这一点好像和上一点有点相悖。但是其实也不违背，有很多分寸的拿捏往往不是理论能完全决定的。微信后来居上绝不是因为照搬qq，如果新的创新带来的优势能够弥补不相同所带来的不足，也是可以尝试的。

文章来源：站酷    作者：花城丶

分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

保持好奇，巧妙融合，追求卓越，自然而然

一家之言，未必全面，甚至未必正确。欢迎交流探讨。

01

交互设计的惊喜，是什么？

之前的文章，有简单定义过交互设计的“惊喜”，即为：超出用户预期，并让用户开心。

具体而言有两类，分别是：小惊喜、大惊喜。

1 小惊喜

所谓小惊喜，是指一些颇具趣味性或人文属性的交互设计小细节。

先说趣味性。常见的有两类，第一类是比较好玩的动效，第二类是一些小功能。第二类有时也会包含第一类。

动效这块，大家比较熟悉的，有 iPhone 上删除应用前图标的抖动，仿佛是吓的发抖，也可能是在摇头求饶；还有移动端登录 B 站、输入密码时，动画人物的捂眼捂脸动作。

(B 站登录页面)

小功能这块，也可以分成两类。一类是隐藏的小功能，一类是有趣的小功能。

很多隐藏功能，头几次用的时候，多少会有一些惊喜之感。

比如在订阅号消息列表页，某个公众号你已经几个月没看过，对它失去了兴趣和信任。这时，尝试长按这个公众号的头像或名称，会呼出一个包含“删除消息”和“取关”功能的弹窗。

(订阅号消息列表)

还有些隐藏功能，既能让用户觉得惊喜和方便，又能引发用户思考。这种思考，可能会让用户感叹设计之妙，也可能也会给用户一种猜对谜语的欣喜之感。

比如用墨刀的时候，尝试按数字键 1，会呼出“内置组件”这个使用频率非常高的功能，会让人觉得墨刀很聪明。

如果再仔细看一下，会发现，“内置组件”的缩略图标，和其他 4 个诸如“我的组件”、“图标”等功能的缩略图标，并成一列。这 5 个缩略图标的排列顺序（上到下），和它们快捷键（"、"键和数字键1、2、3、4）的排列顺序（左到右），是完全一致的。不得不说，这是一个简单又巧妙的设计。

再比如朋友圈里，某个不熟的好友每天都发集赞的小广告，搞的我们不胜其烦。长按其头像，会呼出设置权限（屏蔽等）的功能。

有意思的是，长按好友名字，则不会呼出这个功能。要知道点击头像或名字是都能进入好友主页的；另外刚才那个例子，长按公众号头像或名字，也都能呼出取关的弹窗。

个人的理解，生活中，我们用力长按一个人，通常是表达强烈不满，比如打架时。比起长按名字，长按头像更像是长按真人，所以也更能表达我们的不满。

说完隐藏的小功能，再说下有趣的小功能。比如微信聊天里的扔骰子、石头剪刀布，微信给朋友发生日快乐后漫天飘落的蛋糕，拍照软件里的贴纸，等等。

最后说下带有人文属性的交互设计小细节。常见的有如下类型：帮助弱势、关照情绪、表达情感、保护隐私。

帮助弱势这块，比如 iPhone 的辅助功能，里面有针对视力障碍的放大镜功能、有针对不识字群体的旁白功能。

关照情绪这块，很重要的一点，就是避免引起用户的负面情绪。比如微信的删好友是单方面删除，被删时我们很难察觉到，而且微信也不会通知我们。个人觉得，微信之所以不通知我们，其中一点，就是不给我们添堵。类似的还有，微信消息没有“已读”功能，这就大大减轻了接收者的回复压力。

表达情感这块，比较为人所知的例子，5 月 20 号这天，微信红包的限额，从 200 元升到了 520 元。还有一个例子，在微信聊天里发一个“ohh”，长按并点翻译，结果也是一个惊喜。

保护隐私这块，比如借助 iPhone 的“引导式访问”功能，可以让小朋友只能访问你的某个视频应用来看动画片。再比如别人用你电脑的时候，如果你不想让对方看到你的微信，就可以通过手机微信来锁定或退出电脑版微信。

2 大惊喜

所谓大惊喜，是指那些系统性大创新，并且能够引领潮流、代表未来的交互设计。通常而言，这些大惊喜，最开始给用户的感觉，就是酷。

iPhone 就是典型例子之一 。

2007 年的初代 iPhone，带来了当时的大屏幕：3.5 寸屏幕，以及纯触摸屏，和极为灵敏的触控体验。

2011 年，Siri 同 iPhone 4S 一起问世，为我们带来了语音交互。如今，在 100 元就能买到品牌类智能音响的情况下，依靠语音交互的智能音响也在慢慢走入寻常百姓家。

也许后乔布斯时代的 iPhone 创新不如以前，但不可否认的是，时至今日，iPhone 依然在引领潮流，在给我们大惊喜。比如这几年流行的手机无线充电和以 AirPods 为代表的极简的无线耳机。

以上是比较广为人知的交互设计，还有一些不太为人所知的设计。比如在家里网购一条床单，但是不知道床的尺寸，家里又没有尺子。这时，打开 iPhone 里的测距仪这款 App，就可以量出床的尺寸，会不会觉得有点酷。

(测距仪 App)

微信在引领潮流方面也有一些建树，比如极大的普及了二维码和扫一扫。小程序作为一种体验接近原生 App、同时又不用下载的产品，也正在引领新一轮的潮流。

还有一个比较酷的功能，就是以图搜图。笔者最早用过百度和谷歌的相关功能，主要是在电脑上搜索相似的图片，使用频率极低。

假设一个场景，比如在路上看到一个陌生人的外套很好看，但又不好意思上前问，就可以拿起手机，利用淘宝的拍立淘功能，拍张照就能马上看到相同或相似的商品。

如果淘宝上没有搜到类似商品，还可以用微信的扫一扫识物。和拍立淘相比，区别之处有两点。第一，不用拍，直接能识别，不过通常得等 1-3 秒；第二，识物结果里面，除了商品，可能还会有百科词条和资讯。

02

交互设计：如何做到惊喜？

个人觉得，有 4 个要点：既要有好奇心，又要有卓越心；既要天马行空，又要保持自然。

听起来可能有点乱，且听笔者一一道来。

1 保持好奇心

笔者观察身边读小学的小孩，发现，当大人聊天时，特别是谈正事时，小孩特别喜欢坐在旁边听，而且听的很认真。小孩有时也会说两句，或是问问题，或是发表自己的看法。

看得出来，小孩对成年人的世界，怀有极大的好奇心。实际上，不止于成年人的世界，小孩对周遭世界都有比较强烈的好奇心。

整体而言，成年人对周遭世界的好奇心，远不如小孩。我们互联网从业者也不例外。

好奇心和交互设计，有什么关系？

交互设计，某种程度上，也是一种创作。好的创作，一定来自生活。这就需要我们去观察生活。

观察生活，非常重要的一点，就是好奇心，对周遭人、事、物要有足够的好奇心。

比如上文提到的例子，在 iPhone 上删除应用前，应用图标会抖。这种抖是一种趣味隐喻，既可以理解成吓的发抖，也可以理解成摇头求生。如果对生活没有足够的好奇心，是很难留意到这种生活细节，并把它们作为一种隐喻运用到交互设计中的。

以上是关于好奇心，还有一种特质，也是在小孩身上表现突出，同时也和本文主题有关，那就是：童趣。

还是上文的例子，在 B 站 App 上输入登录密码时，动画人物会捂眼睛。这个设计，可能不会打动所有用户，但至少一部分用户会觉得比较有趣。如果我们内心没有一点童趣，可能也会觉得，这个设计，没啥意思。

玩是人的天性。对于比较好玩的交互设计，大部分人是比较容易产生共鸣的。实际上，据笔者观察，我们大部分从业者是有童趣的。我们比较缺的，是好奇心。

那么，怎样判断自己是否拥有足够的好奇心，其标志是什么？

个人观点，有两个标志。第一，是对与个人利益无关的生活小事的关注，远多于对个人利益本身的关注。第二，观察和思考，远多于评价和自大；追本和溯源，远多于偏见和傲慢。

为什么会提到个人利益？

因为，通常而言，个人利益，尤其是短期利益(比如少花时间设计和修改原型)，往往会和用户体验存在一个此消彼长的关系。

如果过于关注个人利益，不仅很难照顾到用户体验，甚至会伤害用户体验。至于给用户带来惊喜，就更无从谈起了。

回到现实当中。在时代洪流面前，好奇心的两个标志，显得很难，该如何实现？

关键在于找到背后的源动力。这个源动力，在笔者看来，有两点，分别是：求知若渴、淡泊宁静。

求知若渴，可以源源不断的驱动我们去观察、去思考万事万物的规律和联系。

淡泊宁静，正如诸葛亮在《诫子书》中所说，“非淡泊无以明志，非宁静无以致远”。人的心力和精力终归是有限的，如果我们沉迷名利、物欲、享乐，就难有兴趣和精力去琢磨万事万物了。

所以，只要找回自己童年的那种求知若渴，同时修身养性到淡泊宁静，这份好奇心，就会回来。

2 巧妙融合

某种程度上，很多带给我们惊喜的交互设计，都是一种巧妙融合。

笔者把这种巧妙融合，初步分成了三类，分别是：简单融合、直接融合、委婉融合。

简单融合，最常见的就是隐藏功能。把一个较为简单的操作动作，比如长按、双击、下拉、左滑等，和一个合适的功能，融合在一起。用电脑时我们常说的快捷键，也属于这一类。

通常而言，操作对应什么功能，讲究的是合适，并无固定章法束缚。比如在微信朋友圈，发表文字的功能可以靠长按（相机图标）唤起，设置权限的功能也可以靠长按（好友头像）唤起。所以，简单融合这块，可供我们发挥的空间很大。

另外，简单融合最常见的形式——隐藏功能，既实现了界面的简洁，又带来了一定惊喜。

简单融合，既简单，又实用。建议大家充分开发这一块。

直接融合，是指将生活中的趣味性，直接搬到软件中，搬到交互设计中。比如微信聊天中的扔骰子、石头剪刀布，以及漂流瓶、抽奖等。

这一类融合，有点像商场里的电玩城，虽然我们不会经常去玩，但确实比较好玩。

委婉融合，是指用明喻或隐喻的手法，将生活中微不足道的一些细节，移植到交互设计中。

这种移植，有时是直白的。比如 Mac 上打开应用时，其图标会在 dock 栏里有规律的弹跳，这会让我们联想到皮球的弹跳。

这种移植，有时是隐晦的。比如 iPhone 上删除应用前，其图标会抖。这种抖，是害怕还是求饶，任凭我们想象。

这种移植，有时是无声的。比如在朋友圈，要想呼出隐藏的设置权限功能，只能长按头像，长按名字则不行。这个设计，不乏想象空间。如果不尝试长按名字，则不会发现这个细节。

委婉融合，有时会带一些趣味性。更为重要的是，它能够引发我们的思考和想象，所以是一种很出彩的融合。这种融合，也会赋予交互设计，一种禅的味道。

整体而言，笔者非常推荐委婉融合。

3 追求卓越

如果目标是小惊喜，则保持好奇心、并做到巧妙融合，基本足矣。

如果目标是大惊喜，则需要雄心壮志，需要舍我其谁，需要追求卓越。

日常工作中，可能会有这样的对话。“这个动效/功能，实现不了”。

大惊喜里的几个例子，比如初代 iPhone 的触控体验，iPhone 里的测距仪，微信的扫一扫识物。这种设计，意味着要修一条最好的长城，背后往往有很多技术难题要攻克，有很多脏活累活要做。

如果团队文化就是做出最优秀的交互设计，那么，“实现不了”这句话，估计就听不到了。取而代之的，可能是：“还在研究中”，“下个大版本能上”。

4 自然而然

提到惊喜，还有一款值得研究和学习的产品，那就是锤子手机的 Smartisan OS。

个人观点，在小惊喜方面，Smartisan OS 颇有建树。在大惊喜方面，Smartisan OS 也进行了一些值得学习的探索。

先说小惊喜，比如华丽而细腻的桌面翻页动画，比如四指横划桌面可以切换桌面背景。还有一些贴心的小功能，比如静音可以设置时间，比如方便的长截屏。

(静音可设置时间)

(长截屏)

再说大惊喜。2016 年 10 月发布的一步和大爆炸，是比较大比较系统的功能，在当时也很新。锤子公司也一直有宣传这两个功能。所以相对而言，这两个功能是 Smartisan OS 的大惊喜。

笔者的备用机是锤子手机，身边也有朋友在用锤子手机。以一步为例，这个功能，笔者体验过很多次。但平常很少用，身边朋友的情况也类似。

(一步)

根据使用情况和主观感受，个人觉得，一步这个大惊喜，还存在进步空间，主要有两个方面。

第一，宏观层面。一步作为新生事物，好比一颗新种子。种子破土而出时，是一颗嫩芽，而不是一棵大树。新生的一步功能繁多，犹如一棵破土而出的大树，一方面有违自然规律，另一面因为功能繁多，很多用户无法一下子看懂，看不懂可能就不想用了。

第二，微观层面。一步这棵新大树，结了很多不同的果子，比如拖拽图片到其他应用、切换后台应用、展示最近图片/文件等。这些果子，是用户真正需要的吗？这个是要存疑的。

比如拖拽图片到朋友圈就能发朋友圈这个设计。通常而言，我们发到朋友圈的图片都是精挑细选的，会占用一定量的时间，比如旅游或聚会结束后发的照片。一步解决的是效率问题。发朋友圈的时候，少点几下这种效率问题，优先级是比较靠后的，我们没那么在乎。

还有拖拽图片/文件这个交互动作，大家通常在电脑上用的比较多，在手机上是没有这个习惯的，实际上应用场景也少。在手机上，大家一般只习惯拖拽应用图标。

还有切换后台应用这块，大家第一个想到的，一定是系统自带的，已经用惯了。而且唤起速度比一步快，点击面积也比一步大。

总的来说，微观层面上，比较缺让大家能马上想到一步的功能点。

最后，总结一下。对于领先时代、引领潮流的交互设计，需要做到自然。

具体而言，就是，大惊喜是一种系统性的大功能，好比一棵大树。这棵大树，最好有一个从种子到果子的生长过程，这样最自然，生命力也会最旺盛。

因为，从破土而出的嫩芽阶段，就可以通过用户反馈和数据来检验，这种嫩芽，是不是真的对用户有价值。如果价值不大或没有价值，还可以再调整。如果长成大树结满果子，再去调整，就很难了。

结语

交互设计小细节，如果有一定的趣味性或人文属性，则是小惊喜。

系统性工程的交互设计，如果最初感觉很酷，而且能引领潮流、代表未来，则是大惊喜。

始终保持孩童身上那种非功利的好奇心，用心观察并思考生活中的小事；

将生活小事和交互设计巧妙融合起来；

以上两点，可以帮我们做出小惊喜类的交互设计。

追求卓越，独立思考，做最酷最好的交互设计；

酷是结果也好，是目标也好，都不是最重要的。最重要的是，避免刻意和心切。酝酿大惊喜，犹如培养一个新生的孩子，需要投入极大耐心和精力，需要让孩子自然成长。没有家长会教半岁的孩子唱歌、把 3 岁的孩子送到高中念书。

再加上以上两点，可以帮我们做出大惊喜类的交互设计。

最后，用爱因斯坦的一句话来共勉。

想象力比知识更重要。

文章来源：站酷    作者：SnowDesign
分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

系统应该在合适的时间内通过适当的反馈,始终让用户了解正在发生的事情——尼尔森

自我理解：用户无论在界面上做什么，都应该及时告知他发生了什么或者进展到什么程度。可以理解为人与人的沟通，界面需要及时告诉我们做了什么，现在是什么情况。

a.  这种告知应该是及时的。

加载任务在互联网中是最常见的，在加载过程中应当及时传达加载过程，减少用户的心理等待时间。在外部加载总时间无法优化的时候，使用何种方式能有更好的用户体验是设计时需要考虑的。

b.  应当告知用户你在哪里

你的界面需要引导用户来操作，即作为用户应该清楚的明白我在什么位置，我下一步可以去做什么操作。

现在app的很多设计基础包括顶部的导航分栏和底部的tab bar都是为了告诉用户他在哪里。

在做一些概念设计时候，如果单纯是为了更好的视觉效果，就对这些基础分栏进行大刀阔斧的设计，最终导致了好看是好看，可是用户都不知道这页面是干什么的结果，很明显是违背了最基本的交互原则 状态可见原则。

c.  应当告知用户事情怎么样了

用户在你的界面是要做什么事情，这是你在设计之前应该思考的问题。

如何把用户要做的这件事情更好的呈现给用户，反馈给用户以及有哪些信息需要反馈给用户都是你要从交互的角度思考的，这包括过去发生的信息和即将发生的信息，也包括正向反馈和负向反馈。（这种操作是否成功了？这种操作进展到什么程度了？如果这样操作会有什么后果？点击之后会达到什么页面？这里是否可以点击？）

很多概念性的设计很酷，从交互的角度上来看也是因为界面对信息进行了很好的反馈，比如下面的设计就是对登山的信息进行了很直观的反馈。（来自设计设计师anastasia  原地址https://dribbble.com/shots/8291047-Tourism-App-Mobile-Concept）

自我理解：不同的人生活在不同的环境里面，不同的界面也有不同的外部环境。尽量保证界面在自己产品定义的风格里面，如果有机会还原真实世界的状态也很好。

a.  根据用户制定产品语言

在制定产品语言时，要了解产品的用户人群，使用相对应的用户群体所熟悉的文字语言 图形语言  板式结构  配色方法。要让我们的用户觉得这个产品很符合自己，而不是让一个老大爷去滑滑梯的感觉。一般来讲即便是同一产品，在国内外的产品语言也是有所不同的。

a. 模拟真实环境

产品在一些展示上模仿现实世界的样子，可以让用户快速接受，并感受到真实易懂。不仅仅局限于静态外观的模仿，还包括模拟真实物品的动态效果 声音等 都能给用户良好的使用体验

很多逼真的动效也是来自真实世界的映照。比如下面的可乐瓶的晃动就和真实世界很接近，让用户有很强的代入感。（作品来自设计师dannniel 原地址：https://dribbble.com/shots/6351526-Select-Drink-Animation）

自我理解：为了不让用户进入一个错误的场景或者结果，对于一些特殊操作应该给予撤回重做，让用户能够充分的确定接下来的行为。

a.  返回到原始状态

可以理解为悔棋，即已经发生的行为返回到原始的页面状态，这个条件的设置也应该有一些条件的限制，不能一直无限返回。

自我理解：君子常常言行一致，好的产品也是一样。保持为一个统一的整体，包括产品内部和产品外部，也包括线上和线下。

a.  与竞品保持一致

很多人讲现在的同一类产品的同质化现象严重，其背后也是有一定原因的。相同或相似产品的用户习惯保持一致，即意味着用户需要更少的时间去学习甚至不需要学习。从产品设计上讲，用户使用越方便易用，产品设计的越成功。和相关主流竞品做出比较大差异化设计时候，虽然摆脱了同质化的问题，但是很多常规操作却需要用户重新学习，这样带来的后果很有可能就是用户流失。所以，没有充分的理由，请与竞品保持一致。

b.  请建立一套完整的规范

一套完整的规范包括组件 色彩 间距  版块结构 等。规范可以让你的产品一致性更强，你要让用户能够对你的产品产生一定的规范性印象，当他看到一张页面就能联想到这是什么产品。

c.  请保持产品迭代的一致性

现在随着互联网市场的不断稳定，很多产品进入了稳定的迭代期。但是在迭代期也应该以保持产品语言 用户使用习惯的一致性为一大重要原则，版本的迭代也应该逐步进行，不要急功近利。尽量保持原有的设计元素一致性，新功能的创新也尽量不要损害原有用户的使用体验。

自我理解：再发生错误之前采取措施来避免。

a. 引导用户，不要让错误出现。

很多app迭代更新之后会有操作指引，目的就是为了让用户学习，减少错误操作。很多引导页也有相类似的功能。

b. 给予提示，尤其是用户在做一些重要操作的时候

一些重要的敏感操作，产品通过二次询问得到用户的确认，

自我理解：能让你的软件产品来记住，就不要让你的用户来记。尽可能的在设计产品的时候，不要让用户去记忆，把用户当傻瓜。

a 记住用户的使用操作记录

这个记录不单单是在某一设备上，一般来讲都是跨设备进行同步。用户在使用的时候不用来回调整，体验感是很强。

 

b  让用户选择信息而不是填写

填写是一件成本极大的事情，很多用户不愿意在这上面花费时间。所以产品在设计的时候要尽量让用户去选，而不是去写。

c 自动读取

思考产品一些功能的使用场景，有没有自动智能化的需要。即不用问候产品使用者，自动提供解决方案。注意，这里讲的是提供方案，不是解决方案。提供大多数的解决方案，可以节省使用者的交互步骤或者浏览时间等，也是易用性高的表现。

d 提供适量的信息

其实另外一个交互定律法则（以后会讲）其实提到了选择的数量，移动端的选项一般不会超过五个，超过五个用户的头脑就会混乱。所以要考虑信息的摆放位置在哪里，一方面是需求决定的，另一方面也应该控制每一个选项的数量，不要让用户感到焦虑。

自我理解：一般来讲产品的用户群体是多样化，用户的使用熟悉度也是有差别的。要照顾到绝大多数用户群体的使用体验，所谓的高频是每一个用户群体比较常使用。

a.  设置快捷/重复入口

讲产品常用或者主打的功能放在产品容易操作的位置或者重复出现，用户可以高效的完成自己的需求。

一般来讲用户的使用频率越高越要放在操作热区和表面，反之亦然。

b.  用户自定义常用功能

照顾到不同用户对于某些功能的需求不同，对产品的部分功能进行用户自定义化操作，提高用户使用的灵活性。

c.  给用户默认选项

将用户经常使用的选项作为默认，减少用户操作时间，达到灵活高效的目的。像淘宝都会设置默认的收货地址，每次下单不用每次都输入，十分高效。（当然也有翻车的时候）

自我理解：互联网用户阅读产品的一个很重要的特点就是快。即不是来阅读不是来看，而是扫一眼。所以要求页面上的内容能够清晰可见，方便用户快速捕捉到自己喜欢阅读的信息，减少不必要的干扰，简洁高效。

a.  清晰的板块划分

把页面内容的优先级别进行分级，清晰的板块划分将会引导用户操作。还可以将页面的主推内容向用户展示，避免用户分不清重点。

b.  减少视觉噪音

注意页面的主角是谁，在平面设计中也有相同的概念。不要让背景或者装饰哗众取宠，而影响主要信息的传递，视觉设计是来辅助业务表达的。如果核心需求没有传递好，那就会单纯地成为一件艺术品，而不是设计作品。所以在设计过程中，要权衡视觉点，减少不必要的噪音干扰。

c. 严格遵守设计的四大基本原则：亲密  对比  重复   对齐

落实到界面上包括间距 字号 字重 版式节奏 。其实看到看到很多界面做的不精彩不优美，就是基础性的原则就没有完全落实贯彻。这里就不举例，基本所有的设计都要遵守的原则，很重要，很重要，很重要。

自我理解：要考虑到页面可能发生意外，错误发生后要及时弥补。

a.  提供清晰地说明和解决方案

考虑到可能会达到的错误界面。在发生的错误结果上，使用明确清晰的语言告知错误的原因，并给予解决方案。

自我理解：要考虑到页面可能发生意外，错误发生后要及时弥补。这一部分其实主要进行一些说明，让用户操作方便，相当于使用说明书。

a.  无需文档

进行新页面的设计尽量直观清晰，符合用户习惯，无需引导即可使用。

b.  一次性提示

改版引导或者新功能引导给予一定的提示

c.  常驻性提示

对于产品的操作性功能或者操作必须注意到的问题，产品需要进行一定说明

d.  帮助文档

用来解释一些常见问题。

文章来源：站酷    作者：花城丶

分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

用户体验地图是什么 | WHAT

用户体验地图（Experience Maps）旨在通过描述用户历程和故事，使设计师、产品经理等项目成员更好地了解用户和洞察诉求。所以对于用户体验地图，我们可以将其定义为以下内容：

- 是一种描述用户故事的可视化工具；

- 是一种帮助设计师、产品经理等更好地了解用户的共创工具；

- 从用户视角出发，直观展现产品流程各个触点上用户的痛点、需求和情绪；

- 用户体验地图绘制的形式并不唯一，可以根据项目需求，增减内容。

通常在接触到需求之后，设计师就可以开始梳理现有流程、使用用户体验地图了。要注意的是：

- 需要梳理的功能不分大小，都可以使用；

- 做之前，务必要先调研和访谈用户使用产品的情况。

建议时长：

- 重要项目：120～180 分钟- 日常项目：60～120分钟

参与者：

- 必选：设计师、产品- 可选：研发、市场、其他

工具：

- 电脑或白板+便利贴

 

为什么需要用户体验地图 | WHY

需要发现和拆解产品现有问题，梳理用户流程时使用用户体验地图，可以在聚焦阶段，整合用户诉求和业务诉求，共创机会点，找出解决方案，通常在以下场景中使用：

- 新产品设计：需要对需求进行拆解和优先级排序；

- 产品优化：发现产品现有问题，洞察设计发力点。

 

由此可见，在设计过程中使用用户体验地图作为设计工具，有以下益处：

- 更好的以用户视角来看产品的体验；

- 通过共创，项目成员达成共识；

- 确认触点，作为我们的设计方向；

- 通过用户痛点找到机会点；

- 帮助梳理产品流程。

△ 用户体验地图共创现场

 

用户体验地图操作流程 | HOW

我们通常会将流程分成4 个阶段：定义原则和目的 —— 梳理阶段流程 —— 洞察痛点 —— 寻找机会点。

1. 定义原则和目的

首先要了解我们做用户体验地图的原因和目的，包括用户是谁、解决什么问题、用户的目标、产品的整体目标、限定条件等等，对用户群体、整个项目背景和共创任务目标有清晰、全面的认知。

2. 梳理阶段流程 

首先是划分阶段，将用户的行为拆分成几个大的阶段，在整理时要注意：

- 在整个产品的范围之内尽量把故事、流程讲完整；- 以广度优先，而非深度，不要过早的沉浸到细节中。

接下来我们要将主要阶段拆分成单个任务，并梳理具体的任务和触点，罗列出过程中的任务和各个触点，要做到事无巨细。

然后根据任务和触点，整理对应的用户疑问、用户感受/情绪。通过对用户的观察和访谈进行梳理，客观的描述事实，切勿自说自话或是将自己的情绪代入其中，也不要急于猜想与分析。

3. 洞察痛点

这一步需要我们汇总用户的痛点，并将痛点分级，洞察用户痛点背后的真实诉求。这个过程中可以先让大家在一定时间内写出自己的想法，每一条写在一张卡片上，做到先相互不干扰，之后再统一整理和总结。

4. 寻找机会点

通过上述总结，思考新的机会点、解决方案、优化整体流程，并对新流程下的功能做优先级排序。可以通过准备一些问题来刺激大家脑爆出更多的内容，比如：用户还有其他选择么？怎么做用户才能更爽？其他用户来到这里该怎么处理？等等。在这个阶段需要：

- 对内容进行对标、讨论，把公认的点保留下来，无用的点剔除出局；- 根据实际情况和项目成本、进度等条件，对新流程下的功能做优先级排序。

 

如何为过程提效 ｜TIPS

在实际的工作过程中，因为项目时间都非常紧张，绘制这样一个完整的用户体验地图比较耗费时间，所以推荐大家几个提效的技巧，既可以减少时间浪费，也可以提高共创质量：

1. 事前

充分做好用户调研，提前准备好用户地图模板，可以在开始之前的一到两天发给参会人员，让所有人对产品有一个整体梳理和思考，有助于提高大家的产出质量。

2. 事中

如果是优化的产品，可以将设计稿 demo 或者线上产品截图打印出来，这样可以增强大家的代入感，有利于想法的输出。

3. 事后

整理电子版体验地图，需要跟随产品的演进进行更新，上传到项目共享空间随时查看。

文章来源：站酷  作者：Ant_Design

分享此文一切功德，皆悉回向给文章原作者及众读者.

免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务