1 列表
客服系统常规使用的列表由顶部操作栏、表头、表体、底部操作栏构成。表格是为可读性而生，所以表格的易读、易对比、易操作才是表格设计的首要目标。
1.1应用场景
（1）展示大量结构化的数据。
（2）需要对数据进行排列、搜索、分页、操作等复杂行为。
1.2设计原则
(1)易读性
1）表头。保证表头字段名称精简易懂，既能节省列表空间，又能减轻视觉压力。表头的固定功能也能够很好体现系统界面的友好性，尤其当表头字段过多，数据类型不好识别的情况，固定表头能够大大提升用户的数据浏览效率。
2）行高。较小的行高可以承载更多的信息，但会降低视觉扫描效果，适宜的行高更利于阅读。目前客服系统常用规格为36px行高，但有些数据量大空间小的专区，需要展示尽可能多的数据时，会考虑会采用24px或30px等小行高，需要基于场景的需求进行选择。
3）行排序。可根据字段以及列表内容的必要性配备排序、筛选、搜索等功能，方便用户快速筛选信息或进行信息对比查看。
4）斑马线。斑马线能够增强用户视觉的横向引导，尤其阅读较宽表格且数量还多的列表，可以避免表格内容过多时，出现错行的现象。
5）分割线。横向分割线能够减轻列表竖直方向的视觉重量，只要采用合适的对齐方式，纵向分割线的作用就可有可无。当表头字段内容少，且易于区分时，可以考虑取掉单元格的纵向分割线，弱化表格形式，便于横向信息阅读、信息获取和信息间对比的同时，又能够简化页面。当数据量太多或单元表格较宽时，保留纵向分割线帮助提升浏览速度。
6）列宽。尽量减少展示的列的数量，关注用户需要的必要信息，当表头字段过多时采用横向滚动条的形式，保证列与列之间足够的呼吸感。
7）自定义列。不同用户信息侧重可能会有所不同，可通过自定义列的下拉面板对列表内容自定义展示。
8）列对齐。标题和内容一般采用左对齐，更符合用户的阅读顺序。金额数值排列采用右对齐，既方便用户读取数据，又方便进行纵向数据对比。
9）空白格。对于无数据项用-占位，不留白。
10）分页。客服系统列表数据庞大，通常采用分页来缓解加载压力，相对用户而言，通常滚屏会比分页更便利，所以，若无展示数据量要求且一屏能展示完时，会尽量避免使用分页。
当使用分页时，考虑到用户的操作习惯，可让用户自定义每页展示数量。
11）特殊标识。对于用户关注的数据状态变化，可以采用一些符号标识，便于用户快速定位信息的同时，也能更加直观的呈现数据变化。如下图，通过不同颜色和方向的箭头来反映数据变化。
12）全屏。全屏展示能够避免和表格无关内容的干扰，提供沉浸式阅读体验，可根据场景需要配置全屏阅读功能。
13）操作项。对于用户需要进行业务办理或高频点击的操作栏可以固定在列表的两侧，更方便用户对数据进行操作。当操作项太多或操作项不常用时，可通过收起较低频操作项，来节省页面空间，保证用户阅读高效性。
(2)易搜索
1）条件查询。一般位于表单查询页面上方查询条件模块，当查询区域内容过多时，可展示第一行的筛选项，其余收起。
2）表头筛选。在表头单元格右侧增加筛选图标，点击后出现筛选覆盖层，根据不同筛选类别，配置相对应的表单组件，可快速查找数据。
3）标签筛选。将用户常用筛选条件或关注目标设置为默认选项，如时间、状态、范围，一般位于顶部操作栏或表头区域。
(3)易操作
1）单条操作。单条数据操作一般固定在列表左侧或右侧。
2）批量操作。当对批量数据进行相同操作时，沿着用户的操作路径，建议将此类操作按钮放至底部操作栏。
3）全局操作。当进行一些“导入、新增、导出、其他页面跳转入口”等列表的全局操作，或进行模糊搜索、条件筛选等操作时，建议将操作按钮放至顶部操作栏。
4）详情。可在操作里加“详情”按钮，也可将名称项做成可点击样式，跳转详情。
5）树形结构展示。无须用户进行页面跳转，展开父级节点即可查看子级列表内容，一般控制在三层以内。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
B端全称是Business即商家（泛指企业）的产品，通常是企业或商家，为工作或商业目的而使用的系统型软件、工具或平台。相对于C端产品，B端产品对业务逻辑和产品逻辑要求会更高。
本篇笔记将罗列B端设计过程中的核心设计思维和高频设计要点，结尾附上大厂设计规范链接。供大家下载查阅。
设计开始要了解设计的目标，用户的行为都是有「目标动机」的，B端产品的业务目标往往都是为了为企业或个人为了解决某一项工作上的问题。
当设计过程以「目标」为出发点，可以增强设计判断力，输出更有效设计解决方案。
B端产品的设计原则：提高使用者的工作效率，同时降低业务链路的操作及学习成本。
当你有了目标以后你的设计就可以围绕这个目标展开：
对于B端的产品而言，用户最关心它能为实际的工作带来哪些便利，而并非这个界面做的多么的好看，以及用户体验多么棒。所以B端产品设计价值优先级往往是 功能性＞表现力
B端产品设计需要站在整个业务线全局角度去把控各个设计点，不再是「用户体验」至上，为实现「任务目标」，「牺牲」一部分「用户体验」是必要的，这个时候视觉和一些体验就不那么重要了。通过调研业务去了解各个角色职能的工作流程、相关痛点，让产品能用，好用。
理想的B端设计需要了解业务目标以及业务链路中每一个环节的过程。将业务逻辑理解透彻再考虑应该如何进行设计实现。
这样做的原因当你站在使用者的角度进行同理心设计可以更好的帮助用户完成他要完成的工作，从而提高效率。产品原型一般基于「功能」本身，而设计师从用户实际场景规划用户的任务流，可以优化产品逻辑，补全缺失场景，通过了解业务流程也能给予创造性解决方案
B端产品往往是是服务于企业用户，用户画像需要专注于用户特征中的「群体职业身份」这类人无论性别、年龄、地区有何差异，他们都是一类角色，我们的产品要提供给这类角色使用，而不是某个人使用。
由于B端设计师不是产品的用户，无法沉浸在与用户相同的真实场景中，建立共情。所以设计师最好亲自感受一下业务流程，获得一手的用户洞察，
「通过业务人员交流」业务人员可以帮助我们快速高效的描绘出典型客户案例的用户画像。
「实地走访」：观察在自然状态下用户如何完成工作任务，并提问题：「你怎么做？」或者「为什么这么做？」
「建立种子用户群」：聚集活跃的种子用户群，收集意见和建议，并在群里验证设计想法。
「亲身体验」：成为真正的客服小二，接听客户电话，记录自己在工作台场景下的真实体验和感受。
获取用户画像后了解该群体背后工作感受，行为习惯，以及任务类型。
安全感和信任感建立：人们越来越关注隐私和信息安全。如果你要求必须填写敏感信息，请确保使用字段下方的注释文本解释为什么需要这些信息。
实际工作中我们曾经自动获取过用户之前表单中填写的的支付类账户信息，在收集的用户反馈中，用户会感觉到隐私正在泄露并让用户信任感降低。所以即使用户输入体验会更好，但是考虑到信任感，敏感类信息请不要自动获取。
让用户感受到你正在帮助他操作：Jakob Nielsen于1994年提出的十大可用性原则中，其最后一条原则Help and documentation（帮助性指导原则）是搭建B端用户帮助体系的核心准则，在理想情况下，没有帮助文档就可以使用系统是最好的，但在某些情况下（尤其是B端系统），提供一些引导性的帮助其实是必要的。
B端系统中可以尝试搭建用户帮助系统：
对B端产品来讲，设计师在设计的时候是不需要耗费太多的思考的，只是去按照交互设计师的规划堆砌图表和列表。但是对于使用者来讲，其中纵横交错的商业逻辑和业务逻辑却是给用户搭建了一个十分高的门槛。
例如修改资料的时候，使用弹窗、浮层等等交互操作会减少页面跳转的频率。
但是与此同时，减少页面跳转并不代表真正的高效，例如瑞幸的供应商系统，供应商所产生的订单需要按照指定的流程一步步进行操作确保不会出现问题这样虽然页面的跳转增加，但是可以避免操作出错给用户带来更大的困扰。
设计要根据用户的浏览习惯和视觉动线。要尝试引导用户的视觉，举个例子，如何引导：
B 端产品是以业务为核心，是需要用户长时间操作并完成工作任务的，对于操作和展示内容无关的元素，越少越好。视觉为功能让步，追求简洁、清晰、克制、理性的视觉风格。设计语言尽量做到不干扰不打扰。
输入顺序：先易后难；先必填后选填；先公开信息后隐私信息；有关联性的合成一组，特殊问题后置，用户输入时、不会觉得突兀、门槛太高 。
自动对焦（PC端）进行表单页面，自动对焦第一个输入字段可以引导用户开始进行输入。
标题：标题是对下文最短最精的概括。用户一般都会跳过表单内容，而且几乎都不会仔细阅读那种特别详细的描述。所以用最少的文字说清楚一个表单的目的尤其重要。
用户应该可以看一眼标题就知道他们应该怎么做，而不是非得把剩下的全部看完，
（附：这部分感兴趣的同学可以搜索“微文案设计”）
在表单编写方面，或者说各种写作中，删减词语都要比添加词语更加有益。 在仔细检查不必要的词语后，文章会更笃实，更连贯，更吸引人。
这个链接有什么用？关闭是点击右上角的按钮吗？如果并没有增效，那就是减效。每一个字，每一张图片，都不是100% 必需的，这些都会降低你表单的转换率。
删除一个字段，表单提交率就可以提高 26%。（本篇笔记原本有12000余字，为了避免浪费大家时间，我仅保留4000余字的高频要点内容）
PC端产品提示文字尽量不要放在框内
提示文字存在于框内常用在移动端，它的空间占比很小，对移动端的小屏来说，是非常友好的，但如果在交互上处理不好，会有很大的缺陷。
内部标签结构，只有提示性文字，用作提示用户应该输入什么内容，但用户在输入的时候，内部的标签/提示性文字就会消失，这时候，用户会失去它是否输入准确的唯一判别标准。
字段输入通过部分人工智能自动将操作步骤可以变得简洁高效 ，也包括诸如一些、自动定位、图片识别、自动获取，第三方导入等方式来使用户的效率得以提升的功能。
打字是在线表单中最耗时、最密集的部分，而且经常会导致错误——尤其是在手机上。用按钮、滑块替换文本框并使用自动完成功能，将减少工作量并提高转化率。
文本块会更容易让用户记住内容：例如银行账户、电话号码等等。它指的是将信息排列成「块」的过程，使内容更容易保留、处理和回忆。一份研究声称数字 3 是帮助人们吸收和回忆信息的神奇数字。
如果一个字段需要特定的格式输入，请告诉用户。例如密码要求、语法规则、编号间距等等。
可以用输入框长度提示用户输入的内容是否正确。
德莱厄斯研究所的可用性研究发现，如果一个字段太长或太短，用户开始怀疑他们是否正确理解了标签。
在用户输入的时候，右下角告诉用户已经输入了多少字，如果超过 80 字后会变红色，用来警示用户，并且此时的表单域也无法输入新的内容。
如果用户填写错误，向用户显示错误发生的位置，并说明原因。
如果你的表单里的选项少于5个可以列出所有选项供用户快速选择，当大于5个时候可以尝试用下拉框解决。
将第一个选项作为用户最有可能的默认选项，且是最安全的选项，提前预判用户的操作提升选择效率。排列方式推荐数直排列，竖直排列相对于水平排列容易读取和定位，提高用户的浏览顺序。
当前需要用户填写相对隐私的信息时，请给予解释这么做的原因及目的。
完成表单的设计后可以给业务用户进行简单的测试，并记录他们填写的时间收集反馈，以及对这一连串的问题他们体验如何。这也将有助于你下次评估表单的设计。
最后在情感化设计系统里记得感谢用户填写或者反馈问题，因为用户是花时间的。所以请表示感谢。
表格的设计围绕着「可读性」和「易操作」两个设计原则。设计易读，易扫视，易比较，易操作的表格结构是表格设计的首要目标。
列宽有三种常见处理方式：
1. 根据内容的极限长度给出足够的固定宽度；
2. 可以固定部分列的宽，其余列按百分比处理；
3. 列宽需要考虑最低宽度/最大宽度/文字极限状态，内容为空状态显示方案；
4.需要设置列之间的最小宽度，表格响应式布局情况下最小不小于此宽度。
M-Densign规范中对齐方式会遵循如下规则：
表格的排序，应从用户目的出发，遵循用户查看数据的习惯，尊重数据之间的关联性，设计用户查看、操作数据的路径，而非随机排列（这部分可以在业务侧调研时验证，提高用户体验和阅读效率）。
1. 文本信息/混合型文本左对齐，符合从左到右的阅读习惯；
2. 数字信息右对齐，方便数字之间的直观对比；
设计规范需要定义按钮的四种状态：正常状态(Normal)、悬停状态(Hover)、激活状态(Active)、加载状态(Loading)、禁用状态(Disabled)
B端产品的开发一般涉及多个开发团队协作，例如瑞幸的后台修改按钮颜色，都可能牵动10+工程师的协同。
所以B端产品在进行设计改版以及设计侧调整时候要思考调整对于业务侧是否有直接帮助，在设计和规范建立之前，切勿频繁改动。
除了完全独立设计开发的项目以外，还有大量的 B 端项目是采用第三方框架开发而成的，如 Ant、Element 等等。这是因为这些第三方程序可以帮助团队节省大量的开发时间和精力。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
很多时候既让初入B端行业的设计师感到一丝丝迷茫，因为不同的B端系统也就意味着，它的业务一定就会有所不同。比如CRM系统当中的客户生命周期管理，OA的办公自动化，特定的行业往往都会蕴含着不同的业务类型
而作为设计师，如果只了解设计模式、设计组件，不去分析设计最后的业务诉求，其实是没有任何意义。因此想要通过B端设计指南，和大家一起聊聊B端业务，以及背后所牵涉的具体逻辑。今天就简单聊聊最为常见的 审批
开始之前，还得再多说两句，因为一个系统当中，业务本身就不是独立存在的。因此在去讲述审批的过程，一定会涉及到 流程、权限、表单配置 等一些基础内容，建议可以先做初步了解，再结合文章进行阅读
虽然在说起源，其实我更想给大家讲清楚 审批在B端系统 当中的重要性
审批字面意思是审查并加以批示，通常指对 下级呈报上级的公文进行审查批示，报请上级审批
现如今，任何事情一定都会有分工协作，而使用审批的好处是可以
规范员工行为
提高企业运转效率
系统存档便于溯源
保护环境（毕竟减少了纸张浪费）
当然在不同的阶段的公司，对于审批的诉求是不太一样
小公司：因为审批的决策路径短、流程上都非常简单，但因此就会缺乏规范保障。比如在外出办公时，看似只需要与老板当面进行口头上的沟通即可，但是在外出出现意外时，由于缺乏外出办公的相关证据，员工的权益则很难得到保障
大公司：因为审批的决策路径长，流程上都极其复杂，因此会在多人协作下完成整个流程审批。比如想要申请购买办公用品时，会由 行政、Leader、财务 层层审批，从提交审批到最终落实可能需要十天半个月，但是这样的流程，能够确保企业在清查财务状况时，更加有理有据
审批的演变，就是从最开始的规章制度而来。比如在早期去政务机构办理各种业务时，会让你去填写各种纸质表单。在审核过程中，则需要有各个机关的盖章及批准，而这种形式正是政府对于普通市民的自上而下的管理方式
审批其实是整个B端系统的灵魂，因为在B端系统当中，企业想要使用系统的一大痛点便是 核心的管控
因此你会发现，只要一个独立的系统，一定会存在独立的审批模块。因为B端管理系统当中企业的最终目的，是管理手中的人，而审批便是最为常见的一种手段
审批在如今的B端系统当中，可以理解为它是一组消息，在这一组消息当中会有：“具体的文本、对应的附件、以及照片视频”这些内容都是辅佐 申请人 去讲诉你需要申请的内容
比如我们在申请病假时，往往需要出示 三甲医院所开设的证明，对于这个证明，如何在表单当中出现，你会发现最为常见的便是拍摄证明图片，然后上传到表单当中（这个与字段属性紧密相连，我就不做不过介绍）
审批的这组消息还会有些特殊，因为它非常重要，你可以理解为它是一则“加急消息”会提醒审批人快速的进行处理，同时会告知相关的参与人（处理人、抄送人）审批的进度、并且无论成功与否，都会在系统当中留下 足迹，因此它起到了 “追踪、通知、留存” 三个非常重要的作用，我们首先对于审批进行一个基础的拆解
如果把审批单独拿出来，你会发现审批会牵涉到 发起人、处理人、抄送人
审批的发起人，也是整个审批流程的归属人，他最关心整个审批进展
因为在发起人的角度，创建完审批事项后，可能还需要进入审批页面，完善 后续附加信息、及时了解审批状态、催促审批人的审核、处理驳回意见 等等，因此站在发起人的角度，审批需要尽可能详细的展示 当前审批的状态、完整的审批流程、驳回信息的快速操作、成功信息的必要通知
审批的处理人主要在审批过程做出决策，因此他更在乎的是审批申请内容的信息。比如 审批的信息内容、直接的审批操作、多条审批的管理
当然，在一些大型的集团企业当中，会将审批分为审批「直接处理人」与「间接处理人」（后文以 直处人、间处人 简称）
「直处人」作为审批的第一处理人，也就意味着他的意见至关重要，如果「直处人」通过过后，相对而言整条审批的通过几率会大大增加。通常「直处人」是作为申请人的直系领导居多，因此多数情况下可以理解为直属领导进行 “把关”
「间处人」作为审批的后续处理人，同样在流程当中也十分重要。但在有些情况下，比如一些偏平化管理的企业，「间处人」更多像是“权利”的象征，因为权利已经下放给「直处人」，而「间处人」起到知晓审批以及企业的规章制度要求
审批抄送人主要起到通知对应角色的作用，因为一条审批的出现，会造成诸多影响，假设今天你需要申请事假，如何通知同部门的其他成员呢？
发送即时消息，显得过于简单；每个打电话，又有些麻烦；发送企业邮件，又怕他们没有看到
这时候抄送人会显得尤为关键
通常抄送会有企业流程上管理员配置的固定抄送人，以及发起人选择的自行抄送人 两种类型
固定抄送人 角色通常与管理员配置整个流程有关，他是角色当中 管理员 所配置的重要通知人，比如今天你的请假信息，肯定会告知行政，像这类默认的通知流程，则可以将其设为固定抄送人
自行选择抄送人 则是提供给发起人自行选择，该条审批可能会影响到的相关人群。比如就是发送给同事，让他们知晓今天你不在岗位上，因此自行选择可以增加审批抄送的灵活性
这里肯定会有很多读者会问，我选择抄送人与我发消息给同事，有什么区别么？
看似完全相同，实则有明确的区分
通过消息，将审批内容传达，本质上是你自行将内容发送给对方，对方会对于你这个消息的真实性会产生疑问？你是否通知了
而选择抄送，更为权威，更能体现你这条消息的真实性，并且整个流程都已经由领导进行批准，因此不会存在太大问题
其实审批的本质就是一组消息，而这一组消息当中，申请人 通过 表单配置 去获取需要补充的消息内容，而流程会根据企业所配置的流程方式将这一组消息进行合并转发给对应人，而审批人则需要对这一组消息进行回复“通过、驳回” 来让整个流程继续延续
审批当中，最主要的便是流程。因为你可以通过查看流程图，去了解整个企业的组织架构、规章制度、员工管理方式
串行审批主要是指当一个审核节点通过后，才能进入下一个审核节点。如果节点驳回，则可以根据业务实际需要，配置驳回的返回路径，会有：拨回到发起人、驳回到上一个节点、或驳回之前任意一个节点 重新审批
并行审批是指一个审批节点存在多个角色同时审批，这里会存在两种情况
任何一个人审批通过，则可以进入下个节点，这也就是系统当中常说的 「或签」
所有审批人员通过，才能进入下个节点，这也是系统当中常说的 「会签」
条件审批就是将企业当中的规章制度映射到实际的项目当中，通常就是某个审批内容会根据 金额多少、实际数量 等 进而选择哪个角色进行审批
比如销售人员在申请一个合同审批时，会根据合同金额的不同，审批人也会有所差异
当金额小于8000时，合同直接由财务专员进行审批，进而让流程进行快速审批
当金额大于8000时，合同会由销售主管进行审批，让销售主管能够掌握企业的重要合同
通过发起人选定一个审批事项后，将自主选择后续的审批内容，进而实现审批的后续选择。这是一种较为灵活的审批流程，当企业尚未形成标准化流程时，自主的核心就是当发起人发起一个审批，提交时需要自行选择下一个环节的审批人。而下一个环节的审批人审批通过后，可以选择继续流转到再下一个人去审批，或者结束这个流程
审批的背后，它映射的其实是企业的一条条管理制度，而它的设计一定是要满足企业的实际需求。因为你负责的产品不是为某一家企业提供的服务（定制化产品），并且企业管理制度的变动其实是家常便饭，你需要去考虑一个通用的解决方案，这个解决方案拆解下来会分为三个内容，分别是：申请表单、流程配置、更多配置 进行讲解
审批表单是最为一个“简单”的用户可配置化表单，因为现如今大多数B端产品都是以 SaaS 作为基础（如果是定制化产品 它的审批内容、流程也不会是固定不变的）也就意味着审批表单需要为企业提供“DIY”的方式，通过表单提供不同的字段类型，去构建审批的实际要求
比如在一个选择请假时，年假、事假、病假、婚假 等的要求都会有所不同
如何知道他们的差别，其实可以根据《劳动法》的相关规定 以及 各个其实的实际公司制度，进行个性化的处理
在申请婚假时，需要上传你的结婚证，以证明其真实性；在病假时，需要有3甲医院的病情证明；在年假时，则需要有你的剩余年假天数。而这些特殊诉求，其实都需要在表单当中进行各种定制化表单
当然这只是极为常见的 请假 场景，而在实际业务当中的复杂场景（更多需要将 审批与其他系统关联）一个简单的表单是没有办法进行满足
这也是很多企业会发现，无论是飞书、钉钉、企业微信，都没有办法满足其实际流程需求。又没有办法改变自身流程，只能够自研、定制化 产品，这也是为什么即便各行各业都有了初具规模的 SaaS 产品，但是还是会有很多企业愿意自行研发软件
企业可以根据自身的系统流程，在流程配置当中去定制特定的流程。在这个页面的设计上，需要注意不同参与人的状态，以及复杂流程时如何才能够进行清晰的阅读，因此增加了 颜色区分（发起人、审批人、抄送人）+ 视图缩放 功能
颜色自然不必多说，整个系统需要统一，因此不能够只考虑在管理后台的颜色，是一定要在详情页当中也能过保证颜色的一致。这样才能够满足实际业务所需
视图缩放只是小小提一下，常见的视图缩放会放在左侧，至于为什么，自己稍稍揣摩揣摩
由于流程配置的属性页面会涉及很多表单的复杂逻辑，这个只能够留在我的 训练营的课程 当中进行拆解，这里就不过多赘述
更多配置项则是审批在实际情况下的特殊处理，比如：申请人修改审批的具体时间、能够将审批转发给其他人、出现多次相同的审批人是否去重 等等... 其实就是将审批的设计方案进行“赋能”，去满足更多企业在实际场景当中的需求，感兴趣的同学可以去 钉钉、飞书 了解详情
审批，核心还是提高企业运转效率，如果在审批之间，还需要不同角色私下反复沟通，本质上就失去了审批的意义。而审批本身，就是一个典型的B端产品 从场景到需求，进而研发功能，最后又回归场景，你设计的好与坏，落地到真实的场景当中，试试便知
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
作为设计师，日常工作中我们经常要思考如何吸引用户转化。如果仅把“界面设计美观”作为设计的发力点，很难形成完整的判断链条，完成预期的商业目标。因此，在交互行为层面尝试“破解”用户行为发生的背后原因，通过科学的方法“设计用户行为”就变得更加重要。
行为设计领域有三个非常重要的模型：福格行为模型，成瘾性模型以及峰终效应。其中福格模型在辅助我们做行为预判的过程中扮演了重要角色。
福格模型是以耶鲁大学教师 Fogg，2009 年发表的一篇论文为中心，阐述了任何一个行为的发生，都需要满足以下三个要素：
任何一个行为的发生，都离不开3要素：动机、能力和触发器。因此在设计时需要考虑：
人们是否有产生行为的动机、发生行为的能力，以及一个合适的触发点。
高动机高能力
这类用户有付费动机且熟悉产品使用流程，属于高价值用户，是产品的真爱粉。在后续设计过程中，我们可以收集用户反馈，并针对问题改善体验就行。
高动机低能力
这类用户需要降低门槛，必要时可以提供帮助和引导。提高操作能力，优化用户体验。例如一些应用为低能力群体设计“专属版”，如针对老年人，推出适老版应用，精简用户操作步骤，突出核心功能，便于这部分用户完成产品主流程操作。
低动机高能力
这类用户需要提高动机，可以结合马斯洛需求层次理论找出用户不同阶段的需求。分析用户需求，挖掘用户痛点，寻找用户动机。例如“分享领取大额优惠券”、“每日签到送积分”、“走路得能量”等，我们可以同过激励来增强用户动机。
低动机低能力
这类用户需要适当放弃，投入产出比较低，不属于我们的目标用户。
本次将以 “为家人购买保险” 的优化过程为例，分享运用福格模型把行为设计和商业场景联系在一起。通过设计引导用户行为进而助力产品转化。
背景：
用户在为自己成功投保“医疗险”后，会为本人再推荐一份其他险种的产品，打造“完善双重保障”的概念。但某年龄段岁下的用户因保费过低，在收入来源中属于ROI较低的群体。
产品目标：
希望该年龄群体在为自己购买完保险后，优先推荐为“家人购买”，因其所获得的商业价值效益更大。预期通过为家人购买保险，拉动这部分用户的整体ROI。
设计目标：
引导用户为“家人购买”一份“医疗险”
用户已经为自己购买过一单保险的情况下。大部分用户具有健康保障需求，其本身也有购买保险的动机。在模型中偏向于“高动机”人群，
本次设计的发力点：强化这部分用户“为家人购买”的动机，降低购买保险的行为成本，同时在适当场景给予用户触发提醒。
我们一般通过两种途径增强用户的行为动机：心理刺激和物质刺激。
1.营造稀缺性：通过限时限量等方式营造稀缺性。
2.强化“家庭健康保障”需求。安全需求是人的基本型需求。通过“父母有保障，我更安心”等文案迎合用户对安全生活的向往。
3.显示社会认同信息。寻求社会认同是更好一层的心理需求。通过标签外露承保公司名称，寻求社会认同，并侧面透传出专业性，建立用户信任感。
“物超所值”，便会促进行动。在顶部向用户宣传为家人买的“产品优势”，增强付费动机
我们可以通过降低用户门槛，来提高用户完成这件事的能力。
1.降低门槛—降低用户成本（金钱）
1元为父母升级,降低用户参与成本。
2.降低门槛-降低操作成本—简化选择（时间）
根据业务目标，指定最优推荐策略。如本次流程最优推荐策略是为父母购买，去掉可能影响用户决策的其他选择项，改为仅显示最优推荐策略下的唯一指定模块。
3.降低门槛-降低认知成本—结合图像（精力）
“ 产品适用群体图片+文字”的表达，在当前情景下可快速传递信息。便于用户快速理解当前流程是在“为谁购买保险”，从而降低以往用户将“家人身份信息填写错误”的情况发生。这样设计减轻了用户的认知成本，提⾼了信息传递的效率。
1.触发器“醒目”
胶囊形状的「提交订单」按钮在“方形卡片”上十分醒目，是触发用户行动的视觉提醒。
简洁按钮文案设计，如“限时升级”，将有助于加速用户的决策，从而促进转化。
在日常工作中，可以借助福格行为模型解决商业目标中的引导、转化、留存等问题。在做设计时，我们首先也需要思考设计目标 ： “我们想要用户发生什么行为？”
我们可以通过福格模型从“动机、能力、触发因素”等角度进行设计思考，更加深入的理解用户行为背后发生的原因和影响用户决策的因素，帮助我们更好的完成产品优化和体验升级，最终达到商业目标。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
定量研究指的是对用户的某些特性进行数字化测量并进行统计研究。对于定量研究来说，数据的统计以及数据的分析是尤为重要的。
首先，需要说明数据修养，与统计技术的水平无关。
数据修养指的是培养科学的、正确的对待数据的态度，在收集、分析和解读数据的过程中做到求真务实。
良好完善的研究设计是正确进行数据分析的前提，如果没有科学的设计，良好的数据质量，那么无论用什么方法和软件都无法获得真实的结果，统计就变成了“数字游戏”。
从预期的研究结果出发，向前逆推数据分析方法和研究设计
Step1 · 要解决什么问题
Step2 · 期望得到的研究结果
Step3 · 需要的统计分析方法
Step4 · 需要的数据类型
Step5 · 对应的调查方法
Step6 · 研究的设计
在问卷开始前将问卷框架设计做好
线上问卷调查是目前我们所用到最主要的调查形式，进行线上问卷调查时，误差的主要来源包括抽样误差和非抽样误差两类。
抽样框误差：抽样框误差产生于目标总体与抽样框的不一致，因抽样框引起的误差主要有样本的代表性问题（如是否能代表网民、是否能代表某类用户总体等）以及抽样框重复（用户重复回答）以及抽样遗漏（如无法包括竞品用户等）。
解决方案：正确界定网络调查的适用范围，网络调查应主要针对以网民为对象的项目。
无回答误差：样本中的部分个体不愿意或是无法完成调查问卷而产生的误差，原因：
（1）激励手段不够，缺乏交流。
（2）技术障碍，如网速不稳，浏览器不兼容。
（3）对隐私的顾虑。
解决方案：网络调查与抽样技术相结合，进行问卷投放跟踪（如提醒用户填写），或者结合有一定激励性质的产品运营手段。
计量误差：计量误差又称登记误差，是指由于各种原因使得调查和计量的结果与真实情况不符而引起的误差，如，问卷歧义，被调查者对调查内容定义和概念误解所造成的误差。
解决方案：科学设计调查问卷，要求调查问卷更易于理解、更加完整、更具有亲和力，保证被调查者做出准确而真实的回答。
是指用户对一种产品或服务进行消费体验后的感知，与其期望值进行比较后，所产生的的一种心理状态。
1974年，本田公司就进行了有关客户对汽车评价的调查，但是当时没有“顾客满意”的概念。
1989年，美国密歇根大学商学院质量研究中心的费耐尔博士将计量经济模型引入顾客满意度测评建立了费耐尔逻辑模型，得到广泛的应用。
20世纪90年代后期，CS（顾客满意度）理论已成为在全球工商界开始盛行的一种新型的企业文化和管理哲学。
与此同时，许多国家（地区）先后对顾客满意度指数测评的理论、模型和方法开展了全面深入的研究。
对事物的特性变量可以用不同的规则赋值，因此形成了不同测量水平的测量量表。基本的测量量表有四种：类别量表、顺序量表、等距量表和等比量表。顾客满意度指数测评中应用的五级李克特量表就属于其中的顺序量表。一般采用的五级态度是：满意、较满意、一般、较不满意和不满意，相应赋值为5、4、3、2、1。也可为相反的顺序，将五级态度在题目开头给出，然后让被访者根据对每个测评指标满意程度直接在相应的方框上打钩或者画圈。
顾客满意度指数测评体系反映测试对象的质量水平状况和特征，而每一测评指标的变化对顾客满意度指数变化的影响程度是有所不同的。反映影响程度的重要尺度是权重，权重的确定与分配是测评指标体系设计中非常关键的一个步骤，对于能否客观、真实的反映顾客满意度起着至关重要的作用。
即以同级指标集内重要程度最小的指标为基础，其他指标与之比较，作出是其多少倍的重要程度的判断，然后逐一分析，得出各指标的权重。
我们将重要程度分为非常重要、重要、比较重要和不重要四个等级，把所要比较的指标配成对，然后一对一地对指标的某一特征进行比较，做出重要程度判断：
a、当A与B比较时，A非常重要，B不重要，则A=4，B=0；
b、当A与B比较时，A重要，B比较重要，A=3，B=1；
c、当A与B一样重要，则A与B分别记为2。
是美国著名运筹学家赛迪给出的1~9标度法，它根据各测评指标的相对重要性来确定权重。层次分析法可以通过测评指标两两比较，使复杂的无序的定性问题能够进行量化处理。
主要作用是分析顾客满意度指数模型中各结构变量之间的关系，分析顾客满意度指数主要受什么影响，从宏观上如何进行调控才能更有效提升CSI。具体来讲，就是在百分制的计分方式中，因变量变动1分，直接影响到后面结果变量变化的分值。
如图中所示，产品质量提高1分，将直接影响顾客满意度提高0.36分，结构变量除了这种直接影响外，还可以再模型中箭头所指的方向上产生间接的影响。如图中顾客期望除了对顾客满意度的直接影响是-0.11外，还通过顾客对质量的感知和顾客对价值的感知对顾客满意度产生间接影响，间接影响系数的大小可以由所有从顾客期望到顾客满意度的路径上的系数乘积的累加和表示，计算方法为：
（-0.41）x0.94x0.26+（-0.41）x0.36+（-0.01）x0.26=-0.25
顾客期望对顾客满意度的直接影响系数和间接影响系数相加可以得到全部影响系数，即（-0.11）+（-0.25）=-0.36
同理，可以计算出其他结构变量对顾客满意度的直接影响系数、间接影响系数和全部影响系数。
如果能将竞争对手的指标分值也进行路径系数分析，那么多企业的战略决策制定，为推进企业发展将会更具有实际指导意义。
可用于分析顾客特征的类型，例如（1）价值取向型。（2）质量取向型。根据不同顾客的需求和体验，提升其满意程度。更有利于精细化运营。
进行顾客满意度研究，其主要目的，就是要不断提升顾客的满意度，从而建立更多的忠诚顾客群，为企业带来更大的利润和收益。通过“顾客净推介值”分析，我们可以进行顾客忠诚度的深入分析、研究，以在这方面能提供更多的数据给企业作为经营的决策参考。
“顾客净推介值”（NPS:Net Promoter Score）,顾名思义，“顾客净推介值”指的就是公司现有顾客将公司的产品或服务向其他人推荐的程度如何的测量。这也是预测企业有机增长和区分公司“利润良性”和“不良利润”的一种手段。
分析假设：我们可以把企业的利润分为“不良利润”和“良性利润”两种。
“不良利润”是以损害客户关系为代价换来的利润。如果客户觉得所受到的待遇不周，则产生的利润就是不良的。即不良利润是通过降低客户体验的质量来省钱，是向顾客榨取价值而非创造价值。
“良性利润”则截然不同，如果客户自愿回头购买更多产品与服务，而且还建议其他人购买，这样公司便实现了良性利润。实际上，满意的顾客变成了公司营销部门的一部分，即他们成为了推介型客户，是公司的最佳营销员。
例如：
根据本次调查，我们的问题是“您有多大的可能推荐此产品呢？”这个问题作出评价，并把被访者分成三类，即“推介者”（90分~100分）、“消极满意者”（60分~90分）和“贬低者”（0分~60分）。用推介者所占百分比减去贬低者所占百分比，就得到顾客净推介值。
受行为科学家赫茨伯格的双因素理论的启发，东京理工大学教授狩野纪昭（Noriaki Kano）和他的同事Fumio Takahashi于1979年10月发表了《质量的保健因素和激励因素》一文，第一次将满意与不满意标准引入质量管理领域，并于1982年日本质量管理大会第12届年会上宣读了《魅力质量与必备质量》的研究报告。该论文于1984年1月18日正式发表在日本质量管理学会的杂志《质量》上，标志着狩野模式（Kano model）的确立和魅力质量理论的成熟。
双因素理论又称激励 — 保健理论，是美国的行为科学家弗雷德里克·赫茨伯格提出来的。双因素理论认为引起人们工作动机的因素主要有两个：一是保健因素，二是激励因素。只有激励因素才能够给人们带来满意感，而保健因素只能消除人们的不满，但不会带来满意感。
第一，不是所有的需要得到满足就能激励起人们的积极性，只有那些被称为激励因素的需要得到满足才能调动人们的积极性。
第二，不具备保健因素时将引起强烈的不满，但具备时并不一定会调动强烈的积极性。
第三，激励因素是以工作为核心的，主要是在职工进行工作时发生的。
保健因素 - 是指造成员工不满的因素。保健因素不能得到满足，则使员工产生不满情绪、消极怠工，甚至引起罢工等对抗行为；但在保健因素得到一定程度改善以后，无论再如何进行改善的努力往往也很难使员工感到满意，因此也就难以再由此激发员工的工作积极性，所以就保健因素来说：“不满意”的对立面应该是“没有不满意”。
激励因素 - 是指能造成员工感到满意的因素。激励因素的改善而使员工感到满意的结果，能够极大地激发员工工作的热情，提高劳动生产效率；但激励因素即使管理层不给予满意满足，往往也不会因此使员工感到不满意，所以就激励因素来说：“满意”的对立面应该是“没有满意”。
（1）A—魅力质量要素：此质量要素具备时，会让顾客感到满意；反之未具备时，顾客也能接受，同时不会感到不满意。
例如说，海底捞等桌做美甲。
（2）O—一维质量要素：此质量要素具备时，会让顾客感到满意，反之未具备时，则会导致顾客不满意。
例如，火锅店羊肉越便宜越爽，上网的速度越快越爽。
（3）M—必备质量要素：此质量要素具备时，顾客认为这是应该的，反之未具备时，会导致顾客不满意。
例如，火锅店要有牛肉，手机能打电话。
（4）I—无关质量要素：此质量要素无论具备与否，对于顾客，都不会有任何满意或者不满意的感觉。
例如，山寨机可以刮胡子。
（5）R—反向质量要素：此质量要素具备时，会导致顾客不满意，反之不具备时，顾客反而会感到满意。
1、判断产品的某一质量特性对于顾客而言，属于何种质量要素
“顾客就是上帝，但是用户往往需要的不多，想要的却太多，为了让他们更满意，我们是不是要一一满足他们？”
2、通过满意的敏感性分析来筛选顾客满意度的改进因素
“用户可能根本不知道他们想要什么，而我们能提供的东西很多，但是资源却是有限的，应该怎么利用有限的资源来使用户更加满意”
Step1，定义质量要素
Step2，构建卡诺问卷
Step3，进行问卷调查
Step4，分析调查结果
Step5，筛选改进因素
列出需要使用卡诺模型问卷进行调查的指标，这些指标可以是满意度所涉及的系统指标体系中的所有指标，也可以是关注的部分指标。
“官网中xxx方面的信息”
“产品中的xxx功能”
“线下户外广告宣传”
“......”
卡诺问卷的设计思想是从正反两方面进行提问，以便了解顾客对某一改进因素的看法，然后将这些改进因素区分为“魅力质量要素”、“一维质量要素”、“必备质量要素”、“无关质量要素”和“反向质量要素”.
在卡诺问卷中，每个改进因素都由正向和负向两个问题构成。正向问题是测量顾客在具有某项因素时的反应；负向问题则是测量顾客不具有该项改进因素时的反应。卡诺问卷中的问题答案采用五种程度选项，他们分别是“我喜欢这样”、“它必须这样”、“我无所谓”、“我能够忍受”、“我讨厌这样”。无论是正向还是负向问题，都是同样的答案选项。
问卷调查的方法有很多，卡诺问卷并没有限定必须要什么方法调查，例如，入户访问法、拦截访问法、传统访问法、计算机辅助等等。
在获得了每个改进因素的卡诺需求分类数据之后，分析调查结果，分析调查结果的目的是为了了解每个改进因素的顾客需求分类状况。需求分类最简单有效的方式是计算每个改进因素在不同需求类型中出现的频率。
将顾客对某项改进因素的正向和负向问题的答案填入卡诺评价表，就可以得到顾客此项因素的需求分类：
如果顾客对正向问题的回答是“我喜欢这样”，对负向问题的回答是“我讨厌这样”，那么在卡诺评价表中，这项改进因素就被分类为“O”，即“一维质量要素”。
如果顾客对某项因素正负向问题的回答结合后，分类是M、A、I或者R，那么该因素就被分别分类为“必备质量要素”、“魅力质量要素”、“无关质量要素”或者“反向质量要素”
另外，卡诺评价表中的分类“Q”，是指有疑问的（questionable）结果，顾客的回答一般不会进入到这个类别，除非这个问题的问法不合理，或者是顾客没有很好的理解这个问题，或者是顾客在填写问卷时出现错误。
对改进因素的顾客需求进行分类，还不能完全说准确的说明这些因素的改进次序，因此，还需要通过满意的敏感性分析来筛选改进因素。
满意敏感性分析是指通过对各种改进因素的满意影响力和不满意影响力的分析，来判断顾客对这些因素满意水平变化的敏感程度，其目的是确定改进哪些因素会更有利于提升顾客满意度。
满意敏感性分析是通过满意影响力（SI）和不满意影响力（DSI）两个方面来测量的，他们的测量公式如下：
满意影响力（SI）
满意影响力SI是以魅力质量要素A与一维质量要素O的频率之和为分子，以魅力质量要素A、一维质量要素O、必备质量要素M、无关质量要素I的评率之和为分母计算得到的，满意影响力的大小显示，如果某项因素得到改进，顾客满意强度会有多大的提升。
不满意影响力（DSI）
不满意影响力DSI是以一维质量要素O与必备质量要素M的频率之和为分子，以魅力质量要素A、一维质量要素O、必备质量要素M、无关质量要素I之和为分母，并乘以（-1）计算得到的，不满意影响力的大小显示，如果某项因素未满足顾客的需求，会对顾客满意的降低产生多大的影响。
将各因素以SI值为横坐标、DSI值为纵坐标纳入改进满意因素敏感性比较矩阵中，同时以左上原点为圆点，用半径为0.707的四分之一圆弧将不同的改进因素进行分割，如下图：
在因素选择线右侧的因素就是需要实施改进的因素，并且离圆心越远的因素，顾客的满意敏感性越大。从图中可以看出，A和D因素暂时不需要改进，需要改进的因素为B、C、E和F方面，按照重点次序排列为F、E、B、C。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
是指通过测量眼睛的注视点的位置或者眼球相对头部的运动而实现对眼球运动的追踪。
是一种能够跟踪测量眼球位置及眼球运动信息的一种设备，在视觉系统、心理学、认知语言学的研究中有广泛的应用。PC/IPHONE/CAR都可使用。
在获取信息时，眼睛停留在所加工的物体上，称之为“注视”，超过100毫秒，认知加工。
在转移加工对象时，人眼在两个注视点之间的快速动，称之为“眼跳”，注视点或注视方向发生改变，获取时空信息，无认知加工。
当测试者与眼睛存在相对运动时，为了保证眼睛总注视这个物体，眼球会追随物体移动。眼球追随物体移动，有认知加工。
眼动的本质 = 人注意力资源的主动或被动分配，选择更有用或更有吸引力的信息。
记录测试者在整个体验过程中的注视轨迹，从而可知测试者首先注视的区域、注视的先后顺序、注视停留时间的长短以及视觉是否流畅等。
用不同颜色来表示测试者对界面各处的不同关注度，从而可以直观的看到测试者最关注的区域和忽略的区域等。
考察测试者在每个兴趣区里的平均注视时间和注视点的个数，以及在各兴趣区之间的注视顺序。
例如：用户视觉顺序
问题：确认按钮位置不符合玩家浏览路径。
分析：图中是玩家的视觉动线，玩家先看见确认按钮再看见选择角色区域，这不符合操作顺序，很可能导致有些玩家忽略了选择角色。
建议：调整一下角色选择的版面布局，可以考虑将确定按钮放在选择角色之下。
例如：眼动注视时间及频率分析（客户管理软件的导航可用性评估）
测试用户的注视时间统计见表1，可以明显发现两个版本在眼动注视时间区别：用户在使用旧版的系统时，注视的时间比较长；
测试用户的注视频率统计见表2，两个版本在眼动注视频率有明显区别：用户在使用旧版系统时，注视次数频率比较高，无规律性；
通过注视时间、注视频率和方案评价等级的对比分析，可以得出评估等级越低（数值越低表示满意度越高），用户眼动注视时间越短，用户在页面搜寻的频率相对越少，用户在较短的时间内能找到想要的功能，页面影响用户的干扰越小。
例如：网站的可用性对比测试
对某网站改版前（图7）和改版后的主页（图8）进行可用性对比测试，通过让用户浏览首页（不做任何点击）判定网站的主旨和类型，来捕捉用户注视点的轨迹图和记录用户在不同位置注视时间，对比网站主页改版前和改版后信息传达的有效性。
经过对采集到的数据进行分析，可发现用户在浏览改版前的页面时，眼动轨迹混乱，扫描路径长且很多相互交叉，注视点序列分散排布，用户注视点变换快，无明显的兴趣点，如图这些数据表明改版前的网站首页布局不够合理，没有重点。
1、可以让用研工作变得越来越有技术含量，将会在用研工作中扮演越来越重要的角色。
2、但是需要加以辅助测试（如定性访谈）来收集更多的实验数据，并通过结合分析来得出更多、更有效的结论。
1、眼动研究是可用性测试、问卷调查、后台数据挖掘等研究手段难以企及的，因为是最直接的反馈用户使用情况的手段。
2、通过眼动研究，不但可以完整地还原测试者在各个页面的注视轨迹，还可以通过划分兴趣分析测试者在各区域内容的关注度。
3、眼动研究提供的信息不只是人们是怎样“看”东西这么简单，眼动反映了人脑的信息处理过程，眼动模式的特点与脑部的信息处理都有密切的关系。
当用户打开一个页面，用户看了些什么，没有看什么。什么东西最先获得用户的关注？这些信息是很重要的，因为很多时候用户关注的东西与设计希望用户看到的是不一样的，这种差别会通过眼动数据直接显示出来。
在可用性测试中，遇到用户既无动作也不说话时，研究人员是最为迷惑的。此时用户很可能执行任务受阻，而通过实时的眼动记录观测，研究人员可以间接地了解用户的处境 - 用户是在寻找什么东西，还是有什么东西令用户困惑（来回注视），还是用户忽视了相关的重要元素？研究人员可以带着观点假设，开展眼动研究来验证或否决，发现导致问题的真正原因。
呈现眼动研究结果最常用到的是热点图，顾名思义，热点图呈现的是人们视线的热点，颜色越红代表被聚集的越多。作为可视化手段起到了良好的信息传达的作用。
不同的波形代表着不同的心理信息，比如：
频率为8~13Hz（平均数为10Hz），幅度为20~100μV。它是正常人脑电波的基本节律，如果没有外加的刺激，其频率是相当恒定的。是大脑皮质处于清醒、安静、闭目状态时脑电活动的主要表现，睁开眼睛（受到光刺激）或接受其它刺激时，α波即刻消失。
频率为14~30Hz，幅度为100~150μV。是大脑皮质兴奋的表现，当精神紧张和情绪激动或亢奋时在额叶出现此波，当人从噩梦中惊醒时，原来的慢波节律可立即被该节律所替代。
频率为4~7Hz，幅度为5~20μV。在成年人意愿受挫、困倦、失望、抑郁等情绪刺激时以及精神病患者中这种波极为显著。但此波为少年（10－17岁）的脑电图中的主要成分。
这些不同的波形反映了测试者所处的心理状态。
一般来说，原始的脑电波需要一些技术处理才能读懂，借助脑电数据分析工具，我们可以把复杂的大脑波形整理成有一个起点，然后是不同波形分布的杂合：
经过更复杂的技术处理，我们甚至可以得到一条总体的波形图：
脑电波（EEG）在医学领域已经应用了几十年，通过对脑电信号的处理与分析，我们能了解对象的认知过程和情绪反应，目前已经逐步商用化。
近些年，神经营销学、神经电影学楷书走进人们的视野。前者通过脑电波等手段测量消费者观看广告、描述产品时的脑电情况，以此来解释、预测他们的消费行为。后者采用脑成像技术等手段量化恐怖电影的效果，甚至考察观众们神经活动的同步性（群体卷入性）来检查电影控制人们思维和情绪变化的能力。
基于认知神经科学，无需语言，获知他们对产品的情绪、喜好、关注点、兴奋度...因为它研究的是大脑的源头。
除了学术界，全球众多顶尖的游戏公司公认情绪在游戏中的重要性，并致力于打造更加Emotional（情绪化的）游戏。
并不是越积极越好
必须能够唤起强烈的情绪反应
让玩家情绪不断波动，正负情绪互相转化
一款成功的游戏：必须要让玩家达到沉浸和心流情绪状态。有三种衡量指标：
定义：参与、融入、代入感的程度
游戏体现：故事性、技巧性、策略性、画面效果、音效、风格
心理体验：强参与感、脱离现实、忘记时间、很上瘾
情绪体现：强烈的正负情绪的交替
游戏引起玩家的情绪反应。积极的情绪反应体现玩家玩的非常开心，而消极情绪反应可能提示游戏让玩家产生了受挫感。
定义：非常专注，非常有动力的全身投入，并非常享受的精神状态。
游戏体现：游戏机制、难易度平衡、目标性、反馈。
心理体验：持续专注、忘我投入、成就感。
情绪体现：正向情绪为主，正负形拨动；紧张感积累，完成挑战的成就感。
游戏带给玩家生理上的紧张程度，SCL值越大，表示游戏越刺激，玩家玩的越紧张，而SCL越低，表示游戏可能给玩家带来了相对无聊的体验。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
“复杂是世界的一部分，但它不应该令人困惑，好的设计帮我们驯服复杂，不是让事物变简单（如果复杂是符合需求的），而是去管理复杂”--唐纳德·A·诺曼
与复杂共处，这是一个有趣的话题。在这个奉行“少即是多”的时代，设计师对于复杂噤若寒蝉，认为优秀的设计应该简洁明了，若无必要，勿增实体，而复杂则常备被视作失败设计的标签。设计师为了保持设计上的简约挖空心思，甚至试图通过削弱功能的方式来降低产品的复杂度，得到自己想象中的完美设计。然而一味追求“简单”的设计真的符合用户的实际需求吗？从心理学的角度来看，复杂的事物往往功能强大，而功能强大意味着更好的服务与更高的价值，用户也更愿意为之付费。当我们购买商品时，我们会仔细斟酌，拿着产品的功能列表反复比对，这个时候我们忘记了产品复杂与否，更多考虑的是功能是否满足自身需求。
对于大部分B端产品而言，复杂或许难以避免，复杂是出于实实在在的业务的需要，而非某位设计师的错误喜好。B端产品之所以给人感觉会相对复杂，是因为产品需要完成复杂的工作任务，界面内承载的信息内容较多，在视觉上会带给用户压力，直观感受上觉得产品很复杂。但是这些信息又都是必需的，如果缺少这些必要的信息，会对用户理解和使用产品造成阻碍。就如同飞机的驾驶舱，密密麻麻的按钮如此复杂，但是每一个按钮都有着相应的功能，不可或缺。既然复杂难以避免，那么作为设计师我们不应该被动接受或盲目拒绝复杂，我们应该学会如何与复杂共处，去尝试驯服复杂、管理复杂。
相信很多设计师和我一样，经历过现代主义浪潮的洗礼，对于简约的设计有着或多或少的偏好。因为这种偏好，在自己进行设计时也希望能够选用这种风格，在设计时刻意的去追求界面简约，却忽略了界面上的简约不等同于产品易于理解和使用。从心理学的角度上看，复杂的事物更容易理解，简单的事物反倒令人困惑，一味的追求简单反而会让事物变得复杂。
B端产品的目标是降本提效，追求简约的设计思想在B端产品的设计中并没有那么适用，为了提升用户的操作效率，我们需要将一些能够帮助用户理解的信息与常用的操作直观的展示给用户。这会在一定程度上增加界面的复杂度，但是相较于产品视觉界面会因此变得复杂，产品的易用性和操作效率对于B端产品而言会更为重要。
与复杂共处的前提是能够理性地看待复杂，复杂本身的含义即非褒义也非贬义。复杂描述的是事物的状态，它在词典上的解释是拥有很多即错综复杂又相互关联的组成部分的事物。产品复杂与否是由产品本身所从事的业务和需要完成的任务来决定，就像我们不能要求一个做机械结构设计的工程软件做得像一个图画板一样简单，因为两者的功能需求不是一个层面的，所以我们也不能单纯的将产品简洁还复杂作为评判一款产品优秀与否的标准。
我们之所以对复杂怀有畏惧，其实更多的是畏惧令人困惑的复杂，复杂与困惑有着本质的区别，理解他们之间的区别很有必要，复杂描述的是事物的状态，而困惑表述的是用户使用产品时的心理。复杂的背后可以拥有规则与逻辑，理解这些规则和逻辑，能够帮助我们理解和使用产品。而令人困惑的产品往往缺少这样的内在规则与逻辑，用户难以理解产品的运转机制，需要花费很大力气才能完成有效操作，容易让用户产生挫败感。产品可以是复杂的，但是不应该让用户困惑。
在很多复杂的传统线下业务数字化转型的过程中，为了让产品易于使用，设计师需要深入到一线，去了解真实用户在线下业务场景中是如何处理日常任务的，在流程线上化过程中也需要遵循这样的业务流程，这样能够让用户更快上手，而如果我们在设计过程中不去参考用户在线下的操作场景，按照自己的想法去意测用户的行为，这样设计出的产品背离了用户的心理模型，缺乏内在逻辑，会让用户感到混乱困惑，陷入深深的麻烦。
基于产品本身功能需要，我们可能无法很主观的去降低产品的复杂度，这就需要我们在进行产品设计时花费更多的心思，通过对业务流程、页面布局、信息呈现上的调整与设计让产品变得清晰，不让用户陷入困惑。如下图的关于表单编辑器的A\B两种设计，用户在编辑器内完成一系列针对表单的编辑、配置操作，然后发布表单。方案A中将这些表单编辑配置项通过tab进行排列，这种方式结构简单，但是扩展性较差，过多的栏目也容易让用户陷入困惑，不清楚需要完成哪些配置项才能进行发布。方案B中采用了步骤导航加侧栏导航的双层导航结构，在步骤导航上给出完成表单编辑配置的主要步骤，在大的步骤下用侧栏导航承载小的编辑项，结构清晰，且能够对用户编辑表单提供一定的帮助指引。虽然两种方案信息内容上都一致，视觉观感上甚至方案B更为复杂，但是方案B在这里可能是更合适的方案，因为方案B在配置流程的指引上更为清晰，也更贴近用户心理模型，即使没有使用过在线表单的用户也能理解产品流程，因而用户能够更容易的完成表单配置并发布表单。
我们在使用产品时，都会有一个大概的心理预期，会认为某一类型的产品会较为复杂，某一类型的产品会相对简单。为什么我们会有这样的认知呢？是因为我们知道这些产品大概有哪些功能，而这些功能就决定了产品的复杂层度。产品的复杂程度由产品的业务与功能决定，而不是依照设计师的自我喜好，像如淘宝、京东这类的购物网站、拥有着很多的栏目，所以淘宝、京东的界面相对来说较为复杂；而像百度这样的搜索引擎功能相对来说比较简单，所以界面设计相对简单干净。
我们可以容许一个功能强大的产品设计得相对复杂，但是一个功能简单的产品设计得复杂难用就是一个灾难。作为设计师我们需要根据产品的实际需要来进行设计，即不过度设计，也不执着于追求简约，而是基于需求恰到好处的进行设计。
复杂的产品会有好的用户体验吗？答案是肯定的，用户体验的好坏与产品是复杂还是简单并没有直接的关系，很多时候复杂的产品也能带给我们良好的用户体验，在互联网产品中，我们可以看到很多复杂的产品，这些复杂的软件产品，一点点的改变着我们的生活与工作方式，让我们生活与工作变得便捷与高效。
首先可以看看我们的国民级电商应用淘宝，乍看淘宝的界面，可能会觉得十分复杂，甚至会给人一种眼花缭乱的感觉，但是包括我在内的许多人仍然十分喜欢逛淘宝。淘宝内除了有本身的淘宝、天猫店铺外还有专做海淘的天猫国际，做社区团购的淘鲜达，专做拍卖的阿里拍卖等数十个板块，业务繁多，功能复杂，但这几乎很难改变，因为之所以做这些业务和功能背后都有着商业上的考量。从交互设计的角度看，虽然淘宝的业务和功能繁多，却有着清晰的布局、信息对齐、内容组织，产品尽管复杂，但并不令人感到费解和困惑。购物流程也与用户在线下购物流程相仿，贴近用户的心理模型，用户容易了解产品功能、容易与之交互，整体上有着良好的用户体验。
又如我一直在使用的一款笔记软件Notion，Notion相对于印象笔记、有道云笔记而言更为复杂，需要花费一定的时间成本学习才能够从容上手使用，但是这并不妨碍Notion被众多使用者所追捧。Notion的很多功能在使用之前，甚至都不会想到会出现在一款笔记产品里面，如甘特图，多维表格等，这类功能一般出现在项目管理类软件中。而Notion块结构的布局模式，让笔记能够自由拖拽，拥有了极强的自由度，用户可以很自由的用各种各样的形式来记笔记，要是你肯再花一些心思，你甚至可以在Notion内搭建一个个人专属网站来记录的学习知识，打造个人专属知识库。将我们习以为常的线性笔记思维，转变成纵向思维，甚至是网格状思维。Notion无疑是复杂的，但是这样做是为了给用户提供的强大功能和极高的自由度，这些功能恰恰也切合了用户的需求，创造了一种全新的笔记体验，带给用户愉悦的使用感受。
简单是产品追求的最终形态吗？其实未必，很多时候产品设计的过度简单反而会给用户带来麻烦。为了追求简单的设计，不可避免的就需要隐藏一些信息或者拉长操作路径，这是一个权衡的过程，我们在做设计时也会经常面临这样的抉择，是追求视觉上的简约美观还是信息传达准确性与操作上的效率。给用户一个简约美观的视觉感受无疑很重要，人们对于美的事物往往更有耐心，也更愿意去探索。但是对于一款针对B端用户的效率软件、办公应用而言，准确的传达信息，帮助用户进行判断，频繁使用的功能设计得更高效便捷，这些点能带给用户更实际价值，也是我们在设计产品时应该优先考虑的点。
特别是在一些专业性的软件中，如果我们为了追求简约而弱化或者省略掉一些关键信息，还有可能会导致用户错误操作的出现，造成严重的后果。试想一下当你在使用软件编写一个计算字段时，软件提供给你了计算公式却没有就近给你提供计算公式的解释和用法示例，导致你因为书写上的不规范使得计算结果频繁出错。这时你可能会满怀愤怒的抱怨为什么产品会如此难用，为什么不能配置过程中给到更多的反馈与帮助信息来减少配置错误的发生。
前面我们了解了关于复杂的定义，认识了复杂与困惑之间的区别，也明确了在B端产品中复杂或许难以避免，复杂是出于实实在在的业务的需要而非某位设计师的错误喜好，既然复杂无法避免，我们就应该学会与复杂共处，管理与驯服复杂。那么如何与复杂共处呢，有一些策略或许可以给予我们一些思路。
复杂与困惑的本质区别在于复杂的背后隐藏着规则与逻辑，而困惑缺少这样的规则与逻辑，让人无法预测与揣摩，对应到软件产品的设计，一款成功的优秀的软件产品，应该是易学易用、能够满足用户预期，用户能够直观的理解产品的流程与主要功能，并通过产品实现自己的目标。那么具体到软件的设计上我们应该怎样做呢？
这里可以看看我们团队正在使用的研发管理工具TAPD，TAPD是一款敏捷研发协作工具，凝聚了腾讯研发方法及敏捷实践精髓，其中敏捷开发的方法就是TAPD的内在规则与逻辑，有过敏捷开发经验，理解敏捷开发流程的的开发人员能够快速的上手使用TAPD，对于不了解敏捷开发的开发人员也可以通过产品帮助中心学习敏捷开发思想，进而理解产品的功能与流程，因此虽然TAPD功能与页面结构相对复杂，但是基于对敏捷开发的认识用户还是能从产品复杂的功能界面中摸索出一条操作路径，实现自己的目标。这就是产品拥有内核思想以后能够带来的直观好处，将原本零散的功能点通过特定逻辑链接成操作流程，帮助用户更好地理解与使用产品。
相同的在我们公司自己的一个项目中我们也运用了同样的方法，在我们公司之前研发的一款crm产品中，为了给用户提供最佳的销售实践，帮助用户更快上手使用我们的产品，我们在设计产品时寻找了硅谷蓝图团队做了顾问咨询，并依照硅谷蓝图的销售转化路径来构建我们的产品体系，确定产品功能，梳理产品中的业务流程。并希望在以后为客户做实施的过程中能够将硅谷蓝图的销售方法一起带给用户，让用户能够更好地使用我们的产品，实现产品的最高价值，为中小企业销售团队赋能。
通过前面两个案例其实我们可以感受到，当一款复杂的产品有了内在的规则与逻辑以后，用户理解和使用我们的产品会变得更顺畅，用户不会迷失在茫茫的功能之中，通过理解规则与逻辑，用户能够对自己操作结果有一个大概的预期，而不是处于困惑状态，作为设计师的我们也可以将这种规则逻辑作为我们设计的引导，让我们的设计更为系统和有条理，让产品不再是一堆功能的堆叠，各自为战。
复杂是用户的一种心理感受，用户觉得产品复杂除了产品本身结构信息复杂之外，也是因为产品在设计上没有贴合用户的心理预期，用户很难理解产品的流程与交互，所以贴近用户心理进行设计就显得尤为重要。这里我们需要先了解三个概念，实现模型、表现模型和心理模型，三个概念的释义如下：
实现模型：产品是怎样工作的
心里模型：用户认为产品是怎样工作的
表现模型：通过设计来让用户认为产品是怎样工作的
表现模型越接近心理模型，用户就越容易了解产品功能、容易与之交互。表现模型越接近实现模型，用户越难理解产品，产品就越难使用。复杂产品在用户体验过程中的痛点在于用户需要花费时间学习或培训之后才能了解产品的运转机制，很多B端产品在设计时更多的偏向于实现模型，用户在使用产品的过程中会发现很多地方的交互和自己心理预期并不一致，使用过程中会遇到很多的阻碍，影响整体的使用体验。对于一款复杂的产品而言，我们需要让我们产品的表现模型更接近于用户的心理模型，这样用户能够更容易了解产品的功能，并与之交互。
大家使用电脑时有没有遇到过类似下图这样的电脑报错信息，里面是一堆的专业名词，看得人一头雾水。这时候我们能做的只有默默的打开百度，去了解弹窗里面讲的内容究竟是什么，了解后才明白原来这样，然后按照百度上操作步骤一通操作，侥幸解决了问题。但是当下次我们遇到相同问题时，可能还是不知道如何解决，无可避免还是需要求助百度。这个就是表现模型贴近与实现模型会带给用户的困扰，用户不是专业的开发者，他们不了解也不需要了解产品背后的实现逻辑，这对用户而言是没有价值的，给予用户这些信息不能对用户起到预想的帮助作用。贴近实现模型进行设计会让用户与产品交互变得困难，变相的是在人为的增加产品的复杂度，与复杂共处，我们需要学会贴近用户心理进行设计。
复杂的产品往往功能、页面繁多，如果页面内的视觉元素以及交互各自为战，那么放大到整个产品就是一个灾难，不仅是产品给用户感官上不统一、整体性差，过多的交互模式也会增加用户的学习与记忆成本，用户在这些相视功能但是不同的视觉与交互的模块之间容易陷入困惑，对用户使用产品造成困扰。针对这个问题，现在越来越多的公司开始通过搭建组件库的方式来规范自家产品内的视觉与交互，一个规范完整的组件库的确能够在很大程度上解决产品在视觉与交互上的一致性问题，通过模块化解决方案，也能降低冗余的生产成本，实现产品快速开发。因此很多人也认为搭建好组件库就能一次性的解决产品体验一致性问题，但实际上就算一个产品有了一个自己的组件库，依旧还会遇到体验上统一性问题，这是为什么呢？
在原子化设计理论中，粒子是构成页面的最小颗粒，粒子构成简单组件，简单组件到复杂组件，再到区块、页面。虽然用组件能去构建页面，但是还会遇到页面结构、交互不一致的问题，设计师各自使用组件去搭建并不能提升我们的效率和解决设计一致性的问题，在末端设计并没有做到约束。因此我们在构建好组件以后还需要继续抽取出了页面级的组装结构和交互模式。
这里我们拿B端产品中常见的列表页来举例，纵观所有后台列表页面，抽取后无非就分为这么几个区域。不同的业务可以通过基础组件和样式定义符合自己业务线的子模块。比如列表页中的筛选区，在不同的业务场景下，对筛选器的需求也各不相同，简单的可能只需要使用标签选择就能够完成筛选，复杂的可能添加很多的筛选项甚至选项之间还有且或关系，我们需要根据实际的业务场景设计适合的筛选器，但是需要注意的是一个产品中用到的筛选器形式不应太多，我们需要抽取归纳出三四种筛选器形式去覆盖我们产品内所有的筛选场景。来保证产品内不会出现各种相识却有各不相同的筛选器。
B端后台产品中比较常见的还有表单，我们可以归纳出产品内可能会使用到的表单类型，然后定义出具体的框架结构与交互，在具体的设计过程中在根据实际情况选用不同的表单区块。
一种常见的信息录入以及信息展示表单，这种形式是我们最长用。
分布表单适用于信息录入项以及信息展示项过多，在一个页面内已经不能合理清晰的组织传递信息，或者表单内容的录入方式或者展示方式存在较大差异，不适宜在一个页面内进行展示时。按照布局的不同也可分为横向步骤和纵向步骤两种。
组合表单因其结构能够承载更多的信息，每一个栏目都可以承载一个独立的表单页，有效的管理信息。
很多时候我们也会用弹窗来承载表单，好处是交互衔接流畅，不用跳页。
将产品中类似的区块做成最佳的交互模式范例，能够最大的程度的规范我们产品中的交互，这样才能真正的实现产品体验上的统一，化繁为简，让复杂的产品也能够调理清晰，上手简单容易。在面对复杂的系统级软件时，在统一组件样式的基础上还应该统一产品内的交互模式。
复杂的产品页面内信息往往都特别繁多，如果不做好信息归纳，用户将很难把握住重点内容，信息获取效率低下，十分影响用户的使用体验，所以信息的强弱的整理十分重要，那么什么样的信息是对用户而言重要的信息呢？
信息设计大师爱德华·塔夫特认为优秀的视觉设计应该是“将清晰的思考视觉化”，他还认为只有充分理解观看者的“认知任务”及一些设计原则才能设计出优秀的产品。
如何找到对用户真正重要的信息需要借助到产品设计中一个十分重要的工具--用户模型，通过调研的来得用户模型是对于我们产品客户的抽象归纳，通过用户模型我们可以确定哪些功能对于用户而言是高价值的重要内容该重点突出，哪些内容相对不是那么重要可以弱化处理，通过对于页面内容强弱的划分，用户能够更快的获取到对自己有用的内容，尽管页面仍旧复杂，但是信息划分合理、层级清晰、表意明确的页面人就能够带给用户良好的用户体验，帮助用户高效的处理任务。
复杂是产品的本来特性，本身不含褒贬，但是如果复杂不加以控制，让其发展为困惑与混乱，这对于一款产品而言绝对不是一件好事情，这样即使产品功能上很优秀，用户也无法长期忍受，一旦市场上出现替代产品，那么忍受已久的用户也将抛弃产品转向体验更好的新产品。
曾经我也是一个极简主义的追捧者，但是经历过越来越多的设计项目，我开始发现某些产品复杂性是必需的，将产品做得简单并不是其核心诉求。真正需要处理的问题也不是复杂，而是混淆的状态和由此产生的无条理性。解决的方法不是简单的去除几个界面元素，让其在视觉界面上变得简洁干净，而是要让产品拥有内在规则、一致且能够被理解。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
用户体验地图（Experience Maps）旨在通过描述用户历程和故事，使设计师、产品经理等项目成员更好地了解用户和洞察诉求。所以对于用户体验地图，我们可以将其定义为以下内容：
- 是一种描述用户故事的可视化工具；
- 是一种帮助设计师、产品经理等更好地了解用户的共创工具；
- 从用户视角出发，直观展现产品流程各个触点上用户的痛点、需求和情绪；
- 用户体验地图绘制的形式并不唯一，可以根据项目需求，增减内容。
△ 途家 App 用户租房 · 用户体验地图案例
通常在接触到需求之后，设计师就可以开始梳理现有流程、使用用户体验地图了。要注意的是：
- 需要梳理的功能不分大小，都可以使用；
- 做之前，务必要先调研和访谈用户使用产品的情况。
建议时长：
- 重要项目：120～180 分钟- 日常项目：60～120分钟
参与者：
- 必选：设计师、产品- 可选：研发、市场、其他
工具：
- 电脑或白板+便利贴
需要发现和拆解产品现有问题，梳理用户流程时使用用户体验地图，可以在聚焦阶段，整合用户诉求和业务诉求，共创机会点，找出解决方案，通常在以下场景中使用：
- 新产品设计：需要对需求进行拆解和优先级排序；
- 产品优化：发现产品现有问题，洞察设计发力点。
由此可见，在设计过程中使用用户体验地图作为设计工具，有以下益处：
- 更好的以用户视角来看产品的体验；
- 通过共创，项目成员达成共识；
- 确认触点，作为我们的设计方向；
- 通过用户痛点找到机会点；
- 帮助梳理产品流程。
△ 用户体验地图共创现场
我们通常会将流程分成4 个阶段：定义原则和目的 —— 梳理阶段流程 —— 洞察痛点 —— 寻找机会点。
1. 定义原则和目的
首先要了解我们做用户体验地图的原因和目的，包括用户是谁、解决什么问题、用户的目标、产品的整体目标、限定条件等等，对用户群体、整个项目背景和共创任务目标有清晰、全面的认知。
2. 梳理阶段流程
首先是划分阶段，将用户的行为拆分成几个大的阶段，在整理时要注意：
- 在整个产品的范围之内尽量把故事、流程讲完整；- 以广度优先，而非深度，不要过早的沉浸到细节中。
接下来我们要将主要阶段拆分成单个任务，并梳理具体的任务和触点，罗列出过程中的任务和各个触点，要做到事无巨细。
然后根据任务和触点，整理对应的用户疑问、用户感受/情绪。通过对用户的观察和访谈进行梳理，客观的描述事实，切勿自说自话或是将自己的情绪代入其中，也不要急于猜想与分析。
3. 洞察痛点
这一步需要我们汇总用户的痛点，并将痛点分级，洞察用户痛点背后的真实诉求。这个过程中可以先让大家在一定时间内写出自己的想法，每一条写在一张卡片上，做到先相互不干扰，之后再统一整理和总结。
4. 寻找机会点
通过上述总结，思考新的机会点、解决方案、优化整体流程，并对新流程下的功能做优先级排序。可以通过准备一些问题来刺激大家脑爆出更多的内容，比如：用户还有其他选择么？怎么做用户才能更爽？其他用户来到这里该怎么处理？等等。在这个阶段需要：
- 对内容进行对标、讨论，把公认的点保留下来，无用的点剔除出局；- 根据实际情况和项目成本、进度等条件，对新流程下的功能做优先级排序。
在实际的工作过程中，因为项目时间都非常紧张，绘制这样一个完整的用户体验地图比较耗费时间，所以推荐大家几个提效的技巧，既可以减少时间浪费，也可以提高共创质量：
1. 事前
充分做好用户调研，提前准备好用户地图模板，可以在开始之前的一到两天发给参会人员，让所有人对产品有一个整体梳理和思考，有助于提高大家的产出质量。
2. 事中
如果是优化的产品，可以将设计稿 demo 或者线上产品截图打印出来，这样可以增强大家的代入感，有利于想法的输出。
3. 事后
整理电子版体验地图，需要跟随产品的演进进行更新，上传到项目共享空间随时查看。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
在 B 端设计领域中，不管是内部用户、产品、设计师、开发，还是外部产品、设计师等，总能听到关于界面「屏效」方面的诉求或吐槽。
「屏效」狭义理解是「界面过度留白」；广义理解，「屏效」源自谐音“坪效”，指的是每坪的面积可以产出多少营业额(营业额/专柜所占总坪数）。而「屏效」对于界面而言可以指屏幕单位时间、单位面积内的信息可以带来多少商业效益/效率提升。
为了探索在 B 端产品中用户为何对「界面过度留白」或「屏效」问题如此敏感，于是我们展开了「屏效」专题的设计探索与实践。「屏效」专题探索主要以「探索」与「实践」相结合的方式展开，将实践过程中反复验证有效的设计策略沉淀成设计手册，同步将部分功能进行工程化，确保可以开箱即用。
用户声音｜不同的故事相似的诉求
面向内部设计师和终端用户投放的《高屏效诉求》《中后台产品满意度调研》问卷中认为提高屏效能极大提升用户体验的设计师占 58.14%；认为提升屏效对体验有提升的终端用户占 50.6%。
外部知乎上针对《Ant Design 4.0 设计价值观》的 13 条反馈里，其中就有 2 点提到关键字「效率」。
通过了解不同用户和产品类型发现，不同的用户在工作场景的产品使用中有着相似的特征：
案例收集｜发现问题，大胆假设
纵观 B 端产品界面，发现普遍问题和收录在解决屏效问题上实践得比较好的案例，为了逐步突破问题，选择以数据产品中覆盖率极高的表格为设计切入点，通过线上跨产品多端地毯式的体验走查，发现表格三个层次的问题：
视觉、交互层在无需理解业务场景和用户目标的情况下，都较容易发现，属基础问题，但很多「过度留白」的屏效问题往往是信息被组织方式的差异导致的「过度留白」。
综上我们提出假设：为提高屏效，可从视觉、交互、信息三个层次解决
视觉层为提高信息查阅速度，可以通过提高信息密度；交互层为提高操作速度，可以缩短当前手势到目标之间的距离；信息层为提高信息被理解的速度，可以通过重组织等方式。
基于假设，我们进行了进一步的桌面研究，查阅论文等书籍，寻找设计理论的验证和指导。
竞品分析｜寻找实践证据，谨慎验证
我们知道视觉上界面留白过多（过疏会增加滚屏成本，过密因易串行而影响阅读效率），以表格「行高」为例，探索各表格在字号、字高和行高的关系，因为不同字体的同字号实际像素高度会有差异，因此选择的是字高（即文字垂直高度的视觉大小）而非字号或字行高，决定留白的两个重要因子是字高和表格行高，以次推演，界面元素和元素间距的留白关系，探究在视觉层怎样的留白率能保证甚至提升屏效。
以数据产品中的表格为例，通过直接和间接竞对的方式，分别从数据的查阅（视觉）、分析（交互）维度进行功能点和设计细节上的比对，来看看优秀产品是如何解决屏效问题。
直接竞对：内部用户口碑较好的产品 A、B外界竞对：同领域的 Tableau、网易有数、金山、微软表格；间接竞对：谷歌邮箱、AntD 等的紧凑主题的常规列表（一维表格）
通过竞品分析可以发现，数据分析领域的表格留白率普遍较低（信息密度高），尤其是金山和微软的电子表格，其次是同类面向数据用户的 Tableau、网易有数，而谷歌邮箱等工作台常用的常规列表紧凑版本中，留白率和数据领域的电子表格不相上下。
紧凑版的使用场景也常常是面对数据量巨大的信息呈现，通过切换紧凑主题，提升信息的快速浏览，而这也非常适合数据分析场景中巨大的数据量呈现。因此我们的产品在留白率的提升空间极大，而在实际案例实践中，也已经将表格行高优化至 30px，克制的使用留白。
除此外，竞品其他层次的设计也做了比对，总结来看整体设计做法：高密度、少屏数、少留白等。
文字陷阱：中英文字高不等于字号
举个容易犯错的竞品参考是，谷歌在紧凑版主题下字号 12px，列表行高是 28px，但在 AntD Table 中同样的 12px 和列表行高 28px 就会发现非常拥挤，缺乏呼吸感。
原因在于谷歌的 12px 是英文字体，实际字高只有 10px，而 AntD Table 的语境是中文字偏多，实际字高有 12px，所以留白的差异在于一个是 18px（28-10），一个是 16px（28-12），这也是为什么决定决定留白的两个重要因子是「字高」和表格行高，而非「字号」和表格行高，进一步推演，决定界面留白的是「元素视觉高度」和「元素间距」。
论文查阅｜寻找理论证据，谨慎验证
研究表明，低密度认知负荷低，但高密度任务完成率高，用户更喜好
参考资料：论文《基于眼动的网页对称性和复杂度对用户认知的影响的研究》
对于信息，用户需要需要阅读（视觉），思考和理解（认知），需要点击按钮、操作鼠标和打字（行动），在人机工程学中，统称为负荷。即认知（记忆）负荷、视觉负荷、动作负荷，即分别对应用户体验设计的三个层级，信息/视觉/交互。而负荷所花费资源从多到少依次为：认知 > 视觉 > 行动。
认知负荷，举个例子，看了但不一定懂了。你是否有这么一种体验——刷抖音，虽然很多（信息密度小，输出效率低），但可以一直刷下去并且刷很久；而看一门 C4D 教学视频，即使就短短十来分钟（信息密度大，输出效率高），但是却要看上半天。因为刷短视频时，你的输入效率远高于作者的输出效率，而看一门 C4D 教学视频时，你的输入效率远低于作者的输出效率。可是，输出效率是客观的，输入效率是主观的。如果输出效率很高，你可以通过提高自己的输入效率（比如让自己成为 C4D 专家）来跟上作者，从而变强；否则输出效率很低（信息质量低），你的输入效率很高（很专业），信息于你而言都是无效的。
假设负荷总量不变的情况下，那么以上三类场景界面需要对用户负担分配大致如下，官网品宣类需要低认知成本，低视觉负担，视觉要求高，用户才会被吸引过来阅读，甚至酷炫的交互更能增加互动体验而带来的趣味感，比如苹果官网，信息量极少、图版率高带来极具艺术的视觉体验、进而吸引用户愿意跟随屏幕滚动渐进式接受信息，而 B 端应用因为是专业使用，首先认知方面随着员工的专业度提高而降低，因此可以通过提高视觉负担，来降低行动负担，进而减少操作用时，当然最佳情况是三个维度能整体降低负担，让总负担降低，就需要更多设计巧思了。
面向内部设计师和终端用户投放的《高屏效诉求调研》预设解决方案中，设计师常用的 Top 3 做法为：【信息层】隐藏不必要信息、【视觉层】提高布局紧凑度、【交互层】减少点击跳转。
通过以上的探索，我们可以确定的是，B 端产品面向专业人员的工作界面设计中，提高屏效可从视觉、交互、信息三个层次进行，视觉层-高密度，即提高屏幕信息密度；交互层-低跳转，通过减少页面跳转、手势与常用操作的距离等；信息层-有效性，通过重组织或辅助信息帮助用户理解，甚至提供帮助手册等以提高用户专业能力。
基于以上的总结，对产品进行优化。下面以一个简单案例进行设计策略的解读。一位运营同学想对比 A、B 两不同人群在相同维度（白领-有信用卡）下的人数差异，寻找运营机会点。
如下表格经过高屏效策略优化前后对比图，优化前相同维度下不同人群数量的对比需要视线来回跳动比对，而优化后的表格内容，更符合用户看差异场景下分析目的数据查阅，视线锁定相同维度，即可快速比对数值大小。
下面以视觉、交互、信息三个层次解剖设计过程背后的思考。
视觉层｜高密度-克制的留白
眼动理论：研究表明，人眼最小可视视角 0.3 度，水平最大眼动舒适转动区 30度，垂直最大眼动舒适转动区 55度。可得出人眼最小识别范围 12px，水平视野舒适眼动宽 1200px，垂直视野舒适眼动高 2200px。参考资料：论文《基于眼动交互的用户界面设计与研究》
如图，缩小表格行高的同时，目标信息之间的眼动距离随之缩短，在眼动舒适区内看到更多信息，便于信息的高效获取。
理论基础：菲茨定律是用来预测从任意一点到目标位置所需时间的数学模型，它由保罗·菲茨在1954年首先提出。这个模型考虑了用户定位点的初始位置与目标的相对距离、目标的大小、移动的最短时间。三者之间关系公式为：T=a+blog2(D/W+1)，W为其中目标的大小；D为到目标的距离；T为移动到目标所用最短时间。参考资料：菲兹定律
表格单元格借助交互状态，增加悬浮出现的信息组件，前置显示目标单元格明细信息，同时通过交互出现的指示器辅助行列信息的获取，高频操作考虑手势位置放置，缩短与操作目标的距离，以提高整体操作效率。
理论基础：交互设计四大策略「组织、删除、隐藏、转移」参考资料：《简约至上》
用户为了对比 A、B 两不同人群在相同维度（白领-有信用卡）下的人数差异，但内容的重组织方式让两数据行需要频繁点击滚动条来查看，根据用户目标，将关联性大的数据放置相邻列（即将要对比的人群放置列头），即可快速查阅，减少眼跳距离。
设计趋势中常见的大字体大留白界面，但在 B 端场景中，面对紧张的工作节奏，时间和注意力变得尤为可贵，相对而言，基于复杂度守恒定律， B 端信息量大且高频访问的产品中，「用得快」要比「看得美」更重要，「高密度」「低跳转」诠释的即是「空间换时间」，少一次点击，少一次跳转，少一份等待，就多一份时间和效率。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码ben_lanlan，报下信息，会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
蓝蓝设计的小编 http://www.lanlanwork.com
