表单作为平台与用户联系最为紧密的一环，良好的表单设计可以带给用户流畅自然的用户体验，保证用户情绪的正向增长，而混乱无序的表单则会引起用户的负面情绪，影响甚至阻碍用户操作的完成，降低用户对品牌好感度和信赖度。对于我们这样的金融产品而言，产品内存在着如开户表单、出金申请表单、调整杠杆申请表单等形形色色的表单，如何将这些表单整理归纳形成一套完整的表单设计体系，带给用户统一、高效且优质的填写体验，是我们这次表单优化的主要的任务。
系列文章中关于表单设计部分我将分为上下两期来向大家分享，体系化表单设计（上期）主要介绍在项目中总结出的表单设计中的方法论，下期则是介绍方法论在我们项目中实际的应用，希望这次的分享能为你今后的表单设计提供思路与参考。
表单在我们工作、生活中的使用由来已久，在还没有互联网的年代，表单就已经是人们收集和存储数据、信息的重要手段，并一直沿用至今。如体检时填写的体检表、入职时填写的入职登记表、银行开户时填写的开户表都是使用的这种印刷的纸质表单。它们身上有很多设计可以作为重要的参考，帮助我们优化 UI 中的表单元素。
表单是 UI 界面中最为常见的元素，它通常是用来搜集和呈现一些数据、信息和特定的字段。表单的应用极为广泛，比如登录应用时填写账号密码、网上购物时完善订单信息、OA系统中提交休假审批、修改个人中心信息时……都是在和表单发生互动。
表单的目的、内容、大小等虽然各有不同，但是表单的基本构成元素是相对固定的，在设计过程中，设计师需要合理组织这些元素，帮助用户在填写表单时，轻松愉快的完成，表单主要组成部分如下图。
1.标签：告诉用户此处相应的输入元素是什么;
2.输入区：可交互的输入区域，根据字段类型使用相应的交互组件;
3.占位符：对当前项进行额外的信息描述;
4.前置图标（可选）：描述文本所需的输入类型和特征;
5.后置图标（可选）：对输入内容进行控制，如：下拉的展开与收起、清空；
6.帮助（可选）：提供表单内容的注释或辅助类容，如：说明、注意事项；
7.反馈（可选）：告知用户当前操作可能或已出现的问题，如：提交成功、错误提示、网络问题；
8.键盘（可选）：在文本编辑时需要使用键盘，如：设备系统键盘、应用内置键盘；
9.操作按钮：操作按钮是在表单的结尾，如：提交、下一步、清空所有信息。
在如今这个互联网时代，我们几乎每天都会接触到形形色色的表单，作为用户与产品链接的枢纽，表单设计的好坏会直接的影响产品的实际数据表现。好的表单结构清晰，交互合理，用户能够高效愉悦的完成表单填写，为用户节省了时间，同时也提高了自身产品的转化。而差的表单往往信息逻辑混乱，填写效率低，且容易让人产生挫败感而中途放弃，在无形中浪费掉了很多潜在商业机会。是什么造成了不同表单之间出现如此大的体验差异，我们又该如何做才能设计出令用户愉悦的表单呢？在实际项目过程中，总结出一套适用于移动端表单设计的路径图-通过做好五个步骤，设计出令人愉悦的表单。
合理的表单框架选择是打造用户友好型表单的基础，在进行表单设计时，我们首先需要依照表单的使用场景和复杂程度，选用最为恰当的表单框架。确定好表单框架，也就决定了后续设计中表单信息如何组织以及呈现。我们将表单框架划分为“录入方式”、“标签布局”和“按钮逻辑”三个部分，在表单设计时通过对这三个部分的选用来确定最终的表单框架形态。
按照表单录入方式的不同我们大体上可以将表单录入方式分为“单步录入”、“分步录入”和“分级录入”三种，在进行表单设计时需要根据实际情况选择与使用场景匹配的录入方式。
单步录入是表单中最为常见的录入方式，在一个页面内呈现所有的录入项，结构简单，快速录入、快速提交，适用于录入项较少的表单。
相对于PC端而言，移动端手机屏幕尺寸较小，一份在PC端1-2屏就能完全展示的表单在移动端往往需要7-8屏。将一个需要7-8屏才能展示完整的表单放在一个页面内让用户填写，用户容易产生抵触情绪会造成表单完成率的降低。
为了提高用户填写效率，减少用户的抵触情绪，我们可以将一个冗长的表单拆分成多个步骤，分步录入。通过拆分成一个个步骤，让表单信息呈现更为清理有条理，并且能引导用户逐步填写完成表单录入。
当表单处于以下4种场景时选择建议选用分步录入模式:
1.表单录入项过多，在一个页面内已经不能合理清晰的组织传递信息。
2.表单内容的录入方式存在较大差异，不适宜在一个页面内进行展示。
3.表单录入项在业务上存在先后顺序，只有先完成上一步字段录入，才能够进入下一步。
4.在业务上很重要的表单，为了让用户能够沉浸、快速的完成表单填写时。
分布录入模式下步4种步骤导航选择：
1.文字导航：当表单为2步录入表单时，我们展示步骤条带给用户的引导意义并不大，通常这种情况下我们会选择省略掉步骤条，只展示当前步骤名称，给予用户提示。
2.步骤条导航：当表单录入步骤为3-4步时，我们可以在页面顶部放置步骤条显示所有步骤内容标题，用户通过步骤条能够对表单有一个清晰的预期。
3.双层步骤导航：当表单录入步骤大于4步时，受限于移动端屏幕尺寸，横向上不够容纳步骤数太多的步骤条，这时我们可以其中某些关联的步骤归纳为一个大步骤，形成双层步骤导航。
4.进度条导航：当表单录入步骤大于4步，又担心双层导航给用户传递出表单极端复杂的印象，劝退用户。这时我们可以使用进度条导航，用百分比进度条来展现表单填写进度。
分级录入大家可能相对较为陌生，分级录入在B端产品中会有相对多见，一般运用于有明显上下级关系的表单，如项目管理工具中新建任务表单，在新建任务的同时还能新建下属子任务。又如客户关系管理软件中，新建订单的同时新建下属的订单明细。我们可以将使用分级录入模式的表单视为两张表单，子表单添加的数据会回显到主表单上。
标签用于提示用户需要输入的是什么信息。合理的标签布局结构，能够提高用户的阅读效率，还能降低信息填写时的错误率。常见的标签布局形式有：左右结构、上下结构和浮动结构。不同的标签布局都有各自的优点和缺点，我们需要根据项目实际情况来选择最合适的标签形式。
左右结构是目前最为常见的标签布局形式，左右结构中标签和输入区域在一行内排布，其中标签位于左侧且居左对齐，输入项位于右侧有居左和居右对齐两种对齐方式。
优点：节省纵向页面空间，在移动端有限的页面空间内能展示更多的录入项。
缺点：标签的长度无法确定，视觉上显得参差不齐，表单的信息浏览和填写效率一般，标签横向展示空间有限，对于多语言适配场景不太友好。
上下结构也是我们能够经常在表单中见到的标签布局形式，上下结构中标签位于上方且居左对齐，输入区域位于下方也为居左对齐。
优点：用户的视觉浏览路径相对于左右结构来说较短，拥有较强的信息浏览和填写效率，标签横向展示空间充足，对于多语言适配场景友好。
缺点：占据纵向空间多，一屏内能展示的录入项较少。
Material Design中文本录入的标签形式就是选用的浮动结构，在浮动结构中标签和提示文字合二为一，正常状态下，标签位于输入区域内部原本提示文案的位置，当用户输入时，内部的标签就会上移为文本输入让出空间，完成填写后标签和输入文案上下排列展示。
优点：结构简单，视觉干扰少，信息浏览和填写效率高。
缺点：填写项过多时，表单信息传递不够清晰。
内部结构相对于前面3种结构较为少见，比较长出现在登录场景，在浮动结构中标签和提示文字合二为一，正常状态下，标签位于输入区域内部原本提示文案的位置，当用户输入时，内部的标签就会消失，完成填写后只展示输入文案。
优点：结构简单，视觉干扰少，聚焦于操作。
缺点：只适用于如登录等录入项极少的场景，一旦录入项变多，由于录入后不展示标签，将导致用户后续很难判断输入的信息是否准确。
按钮作为表单的重要组成部分之一，合理的按钮逻辑能够为用户顺畅完成表单填写提供帮助，表单的按钮逻辑主要由按钮的位置和按钮的点亮逻辑两部分组成。
按钮在页面中的位置情况主要有以下3种：
1.顶部按钮：以文字的形式固定在顶部导航栏的右侧，顶部按钮尺寸较小，因为它所占空间有限，因此在操作上相对来说不便于点击。所以这类顶部按钮更适用于「编辑页面」，需要用户谨慎操作。
2.表单底部：按钮跟随表单放置于表单的最下方，根据表单内容纵向空间的大小而上下移动。因为表单内容较多时，容易下沉过多而导致按钮不可见，所以将按钮放置于表单底部更适用于当表单录入项较少不足半屏的场景。
3.设备底部：操作按钮常驻在设备底部展示，适用于表单录入项过多的情况，在表单设计时可以尽量将必填项放置在表单前面，用户填完必填项后就可以点击操作按钮提交或者进入下一步，而不用滑动到表单底部再进行操作。
1.当表单录入项较少时，且有明确预期按钮何时可用，可以先置灰主按钮，完成必填项填写后再点亮主按钮。
2.当表单录入项较多时，且用户不清楚为什么按钮不可以用，此时按钮可以常亮，并在用户点击时给予反馈，告知错误原因。
在确定好表单框架以后，对于表单内容信息的进行有效的组织也尤为重要，特别是对于一些结构复杂、录入项多的表单，如果不对信息进行组织，很容易显得繁杂混乱，容易让用户在一开始就产生抵触的情绪，甚至选择放弃。那么如何合理有层次的组织信息呢？
我们在设计表单时潜意识里都想要从用户那里获取到更多的信息，表单中因此出现很多必要性较低的录入项，表单也因此变得冗长，让人第一眼就生出「好多信息需要填，好麻烦」的沉重感，在填写表单之前就萌生退意。我们在进行表单设计时需要保持克制，聚焦于表单的核心任务，让表单尽量短而美。那么我们要如何为表单减负，可以尝试以下方法。
表单中每多一个录入项需要填写，都有可能会失去一部分用户好感度甚至流失一部分用户。在设计时我们需要判断某个字段信息对于用户来说是否有必要在表单中进行填写，尽可能的删减掉额外的无用字段。例如注册表单，如让用户使用邮箱注册，那么用户的姓名字段是否是注册的必选项？如果不是必选项是否可以在之后的信息完善中进行填写。
在表单中时有一些信息他们本身紧密相关，我们完全可以视情况将其合并为一个录入项，来减少不必要的录入操作，达到简化表单，提升录入效率的目的。合并录入项要结合实际的使用场景以真实的提升表单体验为目的，而不是一味的追求表单的最简化。
根据用户使用数据，适当将使用频次不高、或者提供给专业用户的高级表单项隐藏起来。例如一份表单中有一个填写项，90%的用户都不需要填写，那么默认收起。保持表单的简洁，让绝大多数用户快速完成，避免大量的表单给用户的焦虑，而又满足了小众用户的需求。
根据沉没成本的定义：人们在做决策时，受到了自己过去所投入的时间、金钱、精力等因素的干扰，对于先前付出了投资的事情有更强的忠诚度和继续投资的意愿。进行流程设计时也可以遵循这个原理，将容易完成的表单放在前面，这样做有3个好处：
1.简单的表单更容易激起用户的填写欲望，用户会迫不及待地去完成。相反，用户一开始就看到过于复杂的表单，很容易被吓到，从而放弃整个任务。
2.用户通过完成简单的表单，可以增加自信心，即使后面的表单变复杂了，用户也更有耐心去完成。
3.当用户将前面简单的表单完成后，放弃整个表单的机会成本就变高了，即使后面碰到较难的任务，用户放弃的几率也会降低。
当我们我们设计的表单字段内容较多时，需要合理的对字段信息进行分组，这样整体看起来更加有组织性。接近性（格式塔原理）原则告诉我们： 相互靠近的物体被认为比相互距离较远的物体更有关联性，这样能使设计界面层次有序，视觉清晰，减少视觉噪音。分组时需要注意：
1.内容属性相近或有关联性的放在一组。
2.根据信息的重要性及难易程度排列分组，将选填的表单内容靠后
在表单录入设计阶段，我们需要明确认识到一点，用户在面对一份表单时往往没有我们想象中的那么有耐心，复杂繁琐的录入操作可能会直接劝退用户。我们需要做的就是化繁为简，思考如何给用户减负，让用户简单高效的完成表单录入。表单录入操作提效有一些切实可行的方法，下面请我将一一向分享。
对于用户而言，填写信息永远都不是一件有趣的事情，在对用户足够了解的前提下，我们可以选择为表单中的部分录入项提前设置合理的默认值，节省用户的操作时间。默认值的设置不是一个随性发挥的过程，而是基于用户行为和数据的理性判断，并且也不是每个字段都适合设定默认值。关于如何设置合理的默认值，什么字段适合设定默认值，下面几点可供大家参考：
在一些业务场景，会使用到用户之前在其它表单中已经录入的信息，此时在填写新表单时，可以默认带入之前的数据。
如果用户正在填写的内容有相关的关联数据，可以默认带入。如我们在填写订单时可以默认带入该订单关联的商品基础信息。
基于移动端设备的能力，我们可以在用户开放权限的情况下获取一定的用户信息（位置信息、电话区号、运动数据等），在特定情况下默认填写，如滴滴通过GPS定位自动帮用户填入上车位置。
像电话区号、证件类型、国籍等用户录入结果相对固定的字段，可以根据情况提设置合理的默认值。
相较于PC端而言，移动端设备屏幕尺寸较小，虚拟按键的输入效率远不及实体键盘，在移动端手动输入的成本较高。因此，为了打造便捷优雅的操作体验，移动端表单需要尽量减少用户的手动输入。以下方法可以减少手动输入。
联想输入是给予用户输入字段的自动补全功能，用户少量输入后进行选择。录入方式由原来的输入变成半输入后选择，减少用户的输入成本，提高用户操作效率。
对于表单填写过程中可以固化选择的信息，应让用户进行选择操作以代替手动输入，尽可能地让用户减少输入成本。
一份用户可能会多次填写的表单，我们可以提供用户的历史输入项供其选择，如滴滴的打车页面会将我的常用目的地放置在目的地输入框的旁边供我快速录入。
一些新型的交互组件的使用能够简化信息录入的操作，例如滑块组件等。
在填写表单时如果填写项需要频繁的页面跳转会使得整体的填写效率变低，增加用户的操作成本。在进行表单设计时应尽量规避这种频繁的页面跳转，选用更流畅灵活的交互方式。
在网页端表单设计中，用户在表单填写中需要对选项进行选择时，常用的交互形式是在选择器的下拉列表中进行选项的二次点击。而在移动端设计中，触发选择器后的二次点击会增加用户的填写成本。所以在设计时，当选项少于8时，在表单中直接显示所有可选项，当选项超出过多时则在列表浮层中进行选择。
在表单填写中我们期望用户保持专注，尽量避免产生引导用户离开当前页面的填写交互，这种交互跳转很容易打断用户固有的行为轨迹。因此运用浮层、弹窗等交互来完成辅助信息的采集是我们较为推崇的交互形式。
对于一些标准证件类信息的录入，可以通过OCR识别文件内容。当用户上传图片后，运用图像识别技术提取关键信息并自动填入结果。值得注意的是，如果图片不清晰或存在水印，将大大降低识别准确度。此时应提供修正渠道，让用户可以逐一校对并修改文本内容。
短信验证码升级方案。直连三大运营商，一步校验手机号与当前SIM卡号一致性。优化注册/登录/支付等场景验证流程，有效提升拉新转化率和用户留存率。不做数据加工与号码精准营销，保护用户隐私。
为了避免让用户频繁的跳入跳出相同类型的输入项，首先整合表单的信息字段，将同类型的字段进行合并，同时结合输入控件，设计联动式组件，让用户在表单输入时更加高效。
设计不是简单的元素拼凑，深入下去，有很多细节需要推敲，细节应该是含蓄的，包含在整体之内。好的细节设计不容易被用户的眼睛直接发现，但是会让用户与产品的交互过程变得通顺、舒适，概括来说就是润物细无声。对应到表单设计上，我们需要通过表单设计中的细节把控，让表单录入这件事变得简单、高效。
当表单中同时出现必填项和选填项时我们需要对其做出区分，避免用户不知道哪些字段必须填写、哪些字段可以选择性填写。沿用通用符号习惯，在表单中我们往往使用 * 号来标记必填项。但是当表单中的必填项多于选填项时，大量的 * 号会增加用户的认知负担，面对这种情况，我们可以使用暗提示来标记选填项帮助用户识别。
如电话号码、银行卡号这类有数字组合规律的号码字段，我们可以沿用它们在线下的数字组合规律，通过空格对号码字段进行划分，帮助用户校验和阅读。
出于保护用户账号安全考量，我们在进行密码输入时通常使用隐暗文字的方式来保护用户账户安全，但是暗文字的显示方式会让用户无法确认密码信息。因此我们可以在输入时，让输入字段短暂显示，保持1秒然后再转变为暗文字，这样既可以让用户明确内容，也保证了用户的账户安全。
我们在进行表单设计时，输入区域的长度要符合心理预期，需要预判填写内容长度来确定输入区域的长度。这样不仅在体验上一致，而且在视觉体验上更加愉悦。
用户应该对他们的操作所带来的结果非常自信，使用“提交”、“注册”、“立即支付”、“创造账户”等确定性文案来描述用户将采取的操作。
报错信息应当一目了然，从用色、图标到文本都应当起到高亮的效果，而且报错信息应当靠近输入框，而非表单的底部或者顶部或者按键旁边。
在设计主要由文本输入框构成的表单页面时，要考虑键盘出现可能会遮挡输入框的情况，我们需要把控件放在scrollView上，当键盘会遮挡输入框时,则表单滚动。
对于异常情况不能只是冷冰冰的告知失败，这样容易给用户带来挫败感，且缺少下一步操作指引。错误反馈不应该只着眼于结果，错误反馈的阐述角度应该是引起用户关注、让其快速了解出错情况，并指导如何处理。
经过前面几个步骤，表单整体形态已经确定，最后一步我们需要从整体体验的角度对表单进行完善和调整。包含表单的容错性考量、表单流程闭环的打造、视情况而定的趣味性设计。
即便你的产品90％的时间都运行良好，但是如果在用户需要帮助时置之不理，他们是不会忘记这一点的。——《Getting Real》
容错性概念源于计算机领域，容错性是指计算机系统在发生故障的情况下，依然能够保证系统正常运行。计算机这种保证系统正常运行的能力也被称为容错能力。延伸到互联网产品设计领域，容错性的范畴更为宽泛，包括降低用户操作的出错率、及时提供纠错帮助、提供解决方案等内容。
容错设计与用户体验息息相关，我们在表单页面设计时也需要进行容错性考量，尽量避免用户错误操作的出现。当用户出现错误操作时，帮助用户识别、诊断，及时反馈问题所在，并提出有效的解决方案，帮助用户快速从错误中恢复。让表单填写流程更顺畅，给用户带来更优的用户体验，关于表单容错性设计可以从以下几个方面来进行。
引导和提示要突出表现，从而引起用户关注，确保用户在操作前能注意到引导或提示信息。引导与提示用语要简单且易于理解，当重要或操作不可逆时，要询问用户让其知道这样操作的后果。
如何从设计上避免用户出错，限制是一种非常必要的方式，可以通过限制用户的某些交互操作或者增加某些操作的难度来对用户操作进行限制避免用户出错。
当用户出现填写错误时，及时的反馈错误并提供纠错帮助，出错信息应当用清晰准确且用户易于理解，能够对用户解决当前问题提供建设性帮助。
允许用户犯错，操作者能归够撤销以前的指令，帮助用户在犯错以后能够快速回到正确状态。
表单的终点并不是提交，一个好的表单设计需要兼顾考虑用户填写前的引导、填写时的及时校验与帮助、还有填写后的整体流程体验，为用户提供完整的、形成闭环的表单填写体验。
举个例子，当我们设计的表单需要用户准备如身份证、银行卡这类的证件时，需在表单填写前告知用户，避免用户填写途中才发现证件未准备，导致用户填写流程中断。再如，用户在填写完证券开户表单后，其实还需要通过审批后用户才能进行入金交易等操作，这时我们需要一个结果页来告知用户表单提交的结果状态和下一步的操作指引。
表单设计并不一定需要是严肃且正式的，在表单设计时可以尝试引入一些趣味性的元素，研究表明，更大的文字输入框、适度的留白空间、优雅的动画效果、趣味性界面设计会让人心情愉悦更有填写的欲望。
例如bilibili的登录页面，在用户输入账号时上方的卡通形象是睁眼的，当切换到输入密码或者验证码时卡通人物会有一个捂住双眼的动作十分有趣，这样的趣味性设计能够在一定程度上缓解用户在填写表单时的焦虑情绪，并增加对于bilibili保护账号安全的信赖感。
以上就是我对于移动端表单设计的一些归纳和总结，过往的项目中自己设计大量的表单页面，走了不少弯路犯了不少错误，但也通过项目不断的反思总结，收获不少的关于表单设计的经验。在这里将项目中关于表单的一些思考和经验分享出来，总结出自己的一套关于表单设计的方法论，也是希望能够对正在进行表单设计或者即将进行表单设计的你提供一点点参考与帮助。
表单设计我将分为上下两期来向大家分享，体系化表单设计（上期）主要介绍在项目中总结出的表单设计中的方法论，下期则是介绍方法论在我们项目中实际的应用，也希望你能够持续关注。
文章来源：站酷 作者：Yone杨
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
不同场景下用户提示的设计原则
什么是提示？提示，指给予题型和解释。提示指启示；提起注意。映射到现实生活中，教学楼“请保持安静”、厕所的标示提示、饭店里禁止吸烟的牌子都是提示，是用来提醒人们注意自己的语言、行为
根据不同到使用场合这里梳理了5中提示操作的使用控件：分别是弹框提示、常驻提示、通知、全局提示、徽标提示，这五种提示方式承载的信息量、优先级和用户操作场景各有不同
下面分别介绍这5种提示控件的使用场景：
需要用户处理事务，又不希望跳转页面以致打断工作流程时，可以使用在当前页面正中打开一个浮层，承载相应的操作。
另外当需要一个简洁的确认框询问用户时，能够让用户清晰的知道自己的操作，并且进行二次确认
聚焦：使用户集中注意力确保任务得到解决，对话框一旦出现，应当呈现在页面上方的视觉层。
清晰：对话框应直接展示信息，并带有相关或上下文信息响应用户任务或操作。
除标题、纯文本内容和按钮外，还需要承载更多复杂信息时
可配置单选框、复选框、列表、穿梭框、图片、头像、插画、视频等
用于警示、紧急、或简单的二次弹窗确认。
按钮文案需承接上下文表述，并准确引导用户行为，如“确定”、“取消”、“删除”。
简单的消息提醒时或不可返回的操作，只提供一个按钮用于关闭，如“知道了”“刷新”。
内容不足以构成单独页面或不希望跳转新页面的对话框，多使用于搜索、设置、内容选择；
需要完成的一系列任务操作，被选择后立即生效，无需进行确定反馈；
常驻提示是一种非阻碍式的信息展示，它不打断用户的当前操作，一般停留至页面某个位置（优先顶部），非浮层的静态展现形式，始终展现，不会自动消失，用户可以点击关闭。
直接：当前页面需要向用户显示需要关注的信息时，常驻提示显示，要求用户立即注意；
重点：常驻提示引起用户注意，以确保其内容得到解决。
常驻提示属性包括常规提示、成功提示、警示提示、错误提示四种。
普通提示：建议用于展示背景条件、政策信息、规范要求、当前状态等客观内容。
成功提示：建议用于展示已完成操作的成功状态。
警告提示：建议用于展示可能会导致某种后果的警示性文本。
错误提示：建议用于展示一个信息组的报错文本，如表单中同时满足几个条件时触发整体报错，可用此样式。
在系统四个角显示通知提醒信息。经常用于以下情况：
较为复杂的通知内容。
带有交互的通知，给出用户下一步的行动点。
系统主动推送。
提示文本内容以及交互方式尽量准确、清晰、简明，保证用户在其消息自动消失前了解提示信息或做出交互。
1、基础样式：分为基础文字通知、基础文字通知（带操作）
2、根据业务需要在区域内填充内容或操作类组件的通知。
通常出现时显示几秒后自动消失，或者数据正在加载时显示，提醒用户已经完成的动作，或者已经达成的目的，是用户完成动作后或者异常情况下的提示（pc端叫 Message，移动端叫toast实质上都是全局提示是一个控件）
在不跳转页面打断用户工作流程的前提下，提供成功、警告和错误等反馈信息。不打断用户操作
1、刷新页面时，提示更新的条数：
2、收藏或者其他操作，提示用户操作成功：
红点、数字或文字，一般出现在通知图标或头像的右上角，用于显示需要处理的消息条数，通过醒目视觉形式吸引用户处理。
跨平台：可适用于 Windows/macOS/iOS/Android 平台的所有套件产品，为产品提供一致的设计体验，使用户在不同端使用产品时，都可以拥有流畅高效的使用体验。
直观：通过清晰醒目的视觉形式告知用户状态，吸引用户关注和处理。
当功能模块更新、信息状态为未读、人员在线协同、信息量变化且无需告知具体数量或性质时，使用点状徽标突出状态
内容的信息量发生变化，且需要明确告知新增数量时
在某些功能场景中，作为特殊状态提示使用
通常出现在列表、卡片上，强调和突出其特殊状态，其主要作用是标记，或吸引用户的注意力，提示用户关注该事物或事件
简单的总结，并不是非常全面，还有很多需要继续挖掘的技巧，还有很多需要学习的东西；有一点能够肯定的是，要从实际的用户场景中去考虑问题，用户体验就必须站在用户的角度，不能为了设计上的美感，而让增加用户学习成本，好的体验应该就是用户一眼就能看懂，操作简便。
文章来源：站酷 作者：郭大毛
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
前言
互联网产品首页是与用户进行交流的第一步，首页设计不仅代表着一家企业的形象，还会直接影响公司的业务营收和口碑。
本文将深度解析“小米商城”APP的首页设计，分析B2C模式下的自营电商是如何通过设计打造品牌感，增加用户参与感，从而促进产品的销售转化。
了解一款APP产品首先要了解它的产品定位，从小米商城的slogan“让每个人都能享受科技的乐趣”不难看出小米的产品定位是性价比高的科技类产品。
另一方面，从商业模式来看，小米商城是B2C自营电商，与其他B2C自营电商平台不同的是，小米主打高性价比，以好口碑深入大众，撬动市场，以互联网思维卖产品，把硬件产品当互联网软件产品卖。
由此可见，科技、高性价比是小米商城产品定位的两大关键词。
目标用户
目标用户是产品模式和功能制定的重要考虑因素，小米商城的目标用户可以分为三类人群：
1、米粉用户
这类用户是小米的忠实粉丝，也或许是雷总的粉丝，他们认同小米文化，喜爱小米产品，热衷购买和传播小米产品，是小米商城最有价值的用户群体。
2、科技发烧友
这类用户本身就是科技爱好者，喜爱探索新鲜前沿的科技产品，热衷购买科技类创新性的产品，对于深度发烧友还会专研参数配置，并会在论坛探讨分享。
3、追求小资用户
这类用户追求品质，喜爱有设计感的产品，如果了解到小米有什么产品好看又好用，他们会为了保证品质和服务，选择从官方购物平台购买。
全品类商城与自营商城设计差异
虽然了解了小米商城的定位与目标用户，但还需要从产品的商业模式上去推导设计，比如淘宝与小米商城的首页设计大有不同，原因就是因为商业模式不同，致使产品的设计存在差异。
1、全品类与自营首页设计区别
自营类商品其实是全品类商城的一个分支，全品类商城首页衍生了很多独立平台，所以全品类商城首页设计形式上更注重流量分发，而自营类是垂直领域，所以会更突出商品，并且创造商品卖点，打造爆款。
2、自营类商城设计上注重品牌
自营类商城运营的是品牌，能发展壮大的自营电商都成功塑造了品牌形象，所以在产品设计上突出品牌，会与用户建立信任感，提高转化，同时也能做到与其他电商的差异化设计。
下图所示，小米商城、小米有品、网易严选三款产品，为了能快速与用户建立品牌认知，导航栏都放了自家的logo。
另外，还可以从色调，板式，服务等等各个纬度突出品牌形象，总之在产品设计上要与品牌形象贴合，让用户处处能感知到品牌。
导航栏设计注重品牌
了解产品定位和目标用户以及平台的商业模式，对我们分析一个产品非常重要，这样更容易从正确的方向理解产品的设计，下面我们带着对产品定位和目标用户的理解，开始对小米商城APP首页设计的全面解析。
小米商城-首页解析
接下里我们从品牌DNA、布局体验设计、金刚区设计、登录前后设计、参与感设计等方面对小米商城首页进行解析。
1、品牌DNA
当前小米公司有着非常强大的品牌势能，给人们留下了性价比高、高端、简约、科技、坚持的好印象，这些都可以看作是小米的品牌DNA，因此在设计小米商城APP时，设计需要贴合小米品牌DNA，让用户使用产品时能感受到小米的品牌力。
打开小米商城APP，处处能感受到小米的品牌元素，橘色的品牌色、小米的产品图标等，都在传递着小米的符号，整体UI的设计秉承了小米硬件产品的一贯风格，如简约的风格、高质感元素等，细节上体现品质。
2、布局体验设计
用户浏览电商产品首页，第一屏流量最高，随着往下走第二屏、第三屏...跳失率会越来越高，根据数据统计通常产品第三屏之后流量会大打折扣。
上图的数据并不能代表所有产品的数据，好的设计形式可以影响数据的变化。
如何减少跳失率，要从用户在当前位置的所思所想出发，做好第二屏到第三屏的功能制定和引导设计非常重要。
小米商城首屏最后的位置可以看到第二屏的内容标题，能够起到引导性作用，并且放的是最有吸引力“小米秒杀”和“新品发布”双十一期间增加了运营模块，虽然这两块在第二屏，但看到的同样是最有吸引力的双11促销信息。
引导用户查看内容
另外在不增加运营板块时会发现，小米商城重要板块不会放到第三屏，在第二屏下面已经开始出现精选（猜你喜欢）闲逛区，因为是太多板块用户会感觉首页很乱，不容易对各板块功能形成认知，其次就是随着跳失率的增加，重要板块也会失去好的转化效果。
打造沉浸式体验
多数用户在第三屏时会失去再向下探索的动力，这时系统通过算法给用户推荐用户喜欢的内容，会再次吸引到用户，重塑用户向下探索的好奇心。
用户在“猜你喜欢”版块心态是无目的的闲逛，当用户不想再向下探索时，随时可以侧滑屏幕切换到其他品类，这样也大大减少了用户首页闲逛的跳失率，营造出了一种沉浸式的交互体验。
闲逛区（猜你喜欢）沉浸式体验
同时因为用户在此版块是“逛”的心态，所以设计上采用瀑布流，也可以称为Feed流，这样的设计形式重点突出的是图片，也就是商品本身，参数配置会弱化或不出现，因为用户闲逛时是没有目的的，当一个商品对他吸引后，用户才会主动点击查看详情。
如果用户是有目的搜索某个或某个品类商品时，此时列表流更为合适，因为用户是有目的性的查找商品，他是认识这款或这类产品的，所以必定会开始关注产品的参数配置等，列表流的左右结构，能非常合理的呈现出参数配置等信息。
总结：当用户无目的“逛”时会关注产品本身，所以这时需要重点突出产品图，使用瀑布流更合适；当用户有目的查找商品时，因为已对商品有一定的认识，所以不仅希望看到图片，同时也希望能够直观看到产品的参数配置，这点对科技类产品的展示尤其重要。
3、金刚区设计
小米商城-金刚区
金刚区的图标设计直接用产品来代替，真实的手机、电脑、笔记本等，这样不仅能与众多电商平台的金刚区有差异化，更加能够把入口功能表现的有识别性、直观性，能够使用产品模型作为图标元素，这本身形成了一种优势。
“触碰想象，感受真实”金刚区的图标设计符合小米的设计理念，设计师从图标的设计营造出了贴合目标用户认知的氛围，让用户感受到了归属感。
金刚区图标的布局设计与产品定位和用户特征非常吻合，第一个图标是“小米新品”，对于米粉来说，这应该是最关注的功能入口，关注新品的用户也是最容易购买新品的人群，从产品的角度来讲，新品也是需要大力推广宣传的，所以新品入口放置首位无可厚非。
第二个是“小米众筹”，此功能入口对于追求性价比的用户是最有吸引力的，因为众筹价低于零售价，符合性价比属性，此模式是先付钱再生产，解决了库存、物流成本等。
第一排剩下的是三个手机图标，其中位于中间位置的“至尊新品”是动效展示，也是因为要强调和推广新款手机。
“小米秒杀”放在第二排第一个，是因为此模块也非常重要，是一大流量入口，秒杀功能板块是利用时间的紧迫感来刺激用户转化，走量能力极强，正因如此，在页面的下方有专门的“小米秒杀”板块。剩下的四个图标是小米生态链中四个类别的产品入口，代表了大多数产品。
4、登录前后设计
新人首次打开产品，促进第一单购买
小米商城新用户第一次打开产品时，会直接弹出“新人专享福利”弹窗，点击查看都是性价比极高，且生活中常用的物件，性价比高是为了促进与新用户的第一笔交易，推荐常用物品是为了让用户在生活中看到用到这些常用物品时，可以想到物品的购买渠道，从而提高复购。
新人登录前，首页内容促进第一单购买
如果用户不小心关闭了弹窗，没关系在首页最重要的位置也会看到“新人福利”板块，如果享受新人福利，那在购买前一定要做的是要注册登录的，所以新人福利，不仅可以促成与新人的第一笔订单，而且也有助于引导新人成为注册用户。
新人登录后，继续促进第一单购买
从下载小米商城到登录后，会有三次提示有新人福利，上面介绍了前两次，第三次是当登录后会直接跳转到“新人专享福利”，目的还是促成一单有性价比的交易，给用户留下第一次好的购物体验，最终变成有价值的用户。
据调查电商购物，用户最大的痛点就是不包邮，同样一件商品，99元包邮比90元+8元快递费组合更容易让人接受。
上图小米商城的新人福利，都在强调包邮，消除用户痛点，让用户的首次购物真正的感受到小米商品的性价比。
个人中心登录前后有意思的设计
小米商城登录前后在个人中心有个地方的设计非常有意思，看下图未登录前的5个图标设计，相信身为设计师的你一眼就能看出“钱包”的图标偏小，这是为什么呢？
登录后才发现，较大的四个图标都会换成数字，数字的大小正好与钱包图标的大小视觉上一致，设计师似乎很淘气。
登录后数字与图标大小视觉上一致
5、参与感设计
在小米商城的首页用户可以打开红包雨游戏功能、答题领红包功能、智取盲盒机功能等，这些虽然都是营销策略，但因为趣味性、游戏化的设计也大大提高了用户参与感，从而增加了销售机会。
最后
以上讲的是UI设计前的探索工作，也是非常有必要的工作，产品设计者只有真正了解了产品的底层架构，才能精准的把控设计，在各方面掌握好平衡。
文章来源：站酷 作者：吴星辰
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
前些天对用户习惯进行了总结，这两天重新优化了一遍。我们在互联网产品的设计过程中，有时会听到一个词：用户习惯。设计师希望尝试更多新颖的交互方式、视觉效果，却常常容易被其他人挑刺指出不符合用户习惯，建立在用户习惯上的创新才是好的体验。
尽管设计师经常将用户习惯挂在嘴边，但是却很难有人说出用户习惯究竟是什么？我们如何判断所做的设计是否符合用户习惯？用户习惯是否始终不能打破？道理我都懂，就是不会做，实际上确实是这样，因为很大程度上取决于设计师对用户习惯的理解深度。
用户习惯本身很难被量化，但是不代表就是一个模糊的概念，你仍然能从用户反馈、操作行为数据对比等分析中一窥究竟，用户习惯是可以随着设计师的学习、经验、眼界等的提升而提升的。
心理学上认为，习惯是人在一定情境下自动化地去进行某种动作的需要或倾向。或者说，习惯是人在一定情境中所形成的相对稳定的、自动化的一种行为方式。 习惯形成是学习的结果、是条件反射的建立、巩固并臻至自动化的结果。
所以，习惯有两大特点：
需要注意的是，“长期”本身是是没有明确时间界限的，更强调多次的重复。这里的习惯，侧重于描述“习得性”，即人们通过经历、学习、刻意练习等方式形成的，所以这种习惯理论上是可以被改变的。
此外，习惯还有一种潜藏特性，区别于上面描述的“习得性”，是天生的、物种特有的行为模式。比如人空腹状态下，闻到香的食物会产生强烈食欲。这种特性习惯是刻在基因里的，几乎无法被改变。
试想，我们在使用 App 时，是否遇到过因为习惯的问题而感觉到不适应的场景？
举个最常见的例子，Windows 与 Mac 系统的软件关闭方式。使用 Windows 的电脑时，我们形成了关闭操作在右上角的自然习惯。后来开始使用 Mac 电脑，关闭方式都在左上角，在一段时间内，每次关闭时都感觉到格外不习惯。而 Mac 的关闭方式没有比 Windows 产生显而易见体验升级，改变操作习惯成本高，部分用户可能会认为 Mac 的关闭操作不好用。
当然，假如最开始接触的是 Mac 电脑，再使用 Windows 电脑，也会自然认为 Windows 不好用，这是先入为主的观念，一旦产生习惯，改变习惯将产生一定的学习成本。
设计师需要思考用户行为的本质，而尽量减少主观判断。产品是给人使用的，所以了解人们的行为特征很重要，而只要涉及到对人本身的了解，就是极其复杂的，人类对自身的行为特征了解远远不足，但这不妨碍我们以现有知识去做一些分析和判断。
用户行为习惯的产生，与记忆的特点有很大关联，我们可以把记忆划分为外显记忆和内隐记忆。
外显记忆大家比较习惯和容易感知到，比如我们在学校学习时背诵的课文、公式法则等，可以用语言、文字等显性方式描述出来的记忆。
内隐记忆也叫非陈述性记忆，我们无法用行为描述而又确实存在，比如骑单车，学会之后很难会遗忘。刚开始学习时，会需要意识的介入，经过多次练习，行为会逐渐“自动化”，比如学习开车时，我们会注意力很集中，而习惯开车后，可以一边开车一边聊天。
我们平时说的肌肉记忆、条件反射也和内隐记忆息息相关，而且一旦形成，不太容易改变。需要注意的是，肌肉记忆只是一种简单描述，负责此记忆的是小脑，其实肌肉没有记忆。
所以有时候，我们感觉体验某个 App 时，会习惯性在某页面寻找某功能，或者觉得体验和其他 App 有区别，都可能是内隐记忆的用户习惯引起的。举个例子，某天你刚使用一个没用过的 App ,这时你想要找设置功能，那你大概率会不自觉的点击 App 的最后一个主 Tab (如“我的”），因为大部分 App 的设置功能都在这个场景，用户自然也就形成了习惯。
这里我且采用由心理学家基思·斯坦诺维奇（Keith Stanovich）和理查德·韦斯特（Richard West）率先提出的术语，用以说明大脑中的两套系统，即系统 1 和系统 2。
·系统1的运行是无意识且快速的，不怎么费脑力，没有感觉，完全处于自主控制状态，也叫快系统。
·系统2将注意力转移到需要费脑力的大脑活动上来，例如复杂的运算。系统2的运行通常与行为、选择和专注等主观体验相关联，也叫慢系统。
而这两个系统，是可以互相转化的，慢系统通过刻意练习，把新的习惯注入快系统，而这时快系统就是习惯的表现，这样快系统可以在日常生活中完成大部分工作，这就是我们常听说的熟能生巧，习惯经常能帮我们节省思考的精力，这又让慢系统进一步通过刻意练习，向快系统不断注入更多好习惯。
举个例子，你刚用一个 App 时，可能需要先体验一下你要的功能在 App 的哪个位置，但你用久之后，就会不假思索地找到它。就像你用微信，最常用的功能可能是回复信息、看朋友圈，所以一定会形成习惯。但是假如有人让你找一下微信里面“生活服务”的入口，你可能会先想一下可能出现在什么入口，这就是因为平时比较少用导致的。假如你常用这些入口，也会形成习惯，下次要使用这些功能的时候，就能够快速找到。
既然说到用户习惯的特点是“长期养成”且“不易改变”，那么挑战用户习惯一定会造成不适，甚至引起强烈反感。几年前 Ins 的 logo 改版，将 logo 由拟物化改成了扁平化，颜色也发生了变化。暂且抛开视觉效果不说，从用户视觉记忆上，已经习惯了下图左侧的效果，而右侧新版效果很难与左侧产生记忆上的关联。
许多用户反馈桌面上找不到这个应用、许多用户吐槽很丑甚至不想再使用。所以我们比较容易理解，为什么有时候 App 改版容易反而引起用户的反感，这很大程度上是用户习惯的影响。
了解产品的用户是谁、用户的行为特点是什么。不同产品由于定位不同，所以用户群体也不相同，用户群体的不同自然代表用户行为特点的不同。如果设计师知道用户群体，但是不清楚具体行为习惯特征，可以尝试让你身边的用户帮你体验。
举个例子，B 站的整体用户画像相对而言更偏年轻化，所以产品设计上，无论是代表形象、UI 风格、交互体验都更显年轻化。而“小年糕”小程序的用户群体主要为中老年人，所以设计上不会显得很年轻，而是以操作明确、字号偏大、去除多余信息为主。
关注主流产品的用户体验很重要，这些竞品的操作往往代表用户的习惯操作（或被培养出来的习惯操作）。大多数情况下，你需要了解竞品能做到什么程度，用户容易将习惯从一个场景带到另外一个相似场景。
比如点外卖，有的用户可能会下载美团和饿了么，尽管平台不同，但是在用户习惯中，操作模式是相似的，所以如果你要让用户的体验不突兀，那就往往遵循相似的操作逻辑。当然这些不是为了让一个产品去抄另外一个产品，而是要追寻更好的使用体验，你的产品比竞品体验更优，就更能吸引用户的青睐。
每个人本身都会具有相对稳定的行为、操作、信息阅读习惯，我们能见到的体验好的产品，都是符合用户的基本行为习惯、信息阅读习惯的，要想了解这些习惯，需要了解深层次的交互行为特征。
从操作而言，需要了解用户与界面交互的行为习惯，比如用户的操作（手势操作、信息布局如何才能便于操作），比如尼尔森可用性原则等。
从信息阅读角度而言，需要考虑人们眼睛观察事物的规律，比如格式塔原理：接近性原则、相似性原则、连续性原则、闭合性原则、主体/背景原则、简单对称性原则、共同命运原则。
就移动互联网产品的领域而言，大家都是与手机互动，目前手机系统的两大平台：iOS 和 Android 也都各自有提供关于人机界面设计有清晰的指导，尤其是 Android 的 Material Design ，对于设计师快速了解设计规范、设计原则有很大作用。
iOS 与 Android 的人机界面规范链接：
iOS：https://developer.apple.com/
Android：https://material.io/
我们提到挑战用户习惯会有风险，但用户习惯并非是永远不可改变的，有时我们需要培养新的用户习惯，也就是大家常说的“教育用户”，否则世界可能一直很难进步。
移动互联网兴起之前，大家都是线下打车，但是滴滴打车颠覆了传统线下打车的用户习惯；以前大家都是现金支付，但是微信支付颠覆了现金支付的用户习惯。
《设计心理学》里面有这么一段话：“如果用新的方式做一件事只比原来好一点，那么最好与以前保持一致。如果必须做出改变，那么每个人都得改变。新旧混杂的系统会让每个人困惑。当新的做事方式明显优于旧的方式，那么因改变而带来的价值会超越改变本身所带来的困难。不能因为某样东西与众不同就认为它不好。如果我们故步自封，我们将永远不会进步。”
这里的价值包括但不限于用户价值、商业价值（短期价值、长期价值）等，当新习惯会需要用户改变旧习惯时，这个设计带来的价值有多大，值不值得让老用户付出学习成本。有时候，明知改变会引起用户的强烈抵触，仍然改变用户习惯，可能因为改变的价值大于改变的困难。
刚才提到的 ins 的例子中，有的人不知道 ins 为什么要改版，创新咨询公司 IDEO 的沟通设计主管 Remy Jauffret 说：“当品牌、组织超越了最初的商业意图，或扩展业务提供不同的产品，或领导希望吸引新的客户，这些情况都可能需要新的品牌视觉。变化总是大家不舒服，然后又平息，我认为时间才是检验真理的唯一标准。”
我们在设计中，有时候会遇到自己的产品某个功能体验比较差，但是延续了很久，而市面上其他同类产品在相同功能的体验上已经做的很好，我们可以往主流交互体验上改版吗？这时需要权衡改变之后是否能带来明显的体验升级，还是说对于用户来说是不痛不痒的变化，可改可不改？
以安卓为例，在几年前，安卓手机的底部有 3 个实体键，后面手机更新迭代，变成了虚拟三键设计，因此底部存在3个不同功能的热区。而在 Android 4.0 设计规范中，为了避免底部标签栏与已经存在的底部虚拟键产生交互上的冲突，安卓明确说明了不要使用底部标签栏。
但这种规则，在使用体验上、开发者的适配上都发生了问题，用户更接受 iOS 的体验，后面谷歌在 Material Design 中，允许了底部标签栏的存在。这相当于和原来的用户习惯不一致，但却带来了更好的用户体验。
这里结合上瘾模型的触发、行为、多变的酬赏、投入进行阐述，这四个步骤是一个循环，当用户越沉迷于这个循环，说明你的产品对用户的吸引力越强，用户习惯也就越强，这里会侧重于从培养用户习惯的角度进行拆解。
外部触发说白了就是加强产品曝光，让用户一下子就能想起你。举个例子，“充电五分钟”下一句是什么？你大概率会想到“通话两小时”，这种经过外部的长期触发，最终已经转变成了内部的习惯，会让你记忆深刻。
外部触发的类型主要有4类，通过将信息渗透进用户生活，吸引他们采取下一步行动：
付费型触发：做广告、搜索引擎推广都是付费型触发，争取新用户；
回馈型触发：公关和媒体等领域的触发，比如对产品做正面报道、推荐等；
人际型触发：熟人之间的口碑传播是一种极其有效的外部触发，可以为产品带来“病毒式增长”；
自主型触发：以驱动用户重复某种行为作为重点，让用户形成习惯，比如新闻订阅、每天早晨的闹钟等。
内部触发是用户心理产生的使用动机，内在情绪驱动自己去使用一款产品。
当某个产品与你的思想、情感或者是原本已有的常规活动发生密切关联的时候，那一定是内部触发在起作用。对于习惯刷朋友圈的人来说，拿起手机就不会自觉打开微信；对于习惯刷微博的人来说，拿起手机就会刷起微博，甚至自己都没有意识到。一再重复这种场景，会用户就会对此形成一种稳定的联系，进而形成习惯。
斯坦福大学福格博士曾提出“福格公式”，福格行为模型可以用公式来呈现，即 B = MAT。B 代表行为，M 代表动机，A 代表能力，T 代表触发。只有动机、能力 、触发三者皆备，才能跨过“行动线”。
触发：即上面所提到的外部触发与内部触发。
动机：动机决定你是否愿意采取行动。福格博士认为，驱使我们采取行动的核心动机主要是三种：追求快乐，逃避痛苦；追求希望，逃避恐惧；追求认同，逃避排斥。
能力：这里要详述的是能力，所谓习惯，是指人们在几乎无意识的情况下做出的举动。一种行为的复杂程度越低，无论是体力上的还是脑力上的，被人们重复的可能性就越大。越简单的操作成本，记忆成本越低，越容易形成用户习惯。
举个例子，刷抖音就是用户行为成本极低的场景，你在刷抖音时，不需要多余的交互行为，切换视频甚至不需要点击，只需要向上滑动。除开抖音算法的精准推荐不说，从交互层面而言，也是足够简单并且形成习惯了。
如果改变会打破认知习惯，要让用户能快速了解新设计的使用方式。最好的方式是能够让用户快速与已其他竞品的操作习惯产生关联。比如采用其他主流应用成熟的交互方式。
如果改版会很大程度上改变用户行为，也可以考虑尝试以下的方式。
· 改版操作指引：这种方式较为常见，但是仍应注意避免繁琐的操作指引，切勿把操作指引当作体验差时的解决方案。
· 兼容多种用户习惯：这种方式可以让不同用户选择适合自己的交互方式，最大程度考虑到所有用户，但同时也可能造成了功能冗杂的情况。比如安卓底部三大金刚键，后面手机全面屏时代，新增了全面屏手势。考虑到安卓老用户的使用习惯，三大金刚键（底部虚拟按键）始终被保留下来；
· 允许切换新旧版本：这种方式一般是改版变化过大，用户一时间不容易接受新的体验方式，常见于网站，如站酷早期的大改版，但是仅适用于过渡期。
当然，除上述方式外，肯定还有一些其他让改变行为习惯更舒服的方式，这里不一一列举。
多变酬赏主要表现为：社交酬赏，猎物酬赏，自我酬赏。这几种酬赏会加强用户对产品的使用习惯。
社交酬赏：人们从产品中通过与他人的互动而获取的人际奖励，比如被认同、重视、喜爱等。比如人们喜欢发朋友圈、微博等，期望得到回馈，某种程度上都是为了获得社交酬赏。
猎物酬赏：人们从产品中获得的具体资源或信息。比如浏览信息流，丰富的信息流内容为用户提供了资讯，比如刷抖音，人们追求视频的新鲜感、追求内容的丰富性都是属于猎物酬赏。
自我酬赏：人们从产品中体验到的操控感、成就感和终结感。在目标驱动下，我们会去克服障碍，即便仅仅是因为这个过程能带来满足感。就像你玩游戏，希望赢过对面，或者期待将游戏玩通关，本质上属于自我酬赏。
如果希望继续培养用户习惯，与产品产生更紧密的联系，就需要鼓励用户进行一些投入，以增加他们使用产品的可能性。行动只是用户使用的第一步，促使用户对产品的投入，才会真正增强用户与产品之间的联系，形成更强的用户习惯。但是如果用户自身没有投入，即替换成本低，那么随时都可能有被其他产品取代。
举个例子，移动互联网时期，微信早早入局，人们的关系链都在微信里面沉淀，即人们越使用微信，关系链沉淀越多，就越难以更换其他产品，所以两年前想要挑战微信的多闪、马桶 MT 和聊天宝这三款社交 App 不可避免的失败了。
用户越愿意投入，就证明用户粘性越高，在此过程中，用户习惯也会不断加强。
现阶段，人人大谈用户习惯，但是用户习惯不以自身为标准，而是需要考虑产品用户的行为特征，以及人们在使用产品时更加深层的、甚至用户本身都没有发现的习惯，这就需要设计师对习惯的产生、习惯的判断、习惯的培养有深入的认识。
一般情况下，产品不适合贸然改变用户习惯，但是在有特殊需要的情况下，还是不可避免的改变产品的用户使用习惯，当然我们需要如何让用户更加容易接受。大多数产品，都希望用户能够形成对自己产品的习惯，所以需要了解用户如何对产品产生习惯、加强习惯，使产品拥有更强的吸引力，但是良好、正向的用户习惯一定是基于用户体验的。
文章来源：站酷 作者：热风_
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
颜色可以用来区分信息图形上的数据类别和维度，是数据可视化中最常用的视觉变量之一。然而，世界上有超过8%的男性和0.4%的女性都被色觉障碍的问题困扰——他们在识别部分或者全部颜色时有困难。我们通常笼统的称这类人群为“色盲(Color Blindness)”（也称为道尔顿症、色觉缺失、色觉辨认障碍、色弱等）。面对如此庞大的特殊受众，设计师理应关注他们的需求。信息图形设计本是以向用户传递精准数据为目标，也不能忽视了这部分群体。
一. 了解色盲
“色盲能看到颜色吗？”“他们只能看到黑、白吗？”——人们常误以为色盲视觉所见的景象只有灰阶分布，其实不是的。色盲并不意味着色觉的完全丧失，而是指部分色觉受损，因此无法正确感知和分辨某些区域的颜色。色盲可以分为：红色盲（P）、绿色盲（D）、蓝色盲（T）和全色盲。其中红色盲和绿色盲最为普遍，合称为红绿色盲。全球大约2亿人都患有色盲，它的普遍程度甚至高于AB血型的人群。下面我们感性的看看色盲人眼中的世界：
从上面模拟色盲色觉的图片来看，我们可以感受到色盲人士能够辨识的色相较为有限。红色盲和绿色盲的色觉较为近似。由于红绿色盲人数占到了色盲总数的99%，我们需要更多地理解他们能看到的颜色。以下列举了红绿色盲容易混淆的颜色，以及色觉上的一些规律：
1 ) 红绿色盲难以分辨两种差别只在红色或绿色元素的颜色。如红色和绿色；蓝色和紫色（蓝+红）；绿色和棕色；红色和棕色等。
2 ) 红绿色盲人士对蓝色更为敏感。举例来说，他们会把红色和绿色、或黄色和黄绿色混淆，但却能清楚的分辨绿色和蓝绿色（翠绿色）。
3 ) 红绿色盲眼中的红色并不是一种明亮醒目的颜色。相反红色对他们来说显得非常深，而暗红色则几乎接近黑色。因此色盲人士很难分辨出文章内的深红色强调字。
4 ) 虽然色盲人士对色相的辨识能力较弱，但却对明度、饱和度非常敏感。
5 ) 相比高饱和度的颜色，低饱和度的颜色更难辨认。如天蓝色和粉红色。
也许以上的分析还是太抽象，为了更直观的看到色盲人士眼中的颜色，下面介绍几种模拟色盲色觉的工具，方便设计师们设计和检验：
Adobe自带的校样设置
Photoshop CS4和Illustrator CS4及以上版本提供了模拟红色盲和绿色盲的校样设置，对于每天都在Photoshop/Illustrator中拼搏的视觉设计师来说，这是最简便的一种方法了。选择“视图—校样设置—红色盲型/绿色盲型”
Color Oracle：http://colororacle.org/
网站Color Blind Web Page Filter：http://colorfilter.wickline.org/
二.设计解决方案
设计面向色盲人士友好的信息图形，并不意味着要设计师要放弃使用色彩这种“利器”。即便是对色觉障碍的人士来说，颜色依然是区分不同类数据的一种简单快速的表现形式。要提高信息图形的识别性和易读性，我们可以遵循这样几个思路寻找解决方案：（1）不完全依赖颜色来区分信息，同时使用多种视觉变量来编码信息；（2）选择安全的配色方案；（3）使用文字注解。
1.冗余编码
避免仅使用颜色来编码信息，应尽量同时使用多种视觉变量（如形状+颜色、尺寸+颜色、注释+颜色）来对信息编码。其中，形状包括了这样一些可使用的元素：圆形、三角形、矩形等；实线、虚线、点线等；字母、数字符号等。这里需遵循的一个原则是：使用尽可能少的颜色——结合使用不同形状符号和少量鲜艳的颜色，效果远好于只使用一种形状和多种颜色。
2.选择适当的配色
针对色盲人士的颜色识别能力，需要精心选择配色，才能避免选择容易混淆的色区。然而，要使配色能覆盖到各种色觉辨认能力的人（包括色盲、色弱和色觉正常的人群）并不是一件容易的事，尤其同一界面需要出现多种颜色时，让设计师非常头疼。日本有研究得出一组无障碍配色建议，在此分享，供大家参考。这组颜色针对色盲和非色盲人士都是易辨识的（例如它选择了朱红色代替红色，蓝绿色代替绿色，紫红色代替紫色，以减少色盲人士的困扰），它对屏显和印刷都适用，并且所有颜色的名称也容易定义。
需要注意的是，从以上配色组中选取颜色时：A. 请交替使用暖色和冷色；B. 当使用多个暖色和多个冷色时，在明度和饱和度上做出区别； C. 避免同时使用低饱和度和低明度的组合。
另外分享两个配色工具，它们都提供了针对色盲人士配色的选项，可以辅助大家进行配色：
网站CONTRAST-A-WEB V2.0 http://www.dasplankton.de/ContrastA/（打开“show color deficiency simulation”面板）
地图配色工具COLOR BREWER 2.0 http://colorbrewer2.org/（勾选“colorblind safe”选项）
三、举例
下面以几种常用信息图形为例，来说明如何为色盲用户优化信息图：
1)点状图
优化采用了这样一些手段：A.调整配色，将色盲人士容易混淆的红、绿、橙色换为红、蓝、黄色。B.调整明度，使图中几个颜色在明度上差异更明显。C.为不同元素赋予不同形状。所有使用点元素的信息图，都可以参考这种解决方式。
2)折线图
优化采用了这样一些手段：A.采用更粗的线条，使颜色更明显。（色块越小，颜色越难分辨。对有色觉障碍的人来说，带颜色的细线、小图标、细体文字尤其难区分。）B.换用不同形状的线条（实线、虚线、点线）。C.文字直接注释在线的周围。D.颜色微调。这样对每一类数据使用多重可视化变量进行编码后，即便颜色信息完全丢失，也能够完整的传递信息。所有使用线元素的信息图，都可以参考这种解决方式。
3)柱状图
通过增加底纹，直接标注文字注释的方式优化了柱状图。所有使用面的图形（如饼图），都可以参考这种解决方式。
四.写在最后
在实际设计过程中，我们不一定会同时使用到以上所有手段，需要在美观和友好之间进行权衡。我们也可以采用一些交互手段，避免同一界面中元素太多太过杂乱的问题。如highcharts这个趋势图非常优秀，它采用了易辨识的颜色，每个节点处都使用了不同形状的符号，然而仅当鼠标hover到具体节点时，会出现该条线对应的信息（“New York”）。
另外除了鼠标hover的交互方式以外，我们甚至也可以为色盲人士提供单独的色盲模式切换，这样也可以兼顾视觉上的美观，避免了太多信息的干扰。这种形式在游戏和软件中也有先例。例如iChat，一般情况下仅有不同颜色来区别用户的在线状态，但同时，它也提供了“User shapes to indicate status”选项，可以将“空闲”状态换成橙黄色三角形符号，将“忙”状态换成红色方形符号表示。
文章来源：腾讯CDC 作者：pearlfu
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
编辑导语：新基建的支持，持续利好的政策，再加上互联网红利正在逐渐向供给侧转移……诸多因素都在推动着产业互联网的发展。B端市场俨然已经成为产业互联网的代名词，尽管如此，B端市场仍然需要深度改造，我们要认清其独特性，把握B端时代的发展规律，赢得发展红利。
毋庸置疑的是，产业互联网绝对是当前的热点。无论是头部的互联网巨头，还是新入局的玩家，几乎都想要通过加持产业互联网的概念来投身到全新的风口里。
的确，在C端流量的争夺已然成为红海的大背景下，将目光转移到B端市场，我们将会发现一片充满了机会的蓝海。于是，习惯了跟随风口的人们，开始将目光投向B端市场，并且开始用自身的实践来寻找着挖掘风口的全新方式和方法。
在很多时候，B端市场，俨然成为产业互联网的代名词。
尽管B端市场的确有着非常庞大的市场潜能，并且B端市场确实需要被深度改造，但是，同仅仅只是以搭建平台和中心为代表经典互联网模式不同，B端市场或许需要投入更大的精力，或许需要建构新的商业模式，才能真正见到效果。
纵然是那些处于头部的互联网巨头，依然需要投入很多，才能在赋能和改造B端的命题上有所建树。简单来讲，B端时代是一个比C端时代的险滩暗流更多的时代。这是B端时代虽然成为一种趋势，但却一直都无法获得突破性发展的根本原因。
说到底，B端市场是一个与C端完全不一样的市场。
简单地套用C端市场的打法并不能够奏效，甚至还会失去绝佳的窗口期。找到真正适合B端时代的商业模式，并且真正能够用这套商业模式解决互联网时代无法解决的痛点和难题，或许才是B端时代的玩家们真正应该思考的关键问题。
我们都知道，在C端时代，互联网平台通常是用烧钱和补贴的方式来改变C端用户的习惯，而后再对C端用户进行收割。在这个过程当中，玩家们仅仅只是需要将平台尽可能做大即可，等到C端用户的行为和习惯改变之后，他们就可以发挥业已形成的规模效应，实现盈利。
同C端时代的商业模式不同，B端时代是一次全新的旅程，我们只有认清了它的独特性，才能真正把握B端时代的发展规律，最终赢得发展红利。
相对于C端时代动辄千万级别，甚至亿级的用户量不同，在B端时代，用户的量级会大大减少。纵然是头部的平台，它们所服务的用户都无法达到C端时代的量级。
因此，仅仅只是将目光聚焦在用户的量级上，试图通过规模效益来实现自身的发展，很显然是不对的。这是B端时代来临之后，人们简单地套用C端时代的发展模式，却一直都无法奏效的根本原因。
同C端时代一定要做大不同，在B端时代，更加考验玩家的是，是否能够做深，是否能够对一个B端玩家从头到尾进行方方面面的赋能，彻彻底底的改造。
如果一个玩家可以对一个B端用户从始至终都进行深入而又全面地改造，并且真正可以给B端用户带来本质性的变化。那么，这个玩家或许才算是真正掌握了B端时代发展的精髓。
这就需要B端时代的玩家拥有较为庞大的综合实力。他们不仅要能上九天揽月，还要能够下五洋捉鳖。由此可见，在B端时代，仅仅只是依靠概念和营销是难以实现持续发展的，只有真正成为一个多面手，真正能够给B端用户带来真正的改变，才能让B端用户买单。
如何扎根到某一个行业当中，把某个行业的内在流程和环节摸清弄透，做B端用户的“万金油”，才是确保一个B端时代的玩家可以长久发展的关键所在。所以，在B端时代，不一定要做到像C端时代那样的量级，但是，一定要比C端时代做得更深，更透才行。
互联网思维的深度影响让玩家们简单地认为，在B端时代，只需要搭建一个平台，再把B端用户聚拢在这个平台上，就可以自然而然地进入到B端时代。事实证明，在B端时代，我们真正缺少的不是撮合和中介，而是赋能和改造。
在这个大背景下，互联网时代的平台和中心的概念已经不那么重要了，如何对B端用户进行深度而又全面地赋能，如何深入到B端行业的方方面面，才是保证B端玩家真正把握风口的关键所在。
从这个角度来看，在B端时代，人们真正需要的或许并不是一个平台，而是一个中台。
同平台仅仅只是一手联通着上游的生产端，一手联通着下游的消费端不同。中台更像是一个深入到生产端和消费端的细枝末节的强大的根系，它不仅要承担联通的角色，而且还要承担输送营养和能量，改造B端角色。
可见，我们再去用平台的概念来实践B端时代的发展，依然无法真正把握B端时代的精髓，仅仅只能变成落后的B端玩家倾销传统、原始库存产品的场所，而无法成为升级、转型B端行业的助推器和营养基。
在B端时代来临早期阶段，我们看到的诸多以销售为主导的赋能方式和方法，无论是社交电商，还是社交新零售基本上都是基于平台思维出现的，而后来的发展同样告诉我们，这种平台思维无法真正奏效，以中台代替平台，才能真正把握B端时代的发展红利。
在C端时代，我们更多地看到的是你强我弱的零和游戏，即一方的强大，一定是以另外一方的弱势为基础的。这是互联网平台之所以会不断建构属于自身的生态系统，不断进行流量的争夺，并且逐渐走向封闭和垄断的根本原因。虽然这套模式在C端时代非常奏效。
但是，等到B端时代来临，我们再去用这样一种封闭的、独立的生态系统式的模式发展的时候，便会开始遭遇越来越多的困境和难题。
因此，在B端时代，我们并不一定要建构一个封闭的、独立的生态系统，而是要打破自身的局限，不断破圈才能获得更大的发展空间。当下，我们看到越来越多地互联网平台开始破圈，打破原有的生态圈的概念，正是这种现象的直接体现。
B站在破圈，快手在破圈，阿里在破圈，微信也在破圈。这说明，在B端时代，不同的生态体和平台之间同样需要不断联通，才能真正给B端产业带来改变，一味地封闭，不仅无法获得发展，甚至还将会走入到死胡同里。
在B端时代，一定要开放，一定要协同。当我们不断打破原有的圈层限制，当我们不断开启新的发展的时候，不同中心之间的协同给B端行业带来的改变才能更大。从单平台到多平台，将会成为B端时代的主旋律。
以此为开端，在我们的头脑当中所形成的根深蒂固的平台和中心的概念将会由此打破，取而代之的将会是共生体的概念。
我们都知道，伴随着B端时代的来临，人们提及最多的是“消费升级”的概念。因为在消费升级的概念出现之后，人们才会反推到产业端，用产业升级来实践B端时代，并且由此衍生出来了产业互联网的概念。
事实上，所谓的消费升级的概念，其实依然是基于C端时代诞生出来的概念，如果用这个概念来指导B端时代的发展，是无法让B端时代的发展跳出C端时代的发展怪圈的。
真正意义上的B端时代并不真正需要所谓的消费升级，但是，一定需要产业升级。因为以C端为主导的消费互联网时代遭遇困境的根本原因不是因为C端用户出问题了，而是因为B端的生产和供应方式出问题了，落后的供应端已经难以与消费端完美对接。
在这个时候，我们只有升级B端产业，通过新的生产方式和供应方式去满足C端用户的新需求，才能化解消费互联网时代的问题，再度让供求两端实现对接。
随着人们对于B端时代认识的深入，消费升级的概念开始逐渐被弱化，取而代之的是产业升级和消费平权的概念。通过产业升级，我们看到的是B端行业的生产模式和供应模式需要一场深度且全面地改变；通过消费平权，我们看到的是B端行业的用户群体需要从一二线城市转向下沉市场。
从本质上来看，无论是产业升级，还是消费平权，都是一场以B端变革为肇始点的新发展。不同的是，产业升级的概念之下，玩家们真正应该关注的是外部产业的升级；而在消费平权的概念之下，玩家们真正应该关注的是自身的升级。
伴随着B端时代出现的是产业互联网的概念，提及产业互联网的字眼，人们自然而然地将其与互联网联系在一起。
后来，随着大数据、云计算、区块链和人工智能为代表的新技术的崛起，我们看到的是一场以去互联网化为代表的新发展浪潮的来临。于是，人们开始将B端时代与互联网撇清联系，甚至开始诋毁互联网的功能和作用，去互联网化俨然已经成为一种潮流。
笔者认为，在B端时代，我们并不一定要去互联网化，而是一定要摆正互联网的位置，认清互联网的作用。在很多时候，B端时代的互联网更多地承担的是一个数字流量的获取和整合的角色，它存在的价值和意义在于为将来的数字化积蓄能量。从这个角度来看，B端时代的来临并不一定需要去互联网化，而是应该更多地需要数字化。
如何以数字化为切入点来改变消费互联网时代以互联网为主导的发展模式，通过对传统产业进行数字化的改造和整理，为传统行业的发展汲取新的发展动能，或许才是我们真正应该关注的地方。
从这个逻辑来看，B端时代并不一定要去互联网化，但是，一定要数字化。只有数字化真正实现和完成之后，B端时代才能真正完成和实现。
当产业互联网时代来临，B端市场成为一个备受关注的热门领域。很显然，B端市场与C端市场是存在着巨大区别的。认清这种区别，并且以此来落地和实践产业互联网，才能避免产业互联网走回头路，真正让产业互联网带入到属于自己的发展轨道里。
文章来源：人人都是产品经理 作者：孟永辉
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
逐帧分析方法是一种针对动态的、短暂的过程对象进行对比分析的方法。该方法可帮助设计师以微观视角完成差异分析并得出相应结论。与传统的静态截图、动态录屏方法相比，其优势是可以看到过程的全貌，对动态细节一览无余，具有较高的分析可控性。
逐帧分析方法的产生源于一次针对加载场景的体验调研项目。百度百科对于加载的定义是：所有软件要运行必须加载到内存，加载就是把需要的文件及信息读取到内存里。简单说来，所有从服务器读取信息并显示在手机屏幕上的过程都属于加载。以百度APP举例，加载的典型场景有：启动、打开FEED落地页、打开搜索落地页等。这些场景都有一个共同的特点是：动态的过程，且过程较为短暂。
基于以上特点，运用对比分析里最常见的静态截图或动态录屏方法，是无法完成分析的。原因是，静态截图对于一个动态过程来说，无法看到过程的全貌，可对比点较少，分析要素不可控（一张静态截图中，无法做到涵盖所有分析元素）。而采用动态录屏的方法进行分析时，问题也同样明显：过程太快，无法看清细节；不同视频节奏不同，对比起来比较困难。因此针对加载这种特殊的场景，就需要采用一种全新的方法既能看到过程全貌，又可以对细节一览无余。
小时候我们都玩过跑马灯的游戏，即一系列静态图片通过快速轮转，由于视觉滞留效应，便可看到一段动态影像。如果把产生动画的过程翻转过来，也就是说如果可以把一段动态影像拆成一系列序列帧，那么是否可以更好的完成影像观察？
以百度APP打开小视频落地页的加载场景为例，当我尝试将这段300ms的过程录屏拆分为18张序列帧后发现，除了可以清楚的看到过程全貌外，对于过程中的所有细节也可以一览无余。同时，序列帧可以进行任意拆分，以便完成多角度观察。
到此为止，逐帧分析方法的雏形已经产生。在之后的章节，我将为大家具体介绍如何完成序列帧分析以及如何导出序列帧。
面对一系列序列帧，我们可以通过“序列帧三要素”来导出关键数据及结论。
要素1：序列帧全流程
首先，我们进行序列帧观察的时候，需要明确定义目标对象的起点与终点。由于逐帧对比方法适用的观察对象均为短暂的动态过程，明确定义全流程的起点与终点是为了让观察过程和结论更加精准。
以百度APP打开搜索落地页为例，起点与终点分别是：点击搜索结果手指松开的第一帧与搜索落地页首屏内容全部加载完成的最后一帧（可以通过观察前后帧是否有变化得出结论）。这一要素中，可以采集到的关键数据为时长，时长可以帮助我们观察加载性能的好坏，甚至在进行竞品对比的时候，快速找出与竞品在时长方面的差异从而得出优化建议。结论输出时，需要将帧数转换成为时间单位（如何将帧数转化成时间会在后续文章中为大家讲解）。
要素2：序列帧子流程
在前文中提到，逐帧分析法的一个优势是，逐帧序列可以进行任意拆分，以便完成多角度分析。在分析的第2要素中，我们可以最大限度拆分子流程，同时需要明确每一个子流程的起点与终点。这一要素的分析中，可以采集到的关键数据为子流程时长，缺失或多出的子流程，以及子流程内部的差异。
例如在百度APP Android端热启动过程中，全流程被拆分为：启动至全屏、持续白屏态、内容加载3个子流程。通过换算，可以看到每个子流程的时长。并且在和竞品的对比中发现，百度APP缺失了持续白屏态这个子流程。而在启动至全屏的子流程中，百度APP因为没有添加过渡动画，与多数竞品是有差异的。
要素3：用户体验节点
用户体验节点的对比是逐帧分析法的第三要素，这一要素进一步深入到过程的微观视角，使得分析结论更为全面。而用户体验节点是逐帧分析法所提出的一个全新概念，其定义是：产品界面上任何一次用户可感知的变化，都叫做用户体验节点。以百度APP Android打开搜索结果页为例，整个过程的用户体验结点有5个。通过用户体验节点可以采集到的关键数据有：用户体验节点的数量以及用户体验节点的顺序。
我们以Android打开搜索落地页为例为大家进一步讲解如何完成用户体验节点数量的分析。通过对比发现，百度APP在整个加载过程中的用户体验节点数量多于竞品，多出的节点为：白屏节点、文字加载节点。虽然百度APP加载时长与竞品相差无几，但是由于节点数量较多，导致用户在等待过程中经历了过多的页面状态变化，形成了较强的视觉闪跳感，从而引发用户感知层面的错觉，认为百度的加载时长较长。因此我们可以通过减少非必要的用户体验节点，从而提升加载场景的流畅感。但是，用户体验节点的数量并非越少越好，这还要根据实际业务与优化方向来输出具体结论。
用户体验节点顺序的分析，可以参考百度APP iOS FEED打开图文落地页的示例。在这一示例中，百度APP图文落地页内容加载节点位于框架转场节点之后。但是对比竞品发现，多数竞品在这个过程中，内容加载是先于框架转场的，而这种节点顺序的优势是，转场完成后，用户即可开始浏览内容，整体感知较为流畅。这种导致阅读流畅感体验差异的原因很难通过肉眼或常规竞品对比法观察得出，由此可见逐帧分析方法针对特殊场景的分析优势非常明显。
在此，我们回顾一下逐帧分析方法的“序列帧三要素”。
要素1：序列帧全流程，可采集的关键数据有：全流程时长。
要素2：序列帧子流程，可采集的关键数据有：子流程时长、子流程是否缺失、子流程内部的差异。
要素3：用户体验节点，可采集的关键数据有：用户体验节点的数量与顺序。
工欲善其事，必先利其器。进行逐帧分析前，我们首先要将录制好的视频转化成序列帧。以下章节将为大家讲解如何导出逐帧序列。
整个过程可分为：录制、创建合成、输出3个环节。
由于系统特性，iOS和Android手机双端建议采用不同的录制手段。iOS手机可直接通过数据线连接到电脑，并使用电脑的QuickTime进行录制。这样的好处是保证了录屏的帧数基本稳定在60FPS（每秒传输帧数）；Android手机建议采用机内功能或其他录屏应用完成录制，但是安卓中低端手机很容易出现掉帧的现象，因此就需要我们在合成和输出阶段制定一个合理的输出帧数，让分析的结果更加接近真实。另外，建议录制的起始点适当延长，这样便于素材在合成阶段精准切割。
这里要为大家讲解一下如何将帧数换算成时长。以iOS的输出帧数为例，换算公式为：iOS时长= N（帧数） x 16.6ms。例如：在iOS打开图文落地页的加载过程中，百度APP总时长为：73（帧数）x16.6ms= 1217ms（约等于）。
创建合成阶段所使用的工具是AE。AE的好处是：
1.方便查看原视频帧速率，对不稳定的帧速率进行统一处理；
2.可以将视频转换为图片序列，便于后续的逐帧分析；
3.AE也可以将多个视频进行同步播放来进行对比验证。
第一步：打开AE>合成>新建合成。
这一步的目的是通过合成设置，统一帧速率。通过一系列实验，我在新建合成时，将iOS录屏的帧速率设置为60帧/秒，Android录屏的帧速率设置为30帧/秒，这样可以保证最大化的减少空白帧，使分析结果更加准确。
第二步：导入录屏
第三步：截取起止点关键帧。
在进行素材处理的时候，需要精确到每一帧，由于逐帧分析所针对场景的时长极为短暂，很可能由于一帧的差距，导致分析结果相差甚远。
以百度APP iOS端热启动过程为例，我们将录屏中手指抬起的前一帧（即icon显示出点击态）做为起点，将APP启动后填满手机屏幕的第一帧（可通过观察法，在AE中查看前后帧是否有变化）做为终点完成素材处理。
输出的路径为：菜单栏 文件>导出>添加到渲染队列，在渲染队列中找到待渲染视频，再在 输出模块>格式选择JPEG或PNG以序列导出。这一步的目的是，将一段视频文件拆分成可提取对比的逐帧画面。
最终导出的序列帧如下：
在完成分析对象序列帧导出工作后，便可开始进行逐帧分析了。
逐帧分析法是在实际项目中总结并提炼出的一种全新的分析方法。该方法对于短暂的、动态的过程非常适用，可以帮助我们从微观视角发现问题、验证问题、得出优化结论，极大的提升了分析效率和精准度。逐帧分析法也在后续的多个项目中也得到了推广和验证，希望可以帮助到大家。
文章来源：站酷 作者：MEUX
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
Meet more beautiful colors.
“色彩是我们感知世界的重要媒介，对于信息传达有着重要的作用，能使人们能够更有效的感知设计的意图和内涵，使传达更高效。且人对色彩的视觉感知与想象能力，能够指导人做出预测、理解和决策。”
-- lyft kevyn arnott
——————————
随着世界的数字化转型进程大爆发，科技把每一张有形的办公桌移到了云端，用户沉浸在数字构建的世界中。腾讯文档作为先进的生产力工具，产品生态越来越多元丰富，多品类多终端的复杂环境展现在我们面前，开始真正的朝复杂庞大的大规模设计迈进。我们希望能以更加专业、高效的设计姿态迎接腾讯文档的未来挑战。
色彩是体现品牌与基因的关键因素，构建科学高效的色彩系统，建立产品的品牌形象，对产品设计极具指导意义。
腾讯文档在色彩上也进行了一些深入的挖掘和沉淀，一方面希望带给用户全新的品牌印象和认知，另一方面构建科学有效的色彩系统，为产品的发展提供优质高效的设计系统基础。本文将聚焦于色彩系统的构建。
腾讯文档代表着效率协作的先进生产力，从云端创作到云端协作，打破了办公空间的实体界限。我们希望，新的品牌色，能够为腾讯文档塑造更加有未来科技感及智慧感的视觉感受和认知。
我们将标准色由平静的天蓝色，升级为更加生动、进取、科技、可靠的明亮清澈的钴蓝色。这种蓝色具有更多的电子意味，蕴含了更多的活力和想象力，承载了腾讯文档对未来数字世界新挑战的态度和形象的进化。
同时我们认为灰色在腾讯文档的色彩系统中起着至关重要的作用，为产品界面创造结构、表达边界、建立信息层次。我们将灰色赋予了统一的品牌认知感受，将蓝色加入到中性灰色里，生成了腾讯文档特有的蓝灰色。
至此，腾讯文档标准色进化升级，它体现了腾讯文档对可靠稳定的技术、产品体验的追求，以及对未来智能的数字世界的不断创新和进取，蕴藏着无限的可能性。
在一个科学有效的色彩系统里，往往包含至少两种色彩：主色+辅助色，两者互相搭配组合成产品体系的整体色彩感受，减少用户在产品体验中对反复出现的主色的视觉疲劳。
腾讯文档的产品生态愈来愈丰富多元。我们拥有多品类的产品，为用户提供了丰富的产品功能，其中云端协作、文档资产的沉淀管理是腾讯文档的非常重要的能力，在线文档、在线表格、在线幻灯片、在线收集表、在线思维导图、在线流程图以及文件夹等的品类图标，又是用户在对文档进行协作分享及沉淀时，识别不同类型文件的关键因素。基于此，腾讯文档相较于其他产品需要更多的辅助色。
于是，如何有效的选择既符合品牌调性又有区别度的辅助色是构建腾讯文档色彩系统的关键。在辅助色选择上，我们以邻近色、互补色、对比色为主要方法构建了辅助色彩体系。
我们以腾讯文档标准色#1E6FFF（H 218 S 88 B 100) 为起始点，S（饱和度）、B（明度）保持不变，H（色相）以218°为起点，以15°为增量或减量标准，生成24色色板。这个色板是我们选取辅助色的重要依据。
● 邻近色 在色相环中，相差15°的颜色为邻近色，凡在60°范围内的颜色都属于邻近色的范围。邻近色之间往往是我中有你，你中有我，色彩之间比较和谐。
● 对比色 在色相环中，角度相差120°-180°之间的色彩，文档使用了120°为角度来选择对比色。
● 互补色 在色相环中成180°角的两种颜色，互为补色，当这两种颜色彼此相邻放置时，它们会为这两种特定颜色创造最强烈的对比度。
为了保持腾讯文档的基础品牌调性，并保证其具有极清晰的识别度，我们以品牌蓝色为起点，选择了相对较多的邻近色，以保证在色温上保持腾讯文档整体色调的清爽感。并利用对比色及互补色，选择更加丰富多元的色相，以保证能够满足各种使用场景下对色彩的需求。
总的原则是利用邻近色构建有质感、品牌感的色彩家族，利用对比色及互补色扩展色相，以制造更强烈的色彩对比，满足一些冲突性场景。
虽然我们保持相同的饱和度和明度，使用科学的方法得到了较为合适的色相，但由于色彩本身自带感官明度属性，导致在视觉感受上的感官体验并不同频。
黄色、绿色的明度即发光度较高，蓝色就稍微偏暗一些，导致色板看起来不一致。为了让不同色相看起来更加协调，需要调整色板的明度和饱和度，以保证视觉感官体验同频且更加和谐舒适。
校正原则：
● 色相必须保持是 同类色（色相环中15°夹角内的颜色）
● 保持感官明度同频
● 保证视障群体的识别度
校正后我们得到了清澈明亮、清晰易分辨的腾讯文档的主色+辅助色。并且针对视障群体进行了色彩测试。
灰色是产品体验设计中至关重要的一节，工具型产品大部分是由各种各样的容器、面板、列表组成。灰色为产品界面创造结构、表达边界、建立信息层次，保持舒适的对比度是提高可读性和吸引用户注意力的关键。
前面我们已经定义了腾讯文档的蓝灰色，在界面的设计中，我们将其与中性的灰色结合，共同构建灰色的色彩体系 。
● 扩展蓝灰色相，应用于图标、容器，构建有层次、舒适清爽的产品界面 。
● 用带透明度的黑色，应用于字体等。
为构建一个高效易用的灰色调色板，我们将蓝灰色彩作为Y轴，有透明度的中性灰色作为X轴，两者透明度保持一致，建立起腾讯文档有梯度的、丰富的灰色调色板。
对比度是否合理是阅读体验是否舒适的重要评价维度，过高或者过低的对比度都会影响阅读体验及识别度。下图是对比度的钟型曲线图，随着对比度的增加，舒适度和识别度都在上升，但一旦超过一个界点，对比度越增加，识别度和友好度亦会逐步下降。
为保证视障用户的使用，保证足够的对比度，遵守 WCAG 2.0 的标准，我们对调色板灰色的对比度进行了可用性测试，以指导腾讯文档体验设计中灰色调色板的使用。
是：对比度在AA标准以上，符合W3C标准，可以使用。
中：仅可用于disable状态。
否：对比度在AA标准以下，不符合W3C标准，不可使用。
定义好文档的主色、辅助色以及中性色后，我们需建立完整的调色板来满足不同场景下颜色的使用。以传达品牌精神，建立色彩层级，或传达信息，或强化界面层级。
在色彩系统中，很多产品使用 Tints and shades 系统，通过在颜色上面增加白色，或者增加黑色，来改变它的明度和饱和度，形成同色系的调色板。但这种方法得到的调色板往往比较刻板僵硬，故腾讯文档采用了另一种方式，将已生成的灰色色板与色相叠加，在符合无障标准的区域，选择不同明度饱和度的色彩，形成有梯度、有层级的彩色调色板。
Tencentdocs_blue：
生成主色-蓝色色阶：
用同样的方法将辅助色生成色阶：
现在，我们有一个梯度丰富，能够支持腾讯文档设计系统的调色板了～
实际案例
实践才是硬道理，我们尝试以这个调色板为指导来调整优化腾讯文档链接色的优化调整。
为保证用户阅读体验的舒适度，链接之类的彩色文本，要求颜色在背景下可以达到4.5:1对比度以上，以使它能够清晰的从灰色文本、背景中脱颖而出。于是，我们放弃了品牌蓝_1E6FFF，选择了品牌蓝70_175CEB 作为链接色。
以后，选择颜色，so easy～
这个长长的制作调色板的故事就要结束了，我在这项工作中，重新审视过去设计中的设计决策方法，在其中学到了很多东西，希望本文对您也有所帮助。
我们经常快速的动手，依靠主观情感去选择颜色，在刚开始可能没遇到什么特别的问题，但随着产品的壮大和发展，往往会越来越凌乱。抽丝剥茧的搭建色彩系统，真正让色彩为设计服务，简化团队的工作，相信您会有更愉快的工作体验～
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
在工作中常常被问到如何表达讲述自己的设计，为了让自己的设计有理可依，对接上下游汇报工作的时候，总结以下一些方法和观点，帮助不知从何讲述自己设计的人一些语言技巧。
以下仅是个人观点，用作探讨交流，文中所有举例均为本人工作设计输出。
设计师能做出好的设计，却缺乏系统化的语言包装，“如何讲设计”不该让它成为难题，做一个有产品思维的设计师，让你的设计以理服人，我们要不止停留在视觉表层，更要从多纬度看待产品设计，本文将从以下三点简述：01.产品设计的五个层面，02.讲述设计的流程，03.关于本次总结
做好产品设计的第一步，是了解产品， 要对于产品的需求如何确定、产品定位如何决定有一个基本的认识，在产品常识里面最重要也最常用的就是产品设计的五个层面，也简称用户体验五要素——
作为UI设计师，所处的视觉设计是表现层，是确定产品的最终形态，因此也处于产品设计的顶层（能被看到），是一个具象画的呈现；其次，往里推框架层，是确定产品外观，将界面信息和导航设计有序归类，让用户使用或者理解；结构层是为用户设计一个结构化的体验，将零散的元素转化为有序立体的空间；范围层确定产品的功能和需求；最后战略层是确定产品目标和用户需求；底层逻辑结构决定上层意识形态表现，因此在设计前我们要知道产品是属于洞察阶段，设计中是属于产品设计解决方案阶段，整体的产品设计是一个概念通过无数个层面的努力，经过时间，转化为具象表现的过程，所以我们在完成一项设计时，应该讲述一个完整的设计思路 ，不要让自己的设计思路仅停留在表面。
整个产品的设计产出是一个抽象到具象化的过程，设计的前期属于产品洞察阶段，这个时候一般由团队的老板领导结合当下市场需要，有用户的需求就有商机，想出产品大致的方向（战略层）然后通过产品经理整合梳理高层的意见确定产品大致的功能和内容输出原型（范围层），交给交互设计师优化产品细节逻辑和信息具体框架，经过研发评估能够技术实现产出交互稿（结构、框架层），这里已经过渡到设计解决问题执行阶段，最后是给到界面设计师美化视觉产出高保真（表现层）。
也就是到我们自己设计输出之前要经历这么多，如果能在讲述自己设计的时候，提前去了解这些，那么设计内容就不愁没法儿讲，光是阐述自己的设计思路就可以讲出一个故事，这也是为什么现在很多品牌卖货都开始营销产品背后的故事由来。我们设计能做好，也要会用语言推销自己的设计成果。
设计是对于某件事精心准备的过程。好的设计作品，应该拥有完整的设计流程，因此我们在讲述自己设计作品的时候，有一套完整系统化的方式是非常有效的。完整的设计流程包含以下4个步骤：
第一是我们需要去了解设计的需求背景，知道大概的方向——
来源（简单理解就是谁提出的问题）需求有可能是你的老板、你的产品经理、或者交互设计、或者视觉上的问题···
背景（笼统一点，就是这个需求是新需求还是原来有然后进行改版优化）需求的基层性质是什么，原本调性是什么，我们要做什么样的产品···
目标（目标一般都是需要解决什么问题）搞清楚为什么做这个需求，能解决什么痛点，不做无用功。
谁提出的问题，是新的需求还是旧的问题，或者我们要解决什么？围绕这几个方向将你的设计概述出来，会让非专业的人也能听懂你做了什么，举个简单的例子，我们公司后台一个很小的产品bug需求，往往这种需求就是产品经理的一个截图和他标注的两句话——
然后你完成了这个需求单，在传达给非产品经理以外的人的时候，你有可能是以下转述方式——
毫无疑问，你就是将需求者的意思一字不落的转达了，但是对于其他的听者来说，你的转述平平无奇、毫无意义，甚至都没有印象你做了什么，所以你应该讲清楚这个需求的背景——
设计需求来源是谁，原本属于产品哪个模块（来源），他原来功能是怎么样的，界面上展示的结构哪里有问题（背景），视觉用了什么样的方式改成什么样，解决了什么痛点（目标）
讲清楚谁给的需求，需要解决什么问题，是在原来的基础上不变动逻辑的情况下增加了什么达到了什么目的，才让你的叙述更完整，听起来更有逻辑。如果是一项新的需求，没有背景，那还得从设计分析说起，设计分析就是让你更专业的去做事，设计分析分为——用户分析，设计目标，和设计手段三个要点：
首先用户分析就是，分析你做的东西给谁看，而用户又分为群体用户和独立用户，在c端常见的就是独立用户，他们通常不定性，且有很多特征；在b端，目标用户一般是群体，他们大多数是有场景特性和行业特性，针对独立用户和群体用户，我们得出的用户特征、基本信息、需求结论也是不一致的，所以我们应该结合产品的调性分析一下我们做出来的设计究竟给谁看给谁用。常见的用户分析方法有：用户画像、用户访谈、问卷调查、焦点小组、眼动测试、用户反馈以及大数据分析，这些方法中最简单的是用户画像，就是举实际的例子列出真实用户的特征信息及使用场景。B端用户分析方法常用大数据分析和用户反馈，这两种方式通过对接需求的上下游就可以得知。
通过用户分析得出需求结论，满足需求就能达成设计目标——
设计目标结合卡诺模型来分析，卡诺模型—反应产品性能和解决用户需求的满意度的一种非线性关系，具体想了解的可以自行百度，站在巨人的肩膀上我们看得更远。 卡诺模型具备4种属性 ：1.必备属性：满足这个需求，用户满意度不会上升，但不满足这个需求，用户不满意会大幅度降低 ；2.期望属性：提供个性化需求，用户满意度会上升，不提供此需求，用户满意度会降低； 3.魅力属性：用户意想不到的效果，提供此属性，用户满意度大幅提升，不提供也不会降低 ；4.无差异：无论提不提供，用户满意度都不会改变，根本不在意；因此在做需求的时候我们应该尽力满足基本需求和期望需求，而可有可无的需求尽量不去做，降低效率。幸福需求是不容易达到的，如果能满足是非常棒的～这里就像是满足了设计心理学的三个层次——本能、行为、反思。
接下来是大家都熟知的设计手段，适当的讲一些述专业的设计技法，用不同的手段去实现的主画面，最后达到完成设计目标这样的结果，会让你显得更专业。设计的手段有很多种，这里主要讲述常用的三种，构图排版（采用什么构图方式，为什么这样构图是因为什么设计原则）、色彩运用（为什么使用这个颜色，因为这个颜色给人的心里感知是什么样的）、设计风格（采用什么风格最贴近产品调性，为什么用这个风格），但是讲设计时一定要记住产品的调性，不能偏离产品本身，不要盲目套用绚丽的技法，否则是不合适的。
很多时候面对非专业需求方收稿时，可能看到如下话语————
（心里是不是xxxx····“万马奔腾”，用个文明点的词）
非专业人士无法理解这二者的区别，他们认为他们的设计手段能达成设计目标，而作为专业设计师的我们就应该引导对方说出设计目标，再用我们专业的手段去满足对方的目标，去实现减少改稿次数，而不是让非专业人士去指导专业人士修改设计手段。分清这两者的区别，我们就可以在设计引导中更加主动。用设计分析的方法来讲述设计，举个例子——
会议管理——会议预约移动端优化，因为这是我们原有产品EKP里面的模块，PC端和移动端都有，因此用户可能是群体也可能是个人。所以针对独立用户和群体用户都做一个用户画像，得出他们的一些需求结论，然后目前幸福需求是没有的，纯属个人建议，日后如果有此功能，想必用户的满意程度也会大大提升。
概括一下已完成的整体主要页面，分析设计目标：
头部属于流量量较高的区域，采用卡片式设计，将会议内容置于此处，作为页面信息关键层，采用左对齐方式排版，突出会议标题和时间提醒用户。
通过不同的颜色标签，区分参会人员状态——
待进行未有操作反馈，选用橙色，属于可以持续进行并有明显提醒作用
已做反馈属于成功操作，选用已有用户认知心理的绿色
已知信息拒绝参与，是不太重要的，属于不再进行的阶段，选用灰色
接下来是设计作品的产出过程，一般情况下不可见的过程，为什么要去讲， 因为一个东西从无到有是很不容易的一件事，如果能讲述过程，就可以引燃情绪共鸣，让别人记住，让自己的设计作品也能有始有终——
设计过程一般分为四个阶段：初期阶段、中期阶段、最终定稿；具体的关键词和描述可以通过以下方式提炼出来，这里就不做详细说明了。
拿运营宣传来举个例子，我们公司中秋节月饼礼盒包装主视觉设计——
整个过程应该是有一个系统化的说明的，省略为写字的地方是我们可以插入的具体图片和过程，步骤差不多就是上述这些，可以有最初阶段的头脑风暴-提取关键词-清晰定位到中期阶段的团队合作—风格拟定-精选方案-细节刻画以及和物料方沟通对接的打样确定工艺等等过程…再到最后定稿的体验还原-问题优化…主画面的诞生是不容易的，强化这种过程参与，让不被看见的事也能展现。如果实在不好记录，你可以从一开始就截图你绘制的过程——
上图是用PS截图，再用时间轴将每一帧动态循坏播放，导出GIF然后截一张不变的底图合成就可以了。
最后是数据验证阶段，这个是设计落地的直观证实，包含主观认可和客观数据，具体内容就是通过用户或者专业的人士反馈给你设计落地的好坏，来判定你做的是否优秀成功。通常这一块的数据决定你验证你前面所有的过程，只要按照该流程认真做了，最后效果通常不会太差，如果出现很大的偏差也往往是意料之外的，因该寻求团队一起解决，不是某一个人的问题。
根据以上最后我们总结，好的设计就是满足以下4个方面：好看，好用，好记，能实现。设计师要考虑的维度不仅仅在视觉层面，什么是有产品思维的设计师，就是在执行时候要考虑上下游不同职能的工作内容，如果你的设计不能实现，再好看也是白费功夫的～从产品交互视觉多层面谈设计，会让你的设计包装显得不那么单调，系统化的方法总结到此，不足之处多多包含～谢谢你的阅读！
文章来源：优设 作者：YiVi_eleven
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
出海已成为中互联网公司的不二选择，面对国际化的背景，有没有相对通用的办法去快速了解所需服务的用户，在早期给业务带来优势？
出海早已成为中国互联网公司的不二选择。相比在国内厮杀，国外有更多的人口/政策/资源红利。并且因为互联网的可复制模式，使得成熟的经验可以快速运用到国外，从而抢占先机。而做好国际化的本质就是【做好每个地区的本地化设计】，想用一套国际化的标准去用在全世界的各个地区取得成功是非常困难的
那有什么好的方法和理论能够让设计提前着落，为业务带来一线用户信息和设计价值呢？接下来我将给大家介绍一些实际的方法和案例帮助大家做国际化的设计，让自己的设计价值有理可依
*以下内容与公司无关，更多的是基于笔者国际化工作经验的复盘，如有错误，欢迎指正（Salute~）
首先我们要知道，一套通用的设计标准很难在多个国家吃的开，从而拿到用户信任
我们先来看个案例，这个是日本UBER司机端和日本滴滴司机端对比
最明显的区别在于，滴滴国际化在日本业务和Global业务这块，司机端采用的是移动端（global）+平板端（日本），而UBER则是一套方案解决全球问题，可能有些人会问，一套设计不是成本更低，效率更高么，为什么非要制作两套。这就要从决策成本的角度去考虑问题，而日本市场相对于滴滴其他地区市场有着完全不同的因素，涉及到了资本，使用场景，市场地位，用户画像等多方因素决定，这时的【成本与效率】已经无法排在做与不做的第一位了，接下来我们通过两张照片来看下日本司机的接驾场景
通过照片我们是否发现日本司机的画像其实和全世界其他的出租车司机都不太一样？是不是明显发现他们的年纪相对的更大一些？会穿制服佩戴白手套？ 那年纪更大是不是意味着司机的视力会相对于中年人有所下降，白手套是否会影响他操作屏幕交互，那针对这么不同用户群体是否需要单独设计呢？最终的目标是占领市场的话是否要根据本地情况去服务好当地司机呢？
那我再来举两个例子来看看，我们来看看针对日本本地化做的特殊设计细节在哪些方面？
案例一：针对司机群体老龄化设计———大屏幕设计：
日本属于老龄化国家，司机平均年龄更是在50岁以上，高龄人群的视力相比于青年处于退化阶段，因此对于高龄人群来说在驾驶的过程中去读和操作小屏幕来说是一件非常痛苦的事情，UBER采用的是一套国际化的设计语言并没有针对日本的市场进行单独的设计,DiDi在日本则是针对司机群体采用了单独平板端设计，更大的屏幕降低了司机误操作可能性的同时，也能将字体放大，尽可能让司机方便识别
案例二：针对日本司机人文的设计———语音接单
“日本服务业发达，体现在服务的细节。出租车司机出于对客户的尊重，都会戴上白手套。但是在带着手套的时候，司机很难去点击屏幕进行操作，而且在行车过程中，触碰屏幕本来就是不合规的行为。无论是从法律层面还是价值观层面我们都不鼓励司机做出这种行为，于是开发了语音接单的功能。考虑到司机群体的年纪特征，我们选用了在日本相对普及又好识别的“了解しました（りょかいしました）”进行快速语音接单,在新版本上线后，司机可以通过屏中屏的方式去学习语音接单功能，只有他完全掌握这个功能才会为他完全展现，如果司机因为自身原因无法很好地说出那句话，我们依旧会为他保留按钮输入的方式”------国际化业务中的本地化设计
（图片来自于SUXA文章《国际化业务中的本地化设计》-吕诚）
通过两个日本的案例我们能明确一个点【国际化实质就是做好每个地区的本地化设计】
怎么样让国际化的设计有法可依，我们先来看懂一个关系框架。做好一个产品实质是服务好每一个场景，那一个场景由哪几个方面组成，简单来说是由【业务】+【用户】组成，这并不难理解，我们作为产品设计师，首先是背靠业务，解决公司的商业诉求，给业务带来利益的同时给用户带来更多的使用价值然后获得用户的认可。在这个过程中，我们会将商业诉求和用户价值进行一个有效的结合，从而满足双方，但是还不够，因为一个场景还依赖客观的条件，比如时间和空间维度，最终也会影响整体的质量，我们将所有的因素通过包含关系展示出来
接下来我们往细的方向进行拆解，【业务】根据公司行业，阶段的不同以及基础能力的不同，呈现的点也不尽相同。最核心的点在于当前所属阶段，是1.0阶段力求生存下来，还是说2.0和竞品之间产生差异化，还是活3.0去打败竞品阶段。在不同阶段设计师要了解的事情也不同，对于1.0阶段来说，更精准的展示出用户画像和了解当地的文化与习惯是重中之重。但是到了2.0则应该更加关注产品目标与竞品的差异化竞争，通过差异化（杀手级）的功能形态获取更多的摇摆用户
不同的赛道，业务不同，打法也不同。我今天主要想讲的就是左右场景的另外一个因子【用户】。那如何定义一个用户呢？我们先来列举些具象的特征：
【外貌/文化风俗/地域特征/语言等】是一个用户的画像的基础组成，但是光有画像基础并不精确，因为每个国家的【法律/政策]同样会影响用户的行为。而在当今的互联网模式下，用户体验的提高必须得考虑各地区【硬件的水平以及当地的网络状况】，最后就是如何与【本地化的设计团队进行友好的合作】让体验和设计策略能够更加精准的传达到真实用户手里，获得用户认可，特别是在20年后，疫情的爆发导致设计师无法到前线进行真实有效的实地探测，那么加强合作以及对齐目标，为业务拿结果将是重中之重，接下来，我将对于每个影响【用户】的因子进行举例讲解
可能你知道，在给拉美客户做单的时候他们会要求你的界面颜色亮丽，看起来更加奔放，而在给亚洲客户做单的时候则会相反，整体看起来更加约束。但是你能清楚的知道背后的原因么？如果不清楚那你的这块分辨更多是依赖于经验和他人的总结。那有没有一套理论能够很好的去辅助你去分析你的客户用户画像，去支撑你的设计。答案是有的，他就是【霍夫斯泰德文化维度理论】
霍夫斯泰德文化维度理论（Hofstede's cultural dimensions theory）是荷兰心理学家吉尔特·霍夫斯泰德提出的用来衡量不同国家文化差异的一个框架。他认为文化是在一个环境下人们共同拥有的心理程序，能将一群人与其他人区分开来。通过研究，他将不同文化间的差异归纳为5个基本的文化价值观维度
百科连接：霍夫斯泰德理论详情 （<-点击快速查看）
完全不懂的可以看看上面的链接，我们这里跳过部分解释….通过文化将维度理论我们将文化价值观划分成6个维度
了解完霍夫斯泰德理论以后我们该如何去使用呢？我们先从拉美用户和日本用户的差异对比开始
通过霍夫斯泰德官网查询我们可得知差距最大的两个分别是【男性化与女性化(Masculinity versus Femininity)】与【长期取向与短期取向(Long-term versus Short-term)】，差值比例达到了46和44.
接下来我们来对【差值较大】以及【分值较高】的因素进行解释和举例，去理解背后的原因
日本是个生性好斗竞争意识强烈的民族。在日本企业中工作狂是他们男性气质的一种表现；而日本男主外女主内，62％的女性在第一个孩子之后选择辞职，也是男性气质的另一表现.
在日本想要成为一个出租车司机，就要在5年之内不能有任何违规，某些地方还会有特殊的考试，这里面的合格率并不高。并且在通过考试之后再在通过一系列的评分后，才能被评为A级或者AA级别的出租车，虽然这仅仅只是一张小贴纸，但是他也代表着一个出租车司机的荣誉。在这一方面，也体现日本社会的男性气质的确定性。
相比较日本，巴西人更会以家庭为中心、以教育为重心、博爱、具有个人风格意识。家庭是关键。家庭是巴西人生活的中心，也是其社会的核心价值观。对于一个家庭而言，家人共同用餐的时间是非常重要的，还有星期天的烧烤活动，能让更多的远房亲戚和朋友聚会。所以在巴西你很难看到休息日去工作的同事，甚至无法联系上他们：）
日本人将生命视为一个非常短暂的时刻，所以调查发现日本人普遍相信宿命论，他们鼓励节俭和现代教育的努力，作为为未来做准备的一种方式。
巴西相较于日本经济落后，人民的收入水平普遍不高，很多司机收入仅仅能够维持一家的支出，很难有结余，在巴西工资会按照周维度支付，以保证一家人的生活开支能够承担。
针对巴西的情况我们做了适合当地政策和环境的本地化服务。钱包1.0的时候我们先是和当地的银行合作推出了巴西99卡，允许司机随时提现且提现速度远远大于了当地的其他银行（48小时），那这种优势在收入较低的司机群体当中就会发挥很大的优势。在3.0的改版中，我们将钱包打造长了本地生活平台，我们允许司机通过平台去完成转账/水电费/电话费/还款等行为，原本需要走到线下便利店的服务被我们搬到了线上，更是大大的方便了使用99卡的群体。未来呢，我们将加大加多权益，达到使用场景独占的目的。通过这些服务为我们给用户带来了使用价值，同时我们也给业务带来了价值，更多的绑卡渗透率为我们后续的推广和矩阵式的打法提供了导流的入口
（99与当地银行合作的线上本地生活功能-99Pay）
日本地处自然灾害频发地带，没有丰富的自然资源，生存条件不太好，所以日本人有很强的危机意识，学会了为任何不确定的情况做好预防措施，对待事情也希望有明确性
而巴西虽然处于平原，没有自然灾害，但是因为社会安全因素，整个社会对于社恐事件还是有较强烈的危机意识，所以司机会更加关注接送流程中是否会前往不安全地区，以及乘客的质量
（日本司机的真实驾驶场景）
费用收取的正确与否也是服务体验优秀的表现，日本司机会用计步器进行计价，如果涉及到了其他的费用则会使用单独的计算器进行精确计算，这么做的原因是为了避免计算错误给乘客带来困扰和争执，那从这个环节来看，司机为了规避【计算错误的可能】而预备了计算器，减少了差体验的可能
在巴西，滴滴如果对司机派单如果过远会或者是危险地区会进行提示，允许司机取消派单。并且根据调研司机群体特别是夜班司机会有随身携带防护性的武器用来自我保护，那么也能很好的说明整个社会对于社恐事件还是有较强烈的危机意识。那么做为设计师，是不是意味着可以把危险地区的派单做的更加醒目，让司机能够更快识别，更快决策，而不是为了平台和用户利益进行隐藏。是不是可以把安全链路透传做的更强，让司乘都能更加快捷第一时间选择自助服务
每个国家的发展阶段不同，对于隐私重视程度不同，因此针对不同地区的海外市场，作为业务的合作伙伴设计师们需要针对不同的市场配套不同的安全合规方案，这一点格外需要注意，不然会被罚的很惨,通常获取地理位置/账号信息保留是每个公司都非要需要的，因此在空投其他国家之前需要了解是否立法关于隐私相关的法律，如果有则需要通过配置化将其他国家上线的隐私条款和设置方式复制过来使用
简单来说就是要做到信息安全，保护个体隐私。大家都知道在中国我们的信息被侵犯的体无完肤。其实在国外也是一样，各种权限，各种信息默认保留和上传。但是随着各国的重视，个人隐私也逐渐走向明确的法律保护层面。在拉美有LGPD，在欧洲有GPDR
GDPR 是(The European General Data Protection Regulation ）的缩写，即通用数据保护条例。是欧盟议会和欧盟理事会在 2016 年 4 月通过，在 2018 年 5 月开始强制实施的规定。
GDPR 意义在于推动强制执行隐私条例，规定了企业在对用户的数据收集、存储、保护和使用时新的标准；另一方面，对于自身的数据，也给予了用户更大处理权。也就是说在18年生效之后，如果再有欧洲任何公司App不对用户的数据进行合规处理，擅自收集信息就将会受到严惩
硬件的普及率以及新旧差异也同样影响着本地化设计，通过调研和外界公布的数据我们得知，在拉美高端手机的占比远远低于发达国家。因此在给发达地区做设计的时候可以考虑更多体验上的拓展，但是在给发展中国家做设计的时候则需要进行小屏幕最小尺寸的适配，这样做是为了最好的进行向下兼容，从而保证所有用户都能够使用。同样，如果你在给发展中国家做设计，那么复杂的动效和高清晰解析的大图最好是不要去做的
（网上后台数据展示截图）
拉美国家，基建水平滞后，网络下载的速率波动较大，且存在不稳定的情况，以及流量费用的价格差异。因此某些设计手法在较发达国家能带来体验但是在发展中国家可能会是灾难
举个例子，司机端的历史列表如果存在400条记录，如果司机有诉求想刷新查看更多的订单，是一次性下拉刷新展示全部好呢？还是一次性展示50条好呢？还是一次性展示20条呢？
答案是一次性展示20条是最稳妥的选择，因为网络的不稳定性，一次性加载太多数据会导致过长时间，而网络不稳定极有可能导致下载失败，并且一次性下载太多数据可能并不符合司机查询的最初诉求，反而浪费司机的宝贵流量，最终会引擎流量消耗过快引发进线，这里的决策是损失一些用户的体验去保障司机的收入，但是在拉美因为手机的性能/网速的稳定且快速/套餐足够便宜，因此我们可以尝试使用一次性加载全部的数据，这样能让体验感受更好
（99信用卡的申请权益展示/激活流程页面）
再举个例子，拉美物流相对没那么发达，且因为政治/经济局势的不稳定性，导致物流包裹存在无法送达的情况，如果收件人不知晓当前的状态而超出了等待的预期，那么他就会进线询问。那在这个场景我们有什么更好的办法？是否可以透传更多的包裹进度方便收件人查看，再者再将用户导流到客服自助而非进线？这样的好处一来体验的链路完善了，让司机可以找到自助的出口，二是方便我们可以更好的了解哪些地区收到邮寄的折损率最大？从而探索新的业务，发现新的机会点
聊这个话题前我们先将选择的范围进行收缩，聚焦在一个国家的一个群体内去看会比较容易解释。在巴西司机的收入的往往只能支撑下一周的家庭支出，难有结余。这也导致司机会选择双开（同时使用UBER接单或者其他竞品）或者进行其他赚钱的方法，如果整个群体都是这样的情况下，那么司机的忠诚度（这里指的忠诚度不是贬义词，而是每周的出车时长）必然下降。那样对于大盘的运力来说便是损失。那有没有什么办法帮助司机更好的应对这些问题
我们该如何思考这个问题,通过马斯洛的需求理论我们能够将人的诉求归为三类，基础的生存诉求/归属感和成就感。那这三种可以再细化成两类，物质层面的诉求和精神层面的诉求。司机愿意在滴滴平台跑单是基于了物质层面。那么，我们是不是可以丰富收入以外的奖励形式，提供活动奖励或者权益的折扣，又或者尝试下小额贷款，那这些是不是可以给用户带来价值点呢？
精神层面我们是不是也有发挥的空间，对于补贴，往往是有限的。那如何做到持续长期刺激司机群体？如果一个乘客对于司机进行了表扬和小费的激励，是不是可以给司机带来更大的信心去服务好乘客，那我们是不是要加强这方面的透传。是不是可以给司机提供虚拟奖励，让司机存在足够的拥有感和成就感，让司机群体也能感受到平台对他们的看重。如果勋章可以，那等级是不是也是成就之一呢？
不同的国家线上和现金的支付比例大不相同，这里受经济环境和政治环境影响较大。总的来说习惯了线上支付的习惯后就很难回到现金支付的环境，因为确实更加方便便利。一个国家大量使用现金支付的情况下，往往是互联网公司能做的发力点和蓝海。核心做法是通过核心业务导流到钱包模块，在与当地的银行和机构进行合作，增加卡和账户的渗透率。然后通过做权益和服务，满足用户的生活诉求，从而达到场景独占。最终将会让公司的业务矩阵从单核的核心业务到核心业务+本地生活
这里我们需要提到一个概念，i18n（其来源是英文单词 internationalization的首末字符i和n，18为中间的字符数）是“国际化”的简称。在资讯领域，国际化(i18n)指让产品（出版物，软件，硬件等）无需做大的改变就能够适应不同的语言和地区的需要。对程序来说，在不修改内部代码的情况下，能根据不同语言及地区显示相应的界面。 在全球化的时代，国际化尤为重要，因为产品的潜在用户可能来自世界的各个角落。通常与i18n相关的还有L10n（“本地化”的简称）
了解完i18n的相关背景以后我们大概可以把他定义成做国际化翻译的一个中台，所有的本地化设计在经过研发代码实现后，都会进过他们去对文案进行翻译校对，最终变成当地人可以理解的话术落地到界面上，从而进行本地化的空投，但是这里面往往存在一个适配优化的问题。大家知道英文的单词平均长度要长于汉字，而西语和葡语是英文的1.25倍到1.5倍之间，而俄语的长度更是能达到葡语的1.25倍。那么面对多国空投的适配不仅仅需要i18n进行精准翻译，还需要把控字符长度，避免折行和省略问题
我们来看下下面这个例子
（不严谨的快速翻译，只是为了更方便的展示不同文化下的文字长度）
不同国家的语言不同，文字也不同，则会存在单词，句子长度/行高的差异。如果一个产品在初期没有做好适配的话，到后期替换当地语言的时候极有可能出现文字溢出的问题，这也是为什么在做海外设计的时候最好拿当地的语言进行设计，能初筛出一些细小的问题 ，避免在和翻译中台对接的时候因为文案太长提供的空间不足而修改页面间距和留白的适配问题
如果你服务中东客户，务必需要呈现出当地的阅读排版方式（尊重本地化设计）具体的适配细节这里就不过多说了，网上搜索【RTL适配方法】即可
（Material Design中的RTL适配）
格式也是做国际化中一个非常常见且体现专业度的地方，不同国家的时间展示方式不同，会影响用户的阅读，举个例子“03/08/2019”，如果在A国理解是2019年3月8号，在其他国家复用是会存在理解成2019年8月3号的，更别说我们加上的星期之后的展示方式。这就要求我们在进行开新的国家的时候务必于前线进行更好的沟通，保障阅读的习惯和当地一致，那货币符号/地址等也应该遵守当地的习惯去展示，通常的解法是设计团队去收集信息并且与前线当地人员进行交流确认，将格式记录下来，最后与研发根据上线的国家展示不同的格式
因为时间仓促，无法面面俱到的将每个点都进行举例论证，尽可能把我认为重要的点都提了出来。理解了这篇文章并不代表看懂看明白就能做好国际化，它更像是一个方法论，帮助没做过国际化业务的同学能够快速理解当地的用户和业务的打法
希望我的文章能够抛砖引玉，给大家一些灵感，也希望更多朋友能够将国际化的经验分享给设计的朋友们。让我们一起把中国互联网国际化的业务做到越来越好
最后引用我一老哥的话进行收尾“更好的国际化就是以更好的本地化思维去看待，去理解它们。而不是仅仅以一个理性的角度去看待。要站在用户的角度去看，永远不要轻易地相信自己的理解”
文章来源：优设 作者：大完蛋
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
蓝蓝设计的小编 http://www.lanlanwork.com