搜索动作在App中依靠搜索框来完成，好用的搜索框很大程度上决定了产品的搜索体验如何。大多数搜索框存在相似性，但真正好的搜索框会在细节上为用户带来差异化的反馈，带来很暖很贴心的感觉。

1、搜索框结构分析 

从体验层面上看，一个良好的用户体验需要具备完整的流程。搜索框的使用流程可以简单划分为：

使用前-找到搜索框入口；使用中-点击输入内容；使用后-展示搜索结果。

其中使用中会涉及到跳转和输入两种不同的状态，在下面的文章里我会展开来分析。

2、搜索框的常见类型 

回想常用App的搜索框，好像它们的样式看起来差别并不是很大，但其实每个搜索框的细节都是经过精心设计的，下面总结了几种常见的搜索框类型。

搜索图标

页面上只提供一个放大镜图标，通常需要用户点击图标后才能跳转到搜索页面，例如小红书就将搜索图标放置在页面右上角。

基本搜索框

基本的搜索框组成包括放大镜图标、文字提示、输入框三部分。微信主页的搜索框采用了这种基本形式，文字提示为搜索，简洁清晰。

文字提示类搜索框

和基本搜索框的唯一不同的地方在于，这类搜索框中的文字提示部分不再是搜索两个字，而是根据产品需求支持预置多组文字提示并在搜索框内循环展示。

▲ 在大众点评的顶部搜索框中，文字提示部分循环展示了三组不同的内容，引导用户快速检索到好吃和好玩的。

功能类搜索框

之所以叫做功能类搜索框，是在文字提示类搜索框的基础上根据产品功能的需要额外添加了常用的功能性图标，如扫码图标、拍照图标、语音图标等，赋予搜索框更多的功能属性。

▲ 经常使用豆瓣看书评的同学可能会注意到豆瓣主页的搜索框中有一个扫码图标，点击之后可以快速扫描图书条码或二维码，快速识别书的内容，省去检索的麻烦。

▲ 淘宝搜索框的组成更复杂，除了支持扫码外还有相机图标，方便用户拍照识别商品。 

3、搜索框设计状态分析 

使用搜索框搜索的过程总体可以分为四部分：搜索前、点击搜索框、输入中、搜索后。设计分析过程中我们要先理清整体的搜索流程，再考虑每个状态对应的交互细节及反馈，这样才能保持逻辑清晰。

搜索前-默认状态

位置

大多数搜索框出现在页面顶部，作为一个大的触摸目标更符合用户的认知习惯，更容易被用户发现和使用。

▲ 在苹果自带的地图应用中，搜索框放在页面中部偏下的位置，相比于顶部搜索框，这样的位置分布更方便用户单手操作。

样式

搜索前的状态除了前面讲的几种常见的搜索框样式外，有些产品会直接在搜索框增加“搜索”按钮。

▲ 阿里系产品包括淘宝、支付宝、闲鱼等主页搜索框都额外添加了“搜索”按钮，相比于点击搜索框再点击键盘搜索内容推荐，直接点击按钮简化了搜索流程。

点击后-获取焦点

搜索框

点击搜索框后，框内的放大镜图标会消失，出现闪烁的光标引导用户输入，搜索框右侧会出现“取消”按钮。

▲ 点击大众点评的搜索框后，搜索页会出现三个选项，点击每一个选项，搜索框内的文字提示都会改变，有效帮助用户提升搜索准确度，虽然是很小的点但做的很用心。

键盘

点击搜索框后会弹起键盘，在不输入内容的情况下，点击键盘自带的“搜索”按钮能查询搜索框中推荐的内容。

搜索页

搜索页的内容通常包括历史搜索、搜索发现、热门推荐等版块，记录用户的搜索行为，推荐目标商品或服务，提高转化率。

▲ 豆瓣将最热门的内容都展现在搜索页中，包括实时更新的热门书影音榜单、热门小组、热门话题等，为用户提供有效的引导。

关于历史搜索我们还可以继续深入分析，思考这些记录怎么排序、最多显示几条记录……

▲ 网易云音乐的历史搜索最多可以保留10条，采用横向滑动的手势交互可以节省屏幕空间。根据内容长短一屏一次可以显示2-3条记录，这会导致排在后面的历史记录不容易被用户快速发现。

▲ 淘宝的历史搜索可以容纳更多的数量，当搜索记录超过两行时会有一个小的展开按钮，点击按钮可以查看早期的记录，这样既能节省屏幕空间也能最大化容纳历史记录。

搜索中-输入内容

删除/取消

当开始输入内容时，在搜索框的右侧会出现删除图标，方便用户一键删除输入的内容，这里要注意区分删除和取消的区别。

▲ 在淘宝中点击“删除”图标，页面会返回到上一级也就是搜索页；

▲ 点击“取消”按钮，页面会直接返回到主页也就是搜索前的状态。

搜索提示

在用户输入内容时，产品会根据用户输入的内容提供相对应的搜索推荐，这是搜索框的必备的交互反馈。

通过合理的词条推荐能极大降低用户的思考时间，提高搜索效率，同时省去再次点击搜索按钮的流程，降低用户的操作步骤。

字数限制

目前我所知道的大多数App在搜索时都没有字数限制问题。

回顾一下搜索使用场景会发现用户在搜索框内输入任何内容都是有可能的，尽量不要约束用户的输入内容。无论用户输入多少内容，点击都可以完成基本的搜索操作，这样整个流程才完整。

▲ 在百度中输入过多字符时，会提示查询限制在38个汉字以内，多的字符会被忽略，虽然给出了提示但并未打断用户的操作流程，可以让用户继续完成搜索。

搜索后-展示结果

符合预期

搜索的理想状态是搜索到的结果符合用户的预期，满足用户的搜索需求，并把最吻合的搜索结果排在前面，为用户带来清晰的结果展示。

智能提示

智能提示是对用户输入内容上的一种提示或纠正，如果用户输入的内容有问题或不够标准，在搜索结果中会能给最贴切的搜索结果。

▲ 在淘宝中输入“shouji”或“souji”，淘宝会根据拼音给出“手机”的搜索结果，但仍保留原标签，方便用户再次点击搜索；输入“手ji”时，会直接给出“手机”标签，这种差异化的反馈能更好的为用户服务。

无结果提示

如果没有搜索到用户输入的内容，搜索页会显示一个空状态，提示用户没有搜索结果。关于空状态如何设计可以看我之前写的一篇文章——如何做好「空状态」设计？来看资深设计师的总结！详细分析了空状态的设计方法。

▲ 相比于直接显示搜索无结果的状态，拼多多的搜索结果首先会标明相关商品较少，然后将搜索内容拆分成不同的标签进一步引导用户来发现内容。

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

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

当你在一个既定的服务领域工作，但想要进行革新时

1.详细研究当前的用户体验

分析当前的服务体验，解读用户旅程中涉及到的行为，接触点，出现的痛点。构建现有的体验旅程图可以捕捉到服务体验的全貌，立即发现需要重新设计的关键问题，促进组织内部的一致性。对于这种复杂的服务，根据分析结果建立服务蓝图也大有好处，可以捕捉到流程中的关键问题还有不同接触点的关系中的重要方面。

建议：
自己进行尝试，能够有效地发现细节，涵盖分析中的所有步骤。

2.分析服务构建

体验和过程只是服务的一部分：在分析现有服务时，我们也要考虑底层系统是如何搭建组件和动态结构的。只有对系统进行全面理解，我们才能发现连接缺失，精力和资源的潜在浪费和重复。创建一个系统地图有助于让团队成员明确这些问题，讨论潜在的改善机会。

建议：
我们需要将系统中的所有行为者联系在一起，全面理解系统过程，减少重复，弥补差距。

3.设定具体的目标，指导设想

在开始构思之前，花些时间来思考系统和体验的分析结果，并通过重新设计确定自己达到的关键目标。目标可以是横向的（比如 “优化整个旅程中的信息流”），也可以是非常具体的（比如 “入职：从填写表格到热情的欢迎会”）。最重要的是，我们首先要详细了解现状，才能设定目标，制定正确的方法，同时意识到急需解决的潜在局限性和障碍。

建议：
我们也可以将期待体验设定为目标旅程，为体验中的每一步设定一个具体目标。

4.创造新点子和解决办法

提出新的想法，解决旅程中所有已知痛点或系统中的差距，以及抓住有趣的机会。这些想法包括既稍微改进一些特定功能，也可以影响整个服务模式的宽泛概念。在这个阶段，不要限制自己的想法数量，更不用考虑可行性：捕捉每一个想法，与其他团队成员分享，并在彼此的思考之上建立一个新想法。

建议：
快速构思是一种头脑风暴的练习，团队中的每个人都写下他们心中的每一个想法，然后再进行小组讨论。

5.确定最有可能实现的概念

收集所有想法，确定下一步的行动计划。如果项目很简单，我们可以简单地将所有的想法整合成一个重新设计方案，逐步发展。在其他情况下，你可能最终得到50多个想法，对当前的服务体验进行创新，但显然我们不能诉诸于每个想法，那么……从哪着手呢？我们可以建立一个评估矩阵，确定标准，分析每个概念（例如，对用户的价值，实施成本，独特性等），并对它们进行相应的评分。这样我们就可以筛选出最有可能实现的想法，创造较大的价值（这些想法可能是最先开发的）。简略的概念可以很好地改善部分服务，但不会产生较大的影响（容易实现的目标）；而较复杂的概念从长远来看会对服务体验产生更积极影响，但需要投入大量的时间和精力。

建议：
我们需要考虑的最核心内容是新概念给用户和组织带来的价值，而不是实施的可行性或复杂性-但这可以根据具体环境而改变。

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

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

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

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

若想战胜竞争对手，产品无疑需要在设计上做好提前规划，并时刻树立优化意识，尽量满足用户的体验期望。然而研发团队有时总容易陷入误区，本篇文章里，作者就产品研发过程中可能忽略的、对用户体验具有破坏性的因素做了总结，一起来看一下。

毫无疑问，要想获得出色的用户体验 (UX) 需要在数字世界中保持竞争优势。尽管如此，由于某些关键盲点，改善用户体验的努力并不总能取得成功。如果忽略这些盲点，那么无论预算大小和团队的努力如何，失败都会预先留存在项目中。事实上，如果实施不准确，可能会导致所谓的“经验差距”造成的设计上的损失。

上图所示的具体案例：某银行投资了近 50 万美元改进其手机银行应用程序，却导致整体客户满意度下降。其根本原因是金融公司未能发现和预防不同级别的内部经验差距。那么，该如何及时识别和避开这些盲点，以保障耗资巨大的大规模数字化项目的成功呢？

一、即使预算庞大，用户体验工作也可能失败 UX efforts can fail even with huge budgets

在过去十年中，大量研究证实，用户体验对公司市场效率存在优先影响。根据甲骨文的一份报告，如果糟糕的用户体验导致多个业务问题，那么积极的用户体验会增加推荐、保留率和收入，因为 86% 的客户愿意为更好的用户体验支付更多费用。

看起来一切都很简单——只要增加预算和成本，就足以提供最好的体验？但在实际操作中，这并不容易。根据贝恩公司的研究，80% 的 CEO 认为他们提供了卓越的体验，而只有 8% 的客户同意这一点。

其主要原因可以用“经验鸿沟”来解释——这是客户期望的体验与他们从数字服务中获得的体验之间的负面差异。如果体验比预期的差很多，就会产生许多令人不快的后果，比如客户忠诚度下降、大量负面评论，甚至客户决定离开品牌。

在大多数情况下，人们往往无法认识到真正的经验鸿沟。

即使公司的领导和员工觉得有些地方不对劲，他们也往往不明白“要改进什么”以及“为什么要改进”。如果没有意识到某件事，就不可能管理它。

二、现实生活中的例子：行动中的经验鸿沟 Real-life example: Experience gap in action

为了解释“经验鸿沟”可能导致麻烦的基本原理，我想分享一个现实生活中的例子。

几年前，一家知名且受人尊敬的中欧银行开始了大规模的数字化转型之旅。当时，该银行的应用程序的评级为 3.5，并且已经过时。所以，为了实现数字化、提升银行形象，并在不断增长的数字市场中获得竞争机会，管理层打算紧急创建并推出一款现代化的银行应用程序。因此，最初的设计和开发周期为 6 个月。

尽管如此，银行还是花了三倍时间（1 年零八个月）自主构建新应用程序。无论从时间来说，还是从投资预算来说，这都可以称得上是一个重要项目。从项目的范围、所做改进和时间表来看，总成本估计在 50 万左右。

然而，结果完全没有达到预期。新应用发布后，它从之前的 3.5 下降到 2.4，并且因为它没有改进，以至一年后，其评分仍在下降，其用户体验也日渐恶化。

银行尽一切努力改善用户体验，整个团队努力工作近两年，怎么会发生这种情况？

这种情况的产生，正是由于“经验鸿沟”的存在。尽管该银行启动数十名顶级专业人士花费了 20 个月和 50 万来改良产品，但它仍未满足用户的期望。

虽然客户不满意的真正原因是无意识的“体验鸿沟”，但公司往往倾向于通过指责外部环境来解释它。例如市场的变化、竞争对手的活动、创新的出现、消费模式的变化。当然，这也是客观事实，但一家适应性强的公司应该考虑将这些因素用于其增长，而不是作为“替罪羊”。

但衡量适应效果的最重要方式是公司服务在多大程度上满足甚至超过了消费者的期望。没有意识到他们服务和客户期望之间存在差距的公司注定无法适应外部环境的变化。

在某些情况下，公司的行为甚至会导致经验鸿沟扩大到临界水平。这通常会导致目标客户对公司产品和服务的需求急剧下降。

如果我们回到这个例子，似乎管理层对重大改进是否可以成功充满信心，并投入了大量资金和精力进行广告宣传。同时，那些宣传此应用程序现代、创新和友好的广告，激发了消费者的高期望，以至于大大超出了其服务的实际质量。

结果，当产品最终发布时，客户惊讶地发现他们的期望落空了，新应用程序比改良前更糟糕。并且相关的负面评论不仅出现在 App Store 和 Google Play 上，也在社交媒体上大量涌现，人们在推特上不断讽刺该银行失败的数字化项目。

三、对鸿沟的不了解是主要威胁 Unawareness of the Gap is the main threat

接下来，让我们探讨一下数字服务和用户期望之间的鸿沟是如何形成的，以及为什么没有人能够阻止它。

事实上，最大的挑战是大家往往很难注意到这些差距。他们的原因并不明显，并且可以同时存在于各个组织架构之上。此外，它们的影响令人难以察觉，以至于最终会导致意想不到的破坏性后果。最终，直到团队面对产品在市场上的失败，才有人明白原因是什么。

弥合鸿沟的主要困难在于，级别越高，对经验鸿沟的不了解程度越高。实际上，在组织架构的顶部，通常会找到造成鸿沟的根源。级别越低，离用户越近，员工越能觉察到问题和差距，但他们往往没有权力和能力去消除它们，他们受制于文化。

在这种特殊情况下，售后部门每天都会接到数千个关于产品问题的电话，但由于业务流程分散，他们对此也无能为力。

客户的挫败感变得更加强烈。即使是最简单的日常场景，他们面临的问题也难以执行，但他们从银行员工那里得到的反馈是，他们并不是唯一产生困惑的人，而且目前银行正忙于交付新功能，而不是修复当前问题。

使事情变得复杂的是，经验鸿沟背后的内部流程，是由过去促进公司生存和增长的相同机制引起的。该公司受制于过去的成功。就像诺基亚一样，这家全球最大的以硬件为中心的手机工厂，在苹果智能手机引领的软件革命中被彻底击败。

由于任何组织都有惰性，这些机制受到内在信念和价值观的影响，对适应市场和弥合经验鸿沟造成了阻碍。

首先，应该在管理层面解决鸿沟。因此，级别越低，离领导层越远，离客户越近，就越能感受和认识到鸿沟的存在。自然，一线员工将拥有从那些期望没有得到满足的客户那里得到最多的数据。

四、7 种体验鸿沟盲点 The 7 types of experience gap blind spots

主要的体验鸿沟可能是由组织中七个层次（文化、反馈、执行、设计、价值、品牌承诺、情感联系）中的一个或几个盲点造成的。

1. 文化鸿沟

在文化层面缺乏以顾客为中心的理念，员工无法使服务更接近客户期望，导致了“文化鸿沟”。在具有“文化鸿沟”的公司中，有助于以客户为中心的流程和活动都是处于低优先级的，相应的，它们也不会得到相关的资源。

2. 反馈鸿沟

缺乏关于客户期望和他们对产品或服务的体验数据会造成“反馈鸿沟”。在这种情况下，公司可能经常收集数据，但没有对其进行分析，也没有采取任何措施来改善这种情况。

3. 设计鸿沟

即使优先考虑以客户为中心的方法，并且收集了大量有关客户期望的数据，但在设计能力和方法上仍可能存在鸿沟。拥有合适的专业知识，就可以构建高质量的数字产品生态系统，从而根据客户需求提供最佳服务。

4. 执行鸿沟

这种鸿沟与糟糕的设计执行有关。如果不优先以用户为中心的来设计产品，那么创建最终产品和服务的决策和努力将注定是低质量和低效率的。这决定了公司在数字时代创造有竞争力的服务和产品的能力。

5. 价值鸿沟

如果设计生态系统在 价值金字塔的五个层次（功能、可用性、美学、地位、使命）上不符合用户的期望，就会形成价值鸿沟。

6. 过度承诺的鸿沟

正如我在上述银行案例中所表明的那样，如果一家公司只顾着积极推广其服务，承诺一些产品无法提供的东西，它会导致用户对期望的更大失望。因此，由于广告承诺与现实不符，对该服务的负面评价可能会翻倍。

7. 情感鸿沟

如果品牌传播是纯粹的信息传播，专注于功能特征，那么就无法与用户形成情感联系。由于人类基于情感做出决策，因此基于情感构建服务价值会对客户期望和最终用户体验产生积极影响。

五、弥合经验鸿沟 Bridging the experience gap

每个客户都会不知不觉地根据自己的期望来评估他们所接受的服务。用户体验质量所引发的情感将形成品牌的声誉。

在现代世界，数字渠道已成为品牌的主要“营销”和公关渠道。

一个应用程序，即使有一百年的服务客户历史和其他渠道的优质服务，负面体验也会破坏品牌推广的所有努力。

这仅仅是因为在数字时代，移动渠道占主导地位，对于某些人来说，它正在成为与品牌互动的唯一途径。这就是为什么了解如何弥合数字产品出现的七个体验鸿沟的方法如此重要。

1. 弥合文化鸿沟

在文化方面，转型基于高层心态的改变，并将这种影响渗透到整个的公司文化和内部价值观。特别是，可形成“以客户为中心”的体验思维模式。

2. 弥合反馈鸿沟

在银行案例中，开始弥合反馈鸿沟的第一步，是深入了解社交媒体上的负面评论以及致电售后部门的电话。接近这些客户才容易消除反馈鸿沟。事实上，他们比管理层更了解应解决哪些问题，并且往往渴望积极分享自己的情绪并希望得到倾听。如果一家公司足够开放并准备好接受批评，它可以使用这些数据来弥合鸿沟并提高产品迭代的敏捷性。

3. 弥合设计鸿沟

通过整合设计方法和设计思维来制定弥合鸿沟的策略，可以使用设计金字塔。该框架从五个层次（流程、团队、行动、结果和价值）确定了能够提高公司整体效率的设计集成。

4. 弥合执行鸿沟

组织必须将经过验证的设计执行方法（例如设计思维、HCD 或 UX 设计方法）与分步系统相结合，以设计符合客户期望并能够弥合执行鸿沟的数字产品。

5. 弥合价值鸿沟

产品的功能级别为客户创造真正的价值和利益，并通过提供卓越的可用性进行功能扩展；美学 ——令人惊叹的视觉识别；状态 —— 针对产品特定受众的个性化，最后是建立产品的价值观与使命。

6. 弥补过度承诺的鸿沟

数字时代的客户要求透明、关怀、诚实和开放的沟通。由于网络效应，几乎不可能销售劣质产品，因为每个人都可以在社交媒体上发布负面反馈，而这些负面反馈将深深地损害客户的信任。因此，做出不仅可以兑现，甚至可以超额兑现的承诺至关重要。

7. 弥合情感鸿沟

对客户的同情和关怀比以往任何时候都更加重要。在品牌与客户之间建立情感联系对于确保长期忠诚度和需求至关重要。这种联系是通过之前涵盖的所有阶段建立的——将客户放在第一位的正确心态；收集反馈并在此基础上进行改进；使用正确的工具和方法来创建产品设计和生态系统；创造真正的价值和利益，最后，通过诚实和超额兑现承诺。

六、成为深受喜爱品牌的途径 The pathway toward becoming a beloved brand

该途径涵盖了可能破坏数字产品创造的 7 个主要体验鸿沟，以及可以帮助避免和解决这些鸿沟的 7 个桥梁。如果一个品牌能意识到这些盲点，它可以立即获得比仍处于盲点的竞争对手的显著市场优势。

仅凭意识就可以产生巨大的差异，但将意识与行动相结合会导致长期成功，成为一个需求量很大和深受喜爱的品牌。

本文翻译已获得作者的正式授权（授权截图如下）

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

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

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

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

文章定位：

好的产品能为用户带来高效的解决方案，在迭代升级中实现用户价值。

以下文章主要探讨设计师 如何从用户角度出发打造产品体验，通过设计帮助产品带来高溢价。

01、用户思维

用户思维最基本就是 围绕用户 去设计，帮助他们 解决实际问题。

Q：为什么要围绕用户做设计？

A：想将自己产品打造成为好产品，最终留住用户。

Q：什么是好产品？

A：“让产品自然生长，不要去碰用户，不要去打扰他们，让他们自然形成一种互动关系”。不要强塞东西给用户，切切实实的在用户需要的时候能快速给到他们价值，解决某个问题，或满足他们的情感，情绪。

即：帮助用户解决实际问题，并提供解决该问题的优秀设计。

所以设计师产出设计方案前需思考的是：

1. 解决什么实际问题？

2. 应该提供怎样的设计？

02、确定用户面临的问题点

解决哪些实际问题是每个案子的核心，在该阶段设计师常容易陷入误区

如：我要做 一个…东西、我要怎么怎么做……下意识的就去研究怎么做，而不是首要思考具体解决什么问题，该误区到后期往往会造成设计偏离。

为了避免该情况，首要需确定问题，并将问题清晰表述出来，表述的越清晰解决起来就越容易。

那我们应该怎么去确定这个问题呢？

– 利用同理性图谱构建用户认知

好的设计需要与用户心智相符合，贴合用户当时情境下的诉求。

为了让优化方案更有依据，在发现问题的时候，需要从用户视角出发，结合当前产品的页面去分析是否符合当前用户的诉求。

——可以采用 同理心图谱 的方式：

从 说了什么、做了什么、想了什么、感觉到什么 四个维度去勾勒用户真实的想法感受。

以下以优化案为例：

在实际优化案中，可结合需改版页面按照四个维度走一遍，可让设计师更了解当前页面帮助用户做什么，后续有哪些优化方向。

如：QQ支付页面整体流程优化设计

① 用户需给好友发红包，在输入完红包金额点击支付时，向上滑出了支付面板，用户看到这个面板时候，其心理活动可能是怎样的呢？

② 用户想要更换支付方式，点击更换后看到下方页面，用户对该页面的的感受会是怎样的呢？

③ 用户输入密码后，以为马上就成功了，却发现卡里没钱了，这时候用户更加迫切的是什么呢？

通过以上这样 【移情】的方式，使我们更能了解用户，在没有用户访谈的情况下对他们的 愿望、需求、诉求点 有个概念，当有了这个 共鸣 在后续就可以将这个共鸣变成一个有着明确优化方向的 问题陈述。

– 自问自答式推理逐渐确定问题

在挖掘用户需求点过程中，可以采用不断询问不断回答的方式，将自己脑子里想的直接写出来，通过这样的方式构建自己思考的逻辑。

如：“在下单页转化率太低 > 在下单页用户无法快速验证信息 > 在下单页重点信息不集中，其余信息太显眼 >…..”

在这个过程其实就是刨根问底的过程，在反复的试错过程中也会离真相更近。

类似下面这张Julie Zhuo的自我审视图：

03、问题陈述（POV）

– 什么是问题陈述

通过陈述句将产品当前状态（问题）和期望状态（目标）的差距描述出来。POV有助于我们强调用户痛点，保证自己将重点始终放在用户身上。

– 问题陈述怎么写

那怎么陈述才能更好的将问题及规划表达好呢？以下有两个方式：

• 基于用户角度来说：我看QQ群里抢红包很热闹，我也想快速参与进去，但是轮到我发的时候，我因为我不是非常熟悉整个流程，导致我反应慢了，这让群里的人以为我故意这么慢才发，影响大家氛围，这让我有点沮丧。

• 基于用户研究来说（4W）：我们的初中生因为特别活跃，喜欢在群里踊跃发言参与活动，所以一旦群里有好玩的消息总是想第一时间参与进去。我们的解决方案应该 为他们 提供快速能够完成红包发送的链路与方式，不扫他们的兴。

以上两种陈述方式都是针对同一个问题，只是表述方式不同。所以只要你足够专注用户，理解他们需要什么以及为什么需要，就可以快速构建你后续的设计方案。

– 问题陈述注意点

① 用户与他们的需求是问题陈述的核心，避免：我们应该怎么做、产品应该…作为开头。

② 保持陈述的宽泛性，不要过早抛出细致的解决方案、技术限制等内容，避免团队发散受限。

③ 专注一点，不要让用户的需求和目标过于宽泛，导致自己很难找到一个合适解决方案。所以不要视图在一个问题陈述中解决太多用户需求，一次解决一个就很好了。

04、如何打磨设计方案

在经过问题陈述我们对要解决的问题了然于胸，在解决方案上，设计师需要考虑 易用性、易理解性、及着力提升用户任务效率，给用户一个更好的体验。面对不同的项目，可考虑以下几点：

– 结构简洁，重点突出

例1：

该例子非常能体现出 诉求 与 解决方案 的契合。

首先工作人员唯一的目的性就是 筛查 有问题的人，所以在众多人中需 快速判断，这个转化到设计上解决方式：

通过大面积的 色块直观反馈；

通过实时的 滚动时间+滚动背景反馈真实性；

在结合下方核酸与疫苗辅助判断，整体非常贴合实际诉求，重点突出，有节奏感。

例2：

通过体验核心信息，将内容合理布局，重点突出，操作划分明确，有助于信息获取与确定。

– 管理复杂（满足不同诉求）

人的认知资源有限，天生不善于处理复杂信息，所以在面对复杂信息时设计师需将复杂的内容以一定秩序逻辑管理，分而治之，减少用户的选择，让正确的行为变得自然和明显。

例1：

在58二手车页面的改版中，可以看出在面对不同用户诉求的情况下在 模块化结构 与 坪效 找到了平衡：

顶部按钮直接 分流 不同目的用户；

中间模块展示用户 最关心的维度：价格、品牌、车类型；

下方 透出推荐内容 吸引用户往下逛。

– 注重情感化

情感化不一定都是很精美的插画、动效等表现层面上的，有时候 贴心的记录、舒缓的内容、小游戏…… 也可以起到 情绪调节 的作用，提高用户看到复杂信息的 忍耐度。

– 场景化设计（预判你的预判）

多考虑用户使用场景，挖掘一些场景是可以通过我们的设计 帮助用户多走一步，帮他们排除障碍，减少负担。

例1：

打车软件在特定时间点自动浮出目的地，以及截图后立刻打开微信聊天窗，图片自动在对话框中浮出的方式都是通过用户的行为预判了用户下一步的行为，

例2：

用户输入密码后下意识认为操作成功，但却被告知失败，对用户而言是一次打击，若这时直接前置化用户后续可能会的操作，将条路径重新接上，可以让整个过程更加高效。

所以在具体设计方案上，设计师需要不断的去思考打磨设计方案，让自己的设计：

① 显而易见的，让用户体验后觉得「没错，就应该是这样」；

② 有价值的，它为用户解决实际的问题；

③ 与用户的心理模型相符，它不意味着更多的设计。

05、验证体系

验证方式有很多，目前市场上有几大比较成熟的体验度量体系，针对不同的关注点进行 定性+定量 检测。

除去性能表现外，主要都是围绕用户行为数据及使用感受来进行度量

在行为数据上，主要关注：访问频率、留存率、页面访问次数…

在用户感受上，主要关注：满意度、用户评价、推荐度…

– 设计师怎么确定自己设计方案的验证指标

对于设计师而言，不需要做的这么全面，我们只需要针对我们 具体优化页面、场景 找到可以直接验证的指标即可。

例：

在上述的发红包支付页面的优化设计中，由于主要优化的方向是为了让用户更聚焦，提升整体支付体验，所以基于这个目的，我们可以以 整体的支付成功率 来验证大致优化效果；

其次，可以从 每个触点的转化漏斗、和 各页面停留时长 上分析具体页面改版效果。

– 面向真实用户验证设计

除去行为数据上的验证，用户真实反馈同样重要，我们可以采用用户调研的方式了解用户对产品体验的反馈，主要可以从下面三个方面执行：

① 可用性测试：可针对核心优化的功能点设定测评任务，来观察用户的完成情况，如：如果你余额不足，你会怎么做？

② 满意度测试：采用界面可用性问卷调研，可以采用SUS问卷收集反馈

③ 推荐度测试：通过NPS量表来衡量，通过将分值划分为：0~6分为贬损者，7~8分为被动者，分值高于8分为推荐者，带入计算公式（NPS值=推荐者% – 贬损者%）算出推荐度数值，数值越高，说明用户满意度越好，用户的推荐意向越高。

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

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

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

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

B端产品往往都具有较长的业务流程和操作步骤，需要用户循规蹈矩、通过较多的步骤找到相应的页面，来触达相应的用户目标。落实到体验设计中，需要设计师充分考虑用户在操作路径中的操作权重（频率&停留时长），进一步以核心步骤为中心向路径两端延伸，完成页面布局。

如何分析和评估用户在操作路径中的权重呢？今天介绍一下，本人从统计学中借用的一个概念——正态分布模型，并将其应用到体验设计的流程中。

1 首先，什么是正态分布模型呢？

正态分布，也称“常态分布”，或高斯分布，是一个在数学、物理及工程等领域都非常重要的概率分布，在统计学的许多方面有着重大的影响力。

如果一个指标受到若干独立因素共同影响，且每个因素不能产生支配性的影响，不管每个因素本身是什么分布，它们叠加后影响的这个指标平均值就是正态分布。

如图：

标准正态分布模型

正态曲线呈钟型，两头低，中间高，左右对称因其曲线呈钟形，因此，人们又经常称之为钟形曲线。

标准的正态分布模型包含了中心极限定理的三要素，影响因素独立，因素影响程度随机但无法支配，各个因素之间是相加的关系。

中心极限定理三要素

当然，在体验设计中正态分布模型就没有那么复杂，而且用户的操作也不是随机分布。那如何在体验设计中如何应用呢？

接下来，介绍一下基于用户体验，提炼的正态分布模型。

如图：

体验设计中标准正态分布模型

总的来说，体验设计中的正态分布模型，是一种用来探讨用户在某一功能的操作过程（或产品的整个生命周期）中，操作频率（权重）所集中的区间与页面布局、信息架构之间关系的方法与思维。

这个模型涉及两个维度：

一是带有指向性的操作路径（步骤/功能模块），可以是一个功能的详细、单一的操作路径，也可以是一个产品从使用到停止使用的生命周期中，用户对整体功能使用流程；

二是频率，操作路径中的步骤或者核心功能被使用的频率，即权重。这个维度可以直观的反应出用户的关注重点和高频操作，便于后续的用户引导及页面布局等。

将用户的操作频率按流程顺序放置到坐标中，即可得到类似于正态曲线的图形，直观的反映出用户在功能步骤（模块）上的关注度。

2 体验设计中正态模型的类型

根据分析功能的颗粒度不同，得到正态分布模型的验证结果也不相同。

由此，体验设计中的正态模型，大体上可分为两类：

第一类是具体的功能（功能型），通过该功能的起始到完成，获得该功能高频操作及核心页面，可有助于功能路径优化及页面布局、功能排布，让用户更方便的获取高频操作。

第二是产品整体功能（产品型），通过用户从使用到停止使用该产品的全部路径，获取用户在使用产品时关注的功能，有利于明确产品定位、优化功能架构，在B端产品上还可以进行角色和权限的管理。

接下来，我们就详细探讨一下两种类型的正态分布模型。

2.1 功能型的正态分布模型

功能型的正态分布模型多用于优化产品功能及路径。这种类型的模型关注更加聚焦，结论也更加直接，甚至可以直接应用到设计方案上。因此在分析功能路径时，要简化相关联的分支路径，避免其对聚焦问题的干扰，使分析结论更加精准。

例如，一个手机TB的购物流程，如果要研究用户购买行为，就需要更多的关注用户对商品的选择、比较等操作，同时简化用户的支付操作路径；如果研究的是购物流程中用户的支付行为，就应该相应的简化用户选择产品的路径。

如图：

举例：淘宝购物流程分析

另外，这种类型分析结果的落地，需要格外关注功能操作路径的入口及其他功能的衔接，保证在更大层级上的操作不会出现断点，保证使用流畅。

2.2、产品型的正态分布模型

产品型的正态分布模型，可以看作众多功能型路径的简化提炼版本，忽略操作细节，着眼于业务在功能模块之间的流转，多用于产品定位升级或架构调整。这种类型的模型是将产品的拓扑图，按照用户从开始使用到停止使用的的操作路径（产品的生命周期），将其映射到坐标轴上，来直观表现出产品的核心功能。

如图:

产品型&功能型

其结果属于定性结论，在设计方案时更多的是参考意义，只有在进行产品定位迭代及架构调整时，才具有指导意义。因此，在不同场景下用合适的模型才能更具有说服力。

正态分布模型的可以应用到B/C/G等多种类型的产品上，根据不同类型的产品，该模型还会有其他功能的扩展。

例如，B/G端产品往往都具有长流程、多角色、多模块的特点，当正态分布模型在B/G端产品上应用时，还可以清晰凸显角色、权限的结构，有利于对用户权限和角色的定义与管理。

3 案例分析

在本人所从事的安防行业中，实时报警的处理是较为高频、且重要的业务功能。本文仅对功能型模型进行案例分析，希望该方法（思维）的表达更加清晰明确，也能够帮到大家。

3.1 业务概述：

实时报警的业务流程大致是这样的：在监控中心或岗亭，保安人员对园区的安防状态进行警戒时，如果有异常状况触发了报警，系统会反馈推送给安保人员，安保人员通过录像抓图等信息判断报警的紧急程度以及处理方式。

3.2 业务定性

该功能是典型的“海岛事件”，具有偶然性和急迫性的特点。所谓海岛事件，是本人对具有偶然性与急迫性特点业务的概括统称，后续可以写文章专门探讨该问题。

3.3  场景推演

安保人员每时每刻都全神贯注监管整个区域的安全状态，是不可能的，更何况这类海岛事件呢？所以，在发生报警时安保人员大概率处在“摸鱼”状态。

当有报警进入时，安保人员第一时间需要确认的是报警的类型以及位置，从而快速判断如何处理。只有当报警信息不明确时，安保人员才会进一步通过录像、抓图、关联的监控来进一步判断报警信息。

实时报警场景推演

3.4  报警业务处理的正态模型分析

在整个场景推演过程中，用户的关注重点是报警详情以及报警信息的确认过程，会有较少的概率查看辅助信息，因此需要保留辅助信息的入口。

如图：

3.5  方案展示

方案采用瀑布流式，高权重的关键信息拥有更高的页面权重，用户可以快速获取信息，以判断处理方式。同时，渐进式展示确认信、辅助信息，如抓图、录像、关联视频等，一方面可以减少对用户决策的干扰，同时能够快速获取这些信息，辅助用户做出判断。

由于方案涉及到公司项目，所以方案不方便直接展示，这里只展示页面信息布局。

我们都知道，在页面纵向布局上，随着视觉流的下移，用户的关注度会逐步降低，因此，在实时报警处理页面布局上，将从上到下信息的重要性逐级降低。

首先是实时报警处理的核心区，分为两个部分基本信息区与视频辅助区，这两部分信息是判断实时报警性质以及处理方式的主要依据。其中，基本信息区是最重要的，用户可以根据报警的基本信息，来确定如何处理报警。对于大部分的报警信息，用户可直接判断报警是否需要处理，或是进一步的确认及验证，尽可能的减少用户的操作；因此，报警的处理入口，紧随基本信息。

而视频辅助区是对部分报警的回放确认，是在查看基本信息后的进一步操作，频率相对较低，因此虽然属于核心区，但是层级却低于基本信息的展示。

辅助验证区放置的报警期间的连续抓图，可以满足用户的放大查看，进行报警辅助确认，随着用户视觉流下移，其重要程度迅速降低，相应的操作的步骤也较为复杂，页面视觉权重也有较大的压缩。

最后，对于极少的报警信息，用户需要通过关联视频的信息进行验证，可通过页面底部的关联视频入口，点击展开关联视频浮层，进行报警信息验证。这是整个实时报警的最后一个层级信息展示。

4 写在最后

正态分布模型不仅仅是一个工具、方法，同时，也是一种设计思维。

在设计之初，充分理解功能的定位，完善功能入口，让用户更容易触达产品的核心功能。然后通过核心功能向业务两侧进行延伸，进而覆盖整个业务，完成产品的框架与流程的构建。

在设计之中，关注高频的核心步骤，让用户的高频操作具有更简便的操作空间，把用户更想知道、更想操作的内容推送到用户面前，让用户在整个操作流程中的操作频率与页面布局的权重分布相匹配，而不是想当然。

只有这样，设计才更具价值，才能培养更忠诚的用户。

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

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

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

前言

一、体验度量怎么做？

如何确定方法？我们需要的是一个完整的度量框架，以及能够聚焦用户体验层为驱动，分解并有力的去解决问题。经过大量的实践和验证得到，抓住一个击破点作为产品体验提升的目标，并一种合理的方式进行推导和验证，这是一种最直接度量体验的标准流程性方式，这里的目标必须是：

• 体现用户主观感受或者具有行为驱动的目标。

• 基于业务目标定义+用户诉求了解后，得到的以用户为中心驱动的用户行为。

  
  

二、度量模型怎么选？

面对设计圈内已经存在的和部分大厂创造的度量模型，评估优劣后最终我们选取了HEART模型。因为HEART是个比较全面和具备更多扩展性的分析框架，同时足够的权威和标准，而且市面上的模型基本都被HEART的五维囊括。除了这些考虑因素外，再给出以下几个明显的优势点：

• 1、HEART同时涵盖了定性和定量的不同数据维度。

• 2、HEART框架同时包含了：宏观和微观的层面

• 3、HEART模型并不单纯的再定义体验质量，同时也链接了商业价值。把用户体验的原则和收益驱动的指标关联在了一起。

三、HEART模型简介

1.什么是HEART模型？

2.HEART模型的特性与应用场景

四、HEART模型的详细拆解指南

第一步：确定体验目标

整体的思路是：首先分析业务目标，并就业务目标所落地的产品服务的链路进行拆解，分析链路后，找到其中对体验有决定性影响的因素，提取其因素后，即形成体验目标。

1.确定业务目标

2.拆解产品链路

➢示例：商品素材搜索链路

3.分析触点并提取决定性因素

需要注意的是，决定性因素的选取必须在具体的触点中才有意义，脱离后无法判断是否有阻塞性影响。另外，某些设计因素是否是决定性可能在跨触点中体现出来，需要联系整个链路进行交叉分析确定。

4.体验目标的提取与表述

决定性因素“搜索结果的分类”，引申出的设计目标为“更清晰的信息层级”、“更完整的信息”。

通过链路触点的分析，决定性因素的提取，设计目标的匹配，我们已对设计优化方向有了准确的了解。这个时候需要从设计师视角做一个完善而精准的”体验目标“的表述。

第二步：确定度量维度

需要注意的是，HEART模型因其维度的广泛定义，不仅仅可用于体验目标的度量，也可以对产品目标、业务结果进行度量，对体验目标的度量因要从产品因素中剥离出体验问题，相对来说较为复杂，是本次叙述的重点。

第三步：确定信号

以度量维度为标准并引用体验目标确定信号

通过逐一对度量维度进行体验变量提取，有基础值则进行对比的方式，无基础值则使用趋势的表述方式，结合业务目标的情况下，去概念性假设体验目标的正向或反向结果，最终通过标准的格式提炼出信号，信号的提炼的可以用固定的格式进行书写： 格式：用户   用什么   做什么   体验变量   趋势&数值

寻找体验变量

确定信号的注意事项

第四步：确定指标

对数据进行处理

体验变量所直接产生的属于原生数据，而一组数据通过某种分析加工后，可以成为一个更有价值的信息，如均值、中位值。选择对数据进行哪种方式处理，受目标的影响较大，每一种数据处理方式，都有指向特征，通过与目标的匹配，可以选取出合适的数据处理方式。

确定指标的注意事项

五、总结

4.另外，除了准确的定位、度量、转化的逻辑推导外，参考业务目标进行范围收敛，也是非常重要的工作，它影响着每一个推导环节，以避免偏离产品方向，有效的过滤弱关联或无关联的因素。

文章来源：站酷    作者：酷家乐UED

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

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

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