在工作中常常被问到如何表达讲述自己的设计，为了让自己的设计有理可依，对接上下游汇报工作的时候，总结以下一些方法和观点，帮助不知从何讲述自己设计的人一些语言技巧。
以下仅是个人观点，用作探讨交流，文中所有举例均为本人工作设计输出。
设计师能做出好的设计，却缺乏系统化的语言包装，“如何讲设计”不该让它成为难题，做一个有产品思维的设计师，让你的设计以理服人，我们要不止停留在视觉表层，更要从多纬度看待产品设计，本文将从以下三点简述：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界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
尽管在工作中对于设计方案提出建设性和针对性的评价确实是非常难的，但不得不说，这一项技能对于每一位设计师，乃至每一位与设计师配合的职场人，都是非常重要的。
「只要我们付出了百分百的努力，最终结果一定会比第一版的设计要好。工作中，以专业的手段直接面对要解决的问题，切莫把过多的个人情绪带到工作中去，就像马东老师的米未传媒贴在墙上的标语：“有话直说是一种能力，也是一种责任。」
从业这么多年，合作过的产品、运营、市场、研发、测试形形色色，但是对于设计师专业度的评价，每个人都不一样，进行综合分析，我认为，最核心就是一下3点：
「但这里我要说的是，你自己必须做到足够专业，以下的这些是基于你给出的设计方案确实是经过认真思考后的，否则被业务方怼了也是活该。」
PART 01
在进行设计评价时，不要单纯的只是描述”我觉得…“、”我喜欢…“或者”我不喜欢…“，这无法真正解决问题，相信很多设计师也比较反感这样的评价。
我们需要深挖的是：
1、你对业务目标了解吗？该业务是用什么样的策略给目标用户带来什么价值，以及是如何实现盈利的？
2、你对设计目标清晰吗？设计师是通过何种设计策略来给用户带来价值从何实现业务目标的？
3、你有全局观吗？就是这样的设计方案是否是在现有的技术限制、用户认知约束、时间周期等等诸多条件下得到的结果？
如果没有以上，非设计师的朋友们直接指点界面颜色不好看，排版不合理，不够高大上等诸多评论，其实是很不负责任的。希望大家不要做坐在设计师背后指点江山的神。
PART 02
提问有助于设计师和业务方更好的沟通和信息传递，但在提问中不要夹杂感性的评价，而多用理性的思考。比如不要指着某个东西说”这个按钮太大了“，而要问”你为什么选择这个尺寸的按钮？“通过这种方式，你可以得到更多的背景和每个设计细节背后的原因，并感受到设计师是专业的，而不是一拍脑门的。
说服心理学中有一条铁的定律就是：”没有人喜欢被改变“。当你对我的设计指指点点的时候就证明我可能错了，为了捍卫我的设计我会非理性的做出防御性的对抗，感性的情绪表达只会让双方彼此矛盾升级，理性的表达和提问会让人更愿意交流。
所以，学会提问，比提出问题更重要。
PART 03
评价者的品味对于设计方案来说并不重要，也不应该成为讨论的重点，就像我上面说的”我觉得…“，此时你可以发出黄晓明的动图：”我不要你觉得，我要我觉得…“
不要发表“我只是个人不喜欢，最终还是看你们设计师的”这样的评论，说实话我每次听到这样的话都很火大，你都没想清楚这样不合适的理由，你跟我说什么？难道只是为了反对而反对吗？
下次如果遇到讲废话的需求方，可以直接回复：如果你不能推荐一种更好或不同的设计方案，那就别说了，不要浪费彼此的时间。
另外就是，建议必须清晰明确且可行，如果让设计师误解了你的意思，那可能比你什么都不说更严重，因为事态可能会朝着完全相反的方向发展，因此详细的阐明论点，也是一种职场沟通的能力。
PART 04
收到反馈后，首先，我们要分清哪些反馈对我们有用，哪些其实只是表达者的主观感受，把有用的吸纳进来，并做好笔记，先自我情绪冷静下来，不要急于去修改调整设计方案，多多思考流程和链路的问题。
很多设计师可能是出于多年的工作习惯，喜欢将别人的评论（尤其是有经验的设计或者领导）视为行动指南，在没有经过仔细思考的情况下采取和实施他们的想法，这很容易把自己变成一个提线木偶，久而久之彻底失去了设计师原本该有的创造力和反思能力。
设计是在美学与功能、解决用户问题与业务之间平衡的探索，设计师的方案也是在用户、公司也利益之间寻求平衡，没有一个永远正确的决定。每个人都会犯错误，每个人可能都有其背后的一番道理，无非是看问题的角度不一样而已，不要纠结于某一个细节，也不要执着于某一种特定的方案。
提升自己思考问题的视野和维度，知道如何拒绝毫无意义的反馈和评价，当你从界面细节跳脱出来看问题时，离一名真正的专业设计师就不远了。
文章来源：站酷 作者：设计情报局
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
“作为用户体验设计师，我们的使命之一就是如何以最正确，最有效的方式将产品意图传递给用户。”这也是行业中大家的共识，关于设计原则也有很多，今天想给大家介绍的是 Don Norman 在《日常事物的设计》中提到的七项基本设计原则，我们将套理论付诸实践，然后通过测试，验证和迭代来提升设计体验。
PART 01
诺曼（Norman）的七项基本设计原则可以帮助确定一系列问题的答案，这些问题从目标开始，然后通过将结果与预期进行比较后结束。这七项基本原则是：发现、反馈、概念模型、示能、意符、图示、约束条件。接下来我们将从一个实际问题出发，来谈谈以下设计原则改如何运用。
我们的第一个问题是目标—我们实现目标的动力。举个例子来说：
「目标：“我们需要找到一双新的，合脚的，确定颜色和尺寸的跑鞋。」
下一阶段是计划如何通过发现和评估我们的选择来实现我们的目标。
假设我们选择了耐克网站作为首选购物平台。当我们初次进入网站，我们会看到很多不同的选项。
「发现模块」提升了选项的可见性。清晰的导航，突出的焦点和自然的视觉层次使其更容易发现和理解。
清晰的导航有助于我们轻松找到并了解网站的主要产品。但是，移动端的体验实际体验效果并不佳，因为汉堡导航很容易将信息遮盖。
耐克网站的产品详细信息页面通过清晰的导航，突出的焦点和自然的视觉层次结构选项更容易被识别。不过，您可能会争辩说，这些复杂的信息干扰到 “添加到购物袋”的这一关键行为。
焦点是吸引人视觉的主要区域，其中包括引人入胜的图像和视频，描述性标题以及清晰的号召性用语，例如“了解更多”和“添加到购物袋”。
以上所有组件均作为视觉层次结构的一部分进行排列，以帮助我们按照接收到的重要信息的顺序进行浏览。它们的位置也符合最佳的阅读模式——例如，导航栏，过滤器控件和跑鞋结果分别组织在类别页面的顶部，左侧和右侧。
其他设计原则（包括概念模型，示能，意符，映射和约束）也可以帮助我们弄清楚如何使用该网站。
许多网站功能中都存在概念模型，尤其是用于对结果进行排序和过滤的导航和控件。这些熟悉的设计模式告诉我们它是如何使用的。例如，我们知道通过过滤器将有助于优化筛选结果。
功能可供性应用于各种网站组件，例如按钮，选择框和手风琴导航，使我们可以了解如何控制和使用它们。但是，某些能力依赖于意符来阐明预期的操作。
意符被广泛用于传达应在何处执行操作，尤其是示能较弱的扁平化按钮。一个简单的描述（例如“查看更多”或“添加到购物袋”）足以告诉我们预期的操作。
映射向我们显示了对象之间存在关系的位置，例如产品详细信息页面上，当我们选择适合的款式和颜色的选项时，我们会看到可用的尺寸和价格会与之对应产生变化。
约束限制了可以使用信息的位置，地点和时间，以减少杂乱并降低认知负担。例如，导航最初仅向我们一级导航。
购买工具为我们提供了可能选择的选项序列的概念模型。禁用状态还用于将我们的操作限制在只能选择有库存的商品的范围内。
了解了如何使用网站后，现在我们可以指定要执行的一系列操作。让我们在网站上继续进行以下活动：
「行动：购买时需选择产品规格，包括合身性，颜色，尺寸，然后将其添加至购物篮。」
概念模型、可发现性、映射、约束、示能和意符可以帮助我们确定操作顺序：选择合适的→选择颜色→选择尺寸→选择添加到购物袋。
在某些情况下，某些选项（例如大小和颜色）可能缺货。如果产品不可用，则禁用按钮状表达了操作行为的限制，只能选择有库存的商品，这是非常必要的。
不同的控件交流其功能，用法以及如何向我们展示其效果
现在，我们需要实际执行我们选择的一系列动作。示能，意符和映射将帮助我们执行操作。例如，按钮的感知外观使我们想要按下按钮，标签告诉我们控件的功能，而映射使我们能够看到刚刚操作的效果。
一个简单的确认消息会通知用户发生了什么，并提供一些其他选项的可见性
一旦执行了选择的一系列动作，我们就需要收到有关请求的信息，这就是反馈。
购物车确认消息为我们提供了有关所选跑鞋的有用反馈信息，包括名称，颜色，尺寸，价格和数量。同样还提供了成功的信息和一些其他选项。
看到这些变化之后，我们现在需要将其转化为有意义的东西。反馈对于再一次为我们提供足够的信息来确定我们的行动结果至关重要。成功信息——“已添加到购物袋”和绿色的勾号图标说明发生了什么，其他选项表示我们现在已选择购买这双跑步鞋。
每个粉丝都希望看到的确认消息–真是令人高兴的时刻！
最后一个问题询问了结果是否符合我们的期望。我们可以将结果与目标进行比较。
到目前为止，我们已经使用了所有七个设计原则来确定问题的答案。现在，反馈将能够确认我们的行为是否带来了成功的结果。如果结果不是我们期望的，那么我们至少需要了解发生了什么以及下一步该怎么做。
反馈可以诱发积极和消极的情绪。如果结果不是我们所期望的（例如错误），则它们可能会引起混乱甚至愤怒的感觉。但是，当我们实际执行的动作可以实现我们的目标时，我们将感到非常喜悦！
例如，在耐克移动应用程序 SNEAKRS 中，客户可以参加抽奖来购买限量版鞋。紧张的 30 分钟倒计时结束后，获胜者会收到一条特别的消息，确认他们的抽奖结果，这为他们的经历增添了很多乐趣。
「结果：看到此消息给我带来了真正令人满意的体验——幸运的赢家。」
PART 02
应用设计原则进行 UX 设计是非常表层的。当人们在使用该产品时，我们需要了解他们的想法，感受和看法。他们可以使用吗？他们觉得有用吗？他们会再次使用它吗？
比设计原则更重要的是与真实用户进行测试，以了解他们对设计的行为和态度。然后，可以利用丰富的用户见解来改进产品。
我们若能够越早且越频繁的测试我们的想法，就能够越早的迭代产品，以更快的速度满足用户需求以及帮助实现业务目标。以下是一些流行的研究方法的概述：
远程用户测试是非常快速与灵活的，并且非常适合于早期经常需要设计验证的情况。参与者使用屏幕录制软件收集有关设计的反馈。远程用户测试为获得更多的洞见提供了便利。
面对面用户测试，就是我们常说的线下用户访谈，这种测试要适量，通常会有一个主持人。在研究期间，主持人可能会根据问题提出任务或新的活动。这种类型的研究比较花费精力和时间，但与大多数方法相比，它可以为您提供更有价值的见解。
游击队测试是指调研团队无拘无束地采访随机人群。您可以选择某些地点来确定适合您所测试设计的受众特征。迄今为止，这种研究方法是比较节省成本的，尽管您可能需要考虑向参与者提供少量奖励，以感谢他们的时间和努力。
定量测试涉及对大量用户进行研究。典型的测试包括卡片排序，树形测试，点击测试和超时测试。这些研究可能无法为您提供用户做出某些决定的原因的答案，但是它们可以帮助确定点击次数，思维模型和完成任务比率的时间。
PART 03
一旦用户测试有了结果，就可以对结果进行了。这可能需要一个漫长的过程，即整合意见，将见解归类并提出新的改进建议。
研究建议可以帮助确定要解决的可用性问题和要关注的痛点，以及增强整体用户体验的机会。这就是 UX 流程的迭代。使用相同的原理进行设计优化，然后进行测试，直到产品满足用户需求为止。
诺曼的原则可以帮助我们加深对用户交互的理解，包括人们提出的问题类型、他们的认知过程以及情感水平。如耐克网站的案例研究所示，这七个基本设计原则可以帮助我们确定问题的答案，并找到影响积极情绪（如愉悦感）的方法。
但是，设计原则实际上只是UX过程的开始。为了确定产品的体验质量，我们需要与真实的用户一起测试设计，然后使用洞察力进行必要的迭代。
以上内容源于 Don Norman 的畅销书《日常事物的设计》。它是 30 多年前编写的，但至今仍然对设计行业有着深远的影响。当然，还有更多的原则可以采用，但是 Norman 的设计哲学可以作为我们在设计工作中遵循的 UX 基础。
文章来源：站酷 作者：设计情报局
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
一起深度用案例解析B端导航设计中的交互
hello各位在B端奋斗的小伙伴们，你是否会时常因为面对导航多种多样的形式从而面对需求时无从下手，你又是否因为虽然见过了很多的案例仍然不得导航设计的要领和精髓，没关系，今天我们就一起来解决这个在B端设计中困扰我们多时的难题，从交互的角度结合案例对导航进行一个立体的剖析
如果你准备好了那么就请系上安全带现在就发车
要探讨一个概念那么首先需要知道的是其精准的定义，才能展开研究，而所谓的导航（Navigation）的精准定义可以阐述为：是一种对信息的分类，帮助用户找到想要的信息、完成预期的任务
如果你觉得这个定义很抽象，那么不妨从这个角度去理解，如果说任何界面上的功能都能够找到在我们物理世界的隐喻的话，那么导航映射的就是我们物理世界中的路牌、导览、线路示意图等，因为立足于其功能而言，导航的作用用一种大白话的说法就是：告诉用户你从哪里来，你在哪里，你可以去哪里
由此我们对导航有了一个较为准确的把控，那么请在座的各位快速回答我一个问题，你能够告诉我以上6个内容那些不是导航吗？
3
2
1
OK公布答案，如果你的答案是2和6那么恭喜你，你对导航的理解是较为优秀的，2和6的名称大家想必也不陌生那就是：菜单，但是不夸张的说日常的工作中仍旧有不小数目的一波同学搞不清楚这二者的区别，那么如何对二者进行一个有效的区分呢
同样是从定义来入手，参照前面我们给导航进行的定义方式，菜单就是：是一种对动作的分类和集合，
帮助用户快速达到某个功能,也就是说当你对菜单的某一个栏目进行点击时会立马生成一个具体的动作，而导航则是对信息的分类与合集
那么明白了这点我们就可以对导航进行分类了，提到导航的分类大家一定会脱口而出一堆词汇如：顶部导航、底部导航、左侧导航、舵式导航、标签导航、菜单导航……没错这的确是一种分类，但他只是导航在外观这个维度的分类，并不是我们今天从交互、结构层去讨论的重点
而立足于结构来对导航进行分类又将是如何呢？较为科学的来说是以下几类：
全局导航
局部导航
辅助导航
内嵌导航
友好导航
远程导航
下面我们来对这6类导航进行一步一步的具体分析
所谓全局导航是指他可以覆盖整个产品的通路，往往表现为产品的一级分类（而且大部分情况都是一级分类），他不一定包含全局信息，但是一定可以让用户可以去到其目标的关键节点
所谓局部导航是指在同一个框架中，可以到这个节点上的上下级通路，他一定存在于严格的父子级关系中
所谓辅助导航就是提供用户在全局/局部导航不可达到相关内容的快捷途径（这个快捷途径在本产品内）
所谓内嵌导航也叫上下文导航，是指嵌入页面自身内容的导航，通常同在上下文超链接、引导搜索等
所谓友好导航是指它可以为用户提供一个便利的前进途径，在需要的时候能够找到入口信息，通常在不需要的时候成隐藏状态
所谓远程导航是指不包含在产品结构中，以独立的方式存在产品内，通常表现为网站地图、索引表（地址选择、品牌选择）等
在从结构的层面了解了导航的基本类型之后,顺便给大家提一提导航的外观，这里并不展开说，大家需要知道的是导航的外观使用遵循的是“同构异型”的准则，什么意思呢？同样的结构（比如同一组数据集：商品、商品名称、商品价格）可以嵌套进入不同的外观如：卡片式、列表、详情……这个视具体的业务情况、使用场景而定
常用的导航外观基本分为以上七种外观即：菜单栏、树状表、顶栏、选项卡、面包屑、文字链接、步骤
知道了导航的结构分类和使用场景，那么不妨来给大家一些关于导航本身的小贴士作为原则参考解决大家在实战中的一些问题
对于B端产品来说稳定相当重要！因为B端产品对于用户来说使用和学习成本、门槛较大，如果你很频繁地对其路径进行修改调整，用户就会因为产品不符合操作的习惯、心智模型对产品很容易滋生负面情绪，对于产品本身来说这样的伤害是需要尽量避免的
还是从稳定的方面来说，我们需要保证的是导航的变化不会因为产品的变化而发生很大的变化，举个很简单的例子就是当我们的产品的功能增多时，尤其是二级导航的项目增多，导致原来如果是横向布局的导航不得不改成纵向布局的导航，这就所谓的因为产品的变化发生很大的变化，所以在选择导航布局的时候就需要打下一个很好的基础便于日后的拓展
这是站在一个外观和交互共同的层面去看，导航的大小一定要足够，而且其位置一定要是用户认为足够清晰的，确保在视觉反馈的的层面对于用户来说是友好的，其次就是所有的可交互区域需要有积极的响应，与内容区要有对比，可以将其称为界面的热情度，这也是一个优秀界面的自我修养
一个页面中允许出现两个主导航，同一个界面中允许出现两个同样的导航项，并不是说一个项在导航中只能够出现一次，并没有那么死板
这对于To B 的设计来说十分重要，不同于To C的产品，B端产品的一个重点就是要符合用户的预期，所以我们一定要避免“因为有趣所以这设计”这个思路
界面上面所有的界面编排，所有的组件，所有的控件，所有的模式都是可以找到隐喻的，比如文字链和带“跳转”的文字链，它代表的隐喻是不一样的，所以我们就需要赋予其不同的外观和交互响应对应户进行反馈
回到最初导航的定义，它的本质是对信息进行分类，让用户快速完成任务，这也是导航的本职工作，很多时候不一定要拘泥于这个项目它应该严格存在于哪个层级之中这样的思路进行设计，而是根据用户的需求，如何将这个项目合理的分类于最适合的集合之中
这是一个立足于外观的点，根据大量的案例分析和眼动测试，目前市面上最为常见的按照信息权重布局的导航可分为：横向式、纵向式、纵横式，由于这部分我们不展开说，所以直接在上图整理了每种布局的特征、优劣势和应用场景
知道了上面的分类和注意事项之后，下面我们用一个具体案例来对导航的交互层面设计进行一个深度体验（因为此内容十分精彩也涉及到机密，所以不在这里做具体展示，以示意的方式来叙述），总共分为六步，看看这是否也是你工作场景中比较头疼的呢
需要搞清楚导航项的定义是因为导航项的定义决定了你的目标界面是什么，所谓的目标界面就是导航所引导你到的哪一个分类的信息处
所以我们首先先来整理一下导航中每个导航项的界面定义，这也是我们日常工作中对导航梳理十分重要的一步
当问题被罗列出来之后我们就会自然而然的产生各种各样的疑问，比如导航分类之间存在有的存在流程上的关系，但是有的分类却并不属于流程，这是为什么呢？再比如有的导航分类和导航项之间名字一样但内容却不一样这又是为什么呢……（想一想这是不是我们工作中也经常遇到的疑问呢）这都是后面我们需要去优化的地方
保留住上面的问题，我们来做第二步，这一步我们需要搞明白用户的使用路径，因为这样我们可以很好的给任务类产品做一级分类
通过基于不同角色的用户体验地图我们可以得出不同的用户操作路径，于是便可以很顺畅的得出这一套操作流程的大框架
基于业务中的任务链路推导出每一步的操作路径，于是我们就可以将用户的操作路径就可以提炼为一级导航
得出了一级导航，下面我需要角色的权限进行一下区分，这也是B端产品的必备属性
于是我们为每一个导航项进行了角色权限的梳理对应，那么一级导航中每个导航分类所对应的角色也瞬间一目了然，这里面多说一句，当用户用不同权限的账号登录产品时，能看到不同的内容这才是一个优秀的拥有权限设计的导航
到了这一部分对于一些完全没有接触过数据的同学来说理解起来可能会一些难度，我们首先需要知道的是：“相同的数据来源，可以帮我们区分界面性质，而且相同的数据来源，往往会有一组相同的界面来围绕”
在此需要记住三个概念：
1.元数据：数据属性的信息，用来支持如指示存储位置、历史数据、资源查找、文件记录等功能，例如一件商品、一个客户
2.记录集：指定数据库中检索到的数据集合，例如订单列表、发货列表
3.关系列表：对来描述对象和对象的关系，比如你和我是好友，你和我在同一个企业微信群
于是我们为导航项进行数据性质的区分归类，也就是说相同数据类型的实体往往围绕着某个元数据并且包含系列的界面，当我们这里整理完后发现，相同数据性质的实体（这里可以理解为导航项）貌似可以归类在一起，这是我们作为分类的一个依据
根据相同的数据性质将导航项归入应该归入的二级导航中，此时不妨和最初的版本进行对比，我们的一级二级导航相对而言已经通过改版清晰了很多
这一步其实是比较好理解的，很简单的法则：“高频次高优展示，低频次降低权重甚至隐藏”这是针对于二级导航中每个导航项的排布进行的设计。这里不妨把频次由高到低量化成为：实时关注、每天关注、每月关注、很少使用、极少使用这个几个概念，分别用五角星、三角形、矩形、圆形、菱形进行代表
而关于使用频次的高低甄别一般我们可以通过用户调研和数据埋点的两种常用方式来进行，这里并不展开讲
于是我们可以将使用频次作为一列新的参考放入导航项的表格中，瞬间清晰明了
根据使用频次调整每个导航项的顺序
这一步涉及的就是外观了，不妨回顾一下2.8中对于导航的三种常见布局，根据产品的操作复杂程度等综合需求，我们选择了第二种形式成为最终形式
文章来源：站酷 作者：核糖bro
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
做中后台产品的设计，基本都逃不开导航布局这个大框架。
基于用户的 Z 字形扫描行为，重要的导航应当选择左侧导航或顶部导航。
可是横着竖着有那么大差别吗？被人问道为什么这么选择，该如何回答？
今天给大家些灵感，从以下四个角度分析一下：
JR Kingsburg 曾经做过一次实验（A comparison of three-level menu navigation structures for web design），研究 3 层导航中，哪种组合使用效率更高。
这三层中，每一层都有横向和纵向两种可能性，所以实验总共有 2×2×2=8 种对照组：
他为这 8 种导航布局做了不同电商原型，让用户来买东西，并记录各种数据，结果发现了很多有意思的数据：
综合这些数据，看起来整体表现较好都是「左上上」、「左左上」、「左左左」。
科学虽然很严谨，却缺乏灵活度，例如本次试验的场景单一（电商购物），而且用来测试的界面未免也太简陋了吧！
所以我们再从其他角度思考看看。
从占据面积的角度来看，横向导航比纵向导航省地方，因为只要细细一条就好了。
然而，选项数量不多时横向是可以；选项多起来，横向导航就很拥挤了。
毕竟纵向导航方便滚动，横向导航很少有用户会尝试滚动查看的，「…」也不是什么方便的操作。
所以，如果确定选项少可以选横向，不确定或者数量多建议保险起见选纵向。
任何导航，都要占据屏幕不少空间，这对尺寸适配都是一件麻烦事。哪怕产品并不需要为移动端做响应式布局，只要是网页端，就得考虑窗口尺寸的变化问题。因为设计师的 Mac 和大量用户的 PC 甚至平板电脑之间，展示上的差异真的不小。
横向导航占据空间最小，同时也是最难做尺寸适配的。尤其是如果上面除了导航之外，还放有各种 logo、头像、图标、搜索…各种东西时。横向导航一般都有三种状态：展开、折叠和收起。但是纵向导航就简单了，只需要两个状态：展开和收起。顶多再让展开状态的宽度能够自适应变化或手动拉伸就差不多了。
这么看来，如果产品需要考虑很多不同尺寸适配的问题，纵向导航是最简单的选择，除非横向导航的内容不多维护起来不麻烦。
我之前为了研究确定按钮放在左边还是放在右边好，做了一系列实验分析，结果得出超出我预期的结论…放哪都没多大问题，统一就好。于是，我想这个问题也可以类比一下。
大部分网站都是横向导航，所以说如果产品是以网页版为主，且用户会经常穿插跳转使用其它网页，那么也使用横向导航比较符合习惯。
而无论 PC 还是 Mac，系统页面的导航在左侧的情况比较多，所以说如果产品是系统软件的话，纵向导航比较符合习惯。
然而，更更更更更重要的是，千万不要同一个产品不同端或不同子系统的导航不一样！用户很可能一会儿用这个，一会儿用那个，结果操作习惯换来换去，人都弄晕啦！还有，就是改版换导航肯定要让老用户不满，好不容易养成习惯改起来容易吗？所以说，决定导航布局时还是要谨慎才好哦。
文章来源：优设 作者：体验进阶
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
前言
在企业工作中，每一个问卷调研都始于一个商业问题，问卷的质量也决定了最终结果是否能对业务起到帮助。本文将从定义问题-问卷设计-数据清洗与分析-报告撰写这四个基本步骤相对完整地阐述企业问卷调研，希望可以给大家提供一些研究方法上的思路。
定义问题：情境分析法（SCQA）
在商业问题解决的过程中，既有公司内部的因素，也有外部行业的因素，影响因素错综复杂；周围的环境也比较容易发生变化，具有很大的不确定性；同时又要保证解决方法的可落地性，产生实际的价值。相对来说，会比较复杂。在进行问卷设计之前，更有必要的是将问题梳理清楚，再决定是否采用问卷这种方式。
1.1 结构化思考：使用SCQA描述项目
SCQA是将不确定性考虑在内，一种结构化的问题分析方法，可以比较好地系统思考、查漏补缺。它包含四个环节：
情境（Situation）：由大家都熟悉的现状或事实作为起点，包含对象、所处阶段等
冲突（Complication）：实际情况往往和我们的目标有冲突，颠覆了稳定的状态。说出行动的原因，包含威胁、机会和等着我们去克服的困难点
问题（Question）：基于冲突提出问题，要怎么解决这个困难点
回答（Answer）：我们的解决方案是什么，定位出需求点
1.2 如何洞悉情境和冲突：搞清楚为什么做调研
假设我们拿到上述案例作为调研项目，可以有两种方式去进行洞悉情境和冲突：
一是思考为什么要做这个研究；二是跟相关利益者访谈尽可能多地获取信息。
1）思考为什么要做这个研究：
- 需要回答什么问题？
- 为什么回答这些问题很重要？
- 打算如何使用最终的调研结果？
2）跟相关利益者访谈：
- 核心业务方是谁？其他业务方是？
- 每个业务方的关注点是什么？难点是什么？
- 各个相关方的目标之间是否冲突，是什么冲突？
根据上述方法，可以得到对应的情境和冲突：
情境：目前有三种产品方案A/B/C，分别对应的价格为100元/1000元/10000元。通过上述思考和信息了解，会知道这个事情和谁有关，在这个事件中承担什么角色。
冲突：B的销量不佳，跟其他方案差异不明显，瞄准客群很有可能有重叠，未成交客户难转化，希望可以方案B进行调整。在用户层，可能其他方案中的功能能满足需求，不需要购买方案B；在公司层，整体收入结构可以更优化、健康；在业务层，系统和流程可能不太合理，有些可能需要重构。
1.3 问题拆解其实是建立一个假说/逻辑树的过程
我们可以将问题进行拆解，拆解应遵循MECE原则（相互独立且完全穷尽），这么做的好处是可以把问题进行逐层分解，逐级分析，最大可能保证需要考虑的因素全面不遗漏。
案例中的问题，可以从用户方面、竞品方面、成本/利润方面进行拆解，针对每一个层面的问题又可以进行拆分。
对问题进行细致拆分之后，针对每个问题有不同的解决方案，有一些问题可以用问卷来解决，有一些问题需要使用其他方式进行解答。
问卷并不能解答所有问题～～
问卷设计
2.1 问卷的用途：定量为主
一般通过问卷来进行大样本的数据收集，主要以用户的基础数据、行为数据和态度数据为主，既可以作为独立的调研项目，可以跟其他方式进行结合，比如说结合访谈、结合企业内部的数据，本文比较推荐的方式是多种方式结合进行交叉验证，提升调研结果的可靠性。
2.2 问卷设计的原则
基于第一部分的定义问题阶段，已经对问题进行了分析，在此基础之上，我们需要确定哪些问题可以由问卷进行解答，并明确问卷的研究目标与参与对象。特别地：利益相关方（项目组成员间）在项目前期应该达成统一，避免后续产生分歧，付出额外的沟通成本不说，还有可能相互甩锅。
2.3 问卷的基本结构
一份问卷的基本结构包含标题、招募语、甄别题、主问卷、用户基本特征、结束语。
2.4有逻辑的设计问题
一份有效的问卷需要从如何提问、如何措辞、如何设置答题逻辑、如何设置题目选项这些方面去考虑，设置有效的问题。以下是问卷设计中的一些基本原则：
2.5 提升回复率的tips
个性化：在说明信件/邮件或邮件开头注明回复者的名字、研究活动的目的、所需时间。向回复者强调他们反馈信息的重要性。需要注意的是，这里出现信息错误，会降低回复率。
控制篇幅：问卷完成时间不要超过10分钟，注意控制问题数量，避免出现需要大量思考、较难回复的题型。
用户激励：奖励参与者油卡/现金红包/优惠券等，昂贵的激励物没有特别显著提高回复率，所以小的激励就可以。
数据清洗与分析
3.1 数据清洗原则
剔除有效范围外的数据：排除异常作答时间值（比如作答时间为10秒），判断为作答不认真。可以根据题项来确定，一般10道题设置筛选出60秒之内的问卷。
剔除连续重复值：在时间范围内，再核查问卷是否出现连续重复值，出现的问卷予以删除。如果问卷数量较大，可以使用STATA软件编码或Excel条件函数判断进行处理。
剔除违背逻辑一致性的数据：在时间范围内，核查问卷是否存在前后逻辑不一致的题，比如总体满意度打分为非常满意，但后续题目都选择了非常不满意。
剔除有缺失值的数据：严格来说应该将有缺失值的用户予以删除，但有时候回收样本量没有那么大，则可保留。
3.2 数据分析方法
数据分析方法有非常多，要在众多的分析方法中选择一种也是比较难的事，无论选择什么样高大上的方法都是其次，最重要的是选择的分析方法能说明问题，能体现数据的价值。
比较分析是一个简单的、比较通用的、易于理解的数据分析方法，可以分成趋势分析、特征重要性、分组分析三种。
报告撰写
最后，条理清晰地展现数据信息，表达你的观点。报告写作的过程是一个相对费劲的过程，特别是数据量多的情况下，总是觉得还有一些数据价值没有被挖掘出来，但此时不要拘泥细节，细节可以回头再补，会大大提升效率。
4.1 问卷的报告框架
报告主要发现：将总结放在最前面，阅读者可以通过简短的总结大致了解报告观点，方便他们决定是否需要继续了解详细内容
目录和分目录：报告包含的内容组成部分，让阅读者对报告内容有初步概览
调研背景和目的：陈述整个报告的背景和目的，对调研的范围进行必要说明
单页-详细内容描述：有逻辑的描述项目的发现，总结数据表现，挖掘价值
单页-详细内容描述示例：
问卷调研不止是问卷本身，还包括前期项目组沟通、项目成员分工与配合、后续结果推广、结果推动落地等，前期做好项目组沟通、明确项目分工，建立一个清晰的运行机制，有利于项目组成员对结果的认同，后续也有清晰的路径去分工解决问题。所以，每一个环节都体现工作的价值，都同样重要。希望大家在关注研究方法提升的同时，也可以更多关注更多工作方法提升。
文章来源：站酷 作者：酷家乐UED
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
“色彩是我们感知世界的重要媒介，对于信息传达有着重要的作用，能使人们能够更有效的感知设计的意图和内涵，使传达更高效。且人对色彩的视觉感知与想象能力，能够指导人做出预测、理解和决策。”
— lyft kevyn arnott
随着世界的数字化转型进程大爆发，科技把每一张有形的办公桌移到了云端，用户沉浸在数字构建的世界中。腾讯文档作为先进的生产力工具，产品生态越来越多元丰富，多品类多终端的复杂环境展现在我们面前，开始真正的朝复杂庞大的大规模设计迈进。我们希望能以更加专业、高效的设计姿态迎接腾讯文档的未来挑战。
色彩是体现品牌与基因的关键因素，构建科学高效的色彩系统，建立产品的品牌形象，对产品设计极具指导意义。
腾讯文档在色彩上也进行了一些深入的挖掘和沉淀，一方面希望带给用户全新的品牌印象和认知，另一方面构建科学有效的色彩系统，为产品的发展提供优质高效的设计系统基础。本文将聚焦于色彩系统的构建。
腾讯文档代表着效率协作的先进生产力，从云端创作到云端协作，打破了办公空间的实体界限。我们希望，新的品牌色，能够为腾讯文档塑造更加有未来科技感及智慧感的视觉感受和认知。
我们将标准色由平静的天蓝色，升级为更加生动、进取、科技、可靠的明亮清澈的钴蓝色。这种蓝色具有更多的电子意味，蕴含了更多的活力和想象力，承载了腾讯文档对未来数字世界新挑战的态度和形象的进化。
同时我们认为灰色在腾讯文档的色彩系统中起着至关重要的作用，为产品界面创造结构、表达边界、建立信息层次。我们将灰色赋予了统一的品牌认知感受，将蓝色加入到中性灰色里，生成了腾讯文档特有的蓝灰色。
至此，腾讯文档标准色进化升级，它体现了腾讯文档对可靠稳定的技术、产品体验的追求，以及对未来智能的数字世界的不断创新和进取，蕴藏着无限的可能性。
在一个科学有效的色彩系统里，往往包含至少两种色彩：主色+辅助色，两者互相搭配组合成产品体系的整体色彩感受，减少用户在产品体验中对反复出现的主色的视觉疲劳。
腾讯文档的产品生态愈来愈丰富多元。我们拥有多品类的产品，为用户提供了丰富的产品功能，其中云端协作、文档资产的沉淀管理是腾讯文档的非常重要的能力，在线文档、在线表格、在线幻灯片、在线收集表、在线思维导图、在线流程图以及文件夹等的品类图标，又是用户在对文档进行协作分享及沉淀时，识别不同类型文件的关键因素。基于此，腾讯文档相较于其他产品需要更多的辅助色。
于是，如何有效的选择既符合品牌调性又有区别度的辅助色是构建腾讯文档色彩系统的关键。在辅助色选择上，我们以邻近色、互补色、对比色为主要方法构建了辅助色彩体系。
1. 创建色相色板，保持相同明度、相同饱和度
我们以腾讯文档标准色#1E6FFF（H 218 S 88 B 100) 为起始点，S（饱和度）、B（明度）保持不变，H（色相）以 218°为起点，以 15°为增量或减量标准，生成 24 色色板。这个色板是我们选取辅助色的重要依据。
2. 以邻近色、互补色、对比色为原则选择丰富的辅助色彩
为了保持腾讯文档的基础品牌调性，并保证其具有极清晰的识别度，我们以品牌蓝色为起点，选择了相对较多的邻近色，以保证在色温上保持腾讯文档整体色调的清爽感。并利用对比色及互补色，选择更加丰富多元的色相，以保证能够满足各种使用场景下对色彩的需求。
总的原则是利用邻近色构建有质感、品牌感的色彩家族，利用对比色及互补色扩展色相，以制造更强烈的色彩对比，满足一些冲突性场景。
3. 校正辅助色
虽然我们保持相同的饱和度和明度，使用科学的方法得到了较为合适的色相，但由于色彩本身自带感官明度属性，导致在视觉感受上的感官体验并不同频。
黄色、绿色的明度即发光度较高，蓝色就稍微偏暗一些，导致色板看起来不一致。为了让不同色相看起来更加协调，需要调整色板的明度和饱和度，以保证视觉感官体验同频且更加和谐舒适。
校正原则：
校正后我们得到了清澈明亮、清晰易分辨的腾讯文档的主色+辅助色。并且针对视障群体进行了色彩测试。
灰色是产品体验设计中至关重要的一节，工具型产品大部分是由各种各样的容器、面板、列表组成。灰色为产品界面创造结构、表达边界、建立信息层次，保持舒适的对比度是提高可读性和吸引用户注意力的关键。
前面我们已经定义了腾讯文档的蓝灰色，在界面的设计中，我们将其与中性的灰色结合，共同构建灰色的色彩体系 。
腾讯文档蓝灰色相扩展：
中性灰色色相扩展：
为构建一个高效易用的灰色调色板，我们将蓝灰色彩作为 Y 轴，有透明度的中性灰色作为 X 轴，两者透明度保持一致，建立起腾讯文档有梯度的、丰富的灰色调色板。
对比度是否合理是阅读体验是否舒适的重要评价维度，过高或者过低的对比度都会影响阅读体验及识别度。下图是对比度的钟型曲线图，随着对比度的增加，舒适度和识别度都在上升，但一旦超过一个界点，对比度越增加，识别度和友好度亦会逐步下降。
为保证视障用户的使用，保证足够的对比度，遵守 WCAG 2.0 的标准，我们对调色板灰色的对比度进行了可用性测试，以指导腾讯文档体验设计中灰色调色板的使用。
是：对比度在 AA 标准以上，符合 W3C 标准，可以使用。
中：仅可用于 disable 状态。
否：对比度在 AA 标准以下，不符合 W3C 标准，不可使用。
定义好文档的主色、辅助色以及中性色后，我们需建立完整的调色板来满足不同场景下颜色的使用。以传达品牌精神，建立色彩层级，或传达信息，或强化界面层级。
在色彩系统中，很多产品使用 Tints and shades 系统，通过在颜色上面增加白色，或者增加黑色，来改变它的明度和饱和度，形成同色系的调色板。但这种方法得到的调色板往往比较刻板僵硬，故腾讯文档采用了另一种方式，将已生成的灰色色板与色相叠加，在符合无障标准的区域，选择不同明度饱和度的色彩，形成有梯度、有层级的彩色调色板。
Tencentdocs_blue：
生成主色-蓝色色阶：
用同样的方法将辅助色生成色阶：
现在，我们有一个梯度丰富，能够支持腾讯文档设计系统的调色板了～
实际案例
实践才是硬道理，我们尝试以这个调色板为指导来调整优化腾讯文档链接色的优化调整。
为保证用户阅读体验的舒适度，链接之类的彩色文本，要求颜色在背景下可以达到 4.5:1 对比度以上，以使它能够清晰的从灰色文本、背景中脱颖而出。于是，我们放弃了品牌蓝_1E6FFF，选择了品牌蓝 70_175CEB 作为链接色。
以后，选择颜色，so easy～
这个长长的制作调色板的故事就要结束了，我在这项工作中，重新审视过去设计中的设计决策方法，在其中学到了很多东西，希望本文对您也有所帮助。
我们经常快速的动手，依靠主观情感去选择颜色，在刚开始可能没遇到什么特别的问题，但随着产品的壮大和发展，往往会越来越凌乱。抽丝剥茧的搭建色彩系统，真正让色彩为设计服务，简化团队的工作，相信您会有更愉快的工作体验～
文章来源：优设 作者：腾讯ISUX
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
“搜索”是产品中一个非常必要的功能模块，搜索就像为用户提供了一条便捷的绿色通道，方便用户快速检索内容。
搜索动作在 App 中依靠搜索框来完成，好用的搜索框很大程度上决定了产品的搜索体验如何。大多数搜索框存在相似性，但真正好的搜索框会在细节上为用户带来差异化的反馈，带来很暖很贴心的感觉。
从体验层面上看，一个良好的用户体验需要具备完整的流程。搜索框的使用流程可以简单划分为：
其中使用中会涉及到跳转和输入两种不同的状态，在下面的文章里我会展开来分析。
回想常用 App 的搜索框，好像它们的样式看起来差别并不是很大，但其实每个搜索框的细节都是经过精心设计的，下面总结了几种常见的搜索框类型。
1. 搜索图标
页面上只提供一个放大镜图标，通常需要用户点击图标后才能跳转到搜索页面，例如小红书就将搜索图标放置在页面右上角。
2. 基本搜索框
基本的搜索框组成包括放大镜图标、文字提示、输入框三部分。微信主页的搜索框采用了这种基本形式，文字提示为搜索，简洁清晰。
3. 文字提示类搜索框
和基本搜索框的唯一不同的地方在于，这类搜索框中的文字提示部分不再是搜索两个字，而是根据产品需求支持预置多组文字提示并在搜索框内循环展示。
△ 在大众点评的顶部搜索框中，文字提示部分循环展示了三组不同的内容，引导用户快速检索到好吃的和好玩的。
4. 功能类搜索框
之所以叫做功能类搜索框，是在文字提示类搜索框的基础上根据产品功能的需要额外添加了常用的功能性图标，如扫码图标、拍照图标、语音图标等，赋予搜索框更多的功能属性。
△ 经常使用豆瓣看书评的同学可能会注意到豆瓣主页的搜索框中有一个扫码图标，点击之后可以快速扫描图书条码或二维码，快速识别书的内容，省去检索的麻烦。
△ 淘宝搜索框的组成更复杂，除了支持扫码外还有相机图标，方便用户拍照识别商品。
使用搜索框搜索的过程总体可以分为四部分：搜索前、点击搜索框、输入中、搜索后。设计分析过程中我们要先理清整体的搜索流程，再考虑每个状态对应的交互细节及反馈，这样才能保持逻辑清晰。
位置
大多数搜索框出现在页面顶部，作为一个大的触摸目标更符合用户的认知习惯，更容易被用户发现和使用。
△ 在苹果自带的地图应用中，搜索框放在页面中部偏下的位置，相比于顶部搜索框，这样的位置分布更方便用户单手操作。
样式
搜索前的状态除了前面讲的几种常见的搜索框样式外，有些产品会直接在搜索框增加“搜索”按钮。
△ 阿里系产品包括淘宝、支付宝、闲鱼等主页搜索框都额外添加了“搜索”按钮，相比于点击搜索框再点击键盘搜索内容推荐，直接点击按钮简化了搜索流程。
搜索框
点击搜索框后，框内的放大镜图标会消失，出现闪烁的光标引导用户输入，搜索框右侧会出现“取消”按钮。
△ 点击大众点评的搜索框后，搜索页会出现三个选项，点击每一个选项，搜索框内的文字提示都会改变，有效帮助用户提升搜索准确度，虽然是很小的点但做的很用心。
键盘
点击搜索框后会弹起键盘，在不输入内容的情况下，点击键盘自带的“搜索”按钮能查询搜索框中推荐的内容。
搜索页
搜索页的内容通常包括历史搜索、搜索发现、热门推荐等版块，记录用户的搜索行为，推荐目标商品或服务，提高转化率。
△ 豆瓣将最热门的内容都展现在搜索页中，包括实时更新的热门书影音榜单、热门小组、热门话题等，为用户提供有效的引导。
关于历史搜索我们还可以继续深入分析，思考这些记录怎么排序、最多显示几条记录……
△ 网易云音乐的历史搜索最多可以保留10条，采用横向滑动的手势交互可以节省屏幕空间。根据内容长短一屏一次可以显示2-3条记录，这会导致排在后面的历史记录不容易被用户快速发现。
△ 淘宝的历史搜索可以容纳更多的数量，当搜索记录超过两行时会有一个小的展开按钮，点击按钮可以查看早期的记录，这样既能节省屏幕空间也能最大化容纳历史记录。
删除/取消
当开始输入内容时，在搜索框的右侧会出现删除图标，方便用户一键删除输入的内容，这里要注意区分删除和取消的区别。
△ 在淘宝中点击“删除”图标，页面会返回到上一级也就是搜索页；
△ 点击“取消”按钮，页面会直接返回到主页也就是搜索前的状态。
搜索提示
在用户输入内容时，产品会根据用户输入的内容提供相对应的搜索推荐，这是搜索框的必备的交互反馈。
通过合理的词条推荐能极大降低用户的思考时间，提高搜索效率，同时省去再次点击搜索按钮的流程，降低用户的操作步骤。
字数限制
目前我所知道的大多数 App 在搜索时都没有字数限制问题。
回顾一下搜索使用场景会发现用户在搜索框内输入任何内容都是有可能的，尽量不要约束用户的输入内容。无论用户输入多少内容，点击都可以完成基本的搜索操作，这样整个流程才完整。
△ 在百度中输入过多字符时，会提示查询限制在38个汉字以内，多的字符会被忽略，虽然给出了提示但并未打断用户的操作流程，可以让用户继续完成搜索。
符合预期
搜索的理想状态是搜索到的结果符合用户的预期，满足用户的搜索需求，并把最吻合的搜索结果排在前面，为用户带来清晰的结果展示。
智能提示
智能提示是对用户输入内容上的一种提示或纠正，如果用户输入的内容有问题或不够标准，在搜索结果中会能给最贴切的搜索结果。
△ 在淘宝中输入“shouji”或“souji”，淘宝会根据拼音给出“手机”的搜索结果，但仍保留原标签，方便用户再次点击搜索；输入“手ji”时，会直接给出“手机”标签，这种差异化的反馈能更好的为用户服务。
无结果提示
△ 相比于直接显示搜索无结果的状态，拼多多的搜索结果首先会标明相关商品较少，然后将搜索内容拆分成不同的标签进一步引导用户来发现内容。
这里介绍了关于搜索框设计的一些基本体验，学会从整体到局部再到具体细节一步步分析，大家会挖掘到更多更细的设计要点。
文章来源：优设 作者：Clip设计夹
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
当公司的发展规模到一定程度时，考虑到信息安全、持续采购成本与相关风险，企业会采取自研的方式来实现部分协同工作软件的自产与自用，本文将以内部目标管理系统为例，阐述我们是如何系统化的做企业系统设计改版？
什么是OKR？
OKR，是Objectives 和Key Results 的缩写,即目标和关键结果，它是企业进行目标制定和过程管理的重要手段。酷家乐同样采取OKR的管理方法，将公司目标层层分解到团队，部门再到个人，在各个层面贯穿和统一起来，以帮助实现目标达成。
理清业务目标，制定设计策略，是系统性改版产品的前提，在实际工作中设计师很容易被产品的原型、对产品的描述蒙蔽，只有非常清楚的理清业务的目标，才能制定系统性、合理的设计策略来支撑业务，通过专业的设计方法来助力业务结果的达成，在这个项目中我们是如何做的呢？
OKR系统的改版项目最开始是高层的诉求，提的业务要求很简单“ 让大家用起来，目标管理起来”，那么如何让大家用起来、利用系统将目标管理起来是当前需要解决的的问题。
以一个普通员工【小何】为例，在OKR系统中进行OKR制定时，通常需要与多个角色产生关联：
③结束回顾，包含查看、追溯、复盘
（1） 清晰的页面结构：
让用户能明确的感知到系统的整体结构是有规律的，可以简单被理解的，即左边全局控制，右边内容展示
我们把消息类型通过两个维度定义消息的优先级：“重要性”和“紧急度”，通过四象限法则，我们拆出来了：
通过此模型和产品确定了每一个消息类型的所在位置，且清晰表达的了每个消息应当的位置
在设计的过程中，为了进一步的验证设计合理性和易用性，针对角色代表进行了8组可用性测试，最终普遍反馈新版的操作体验更好。
你是否有在听别人说某某原理法则时一脸懵B的时候？明明知道这个原理却说不出它的名字？不要紧，本文就来介绍与人机交互设计相关的15个常见的设计心理学原理，约13000字，帮助你了解产品的定位，需求目的和交互逻辑，洞悉用户的各种行为，也为自己的设计予以理论支撑。
1956年美国科学家米勒对人类短时间记忆能力进行了研究，他注意到年轻人的记忆广度为5-9个单位，就是7±2法则。与席克定律类似，神奇数字 7±2 法则也经常被应用在移动应用交互设计上。
因为人脑处理信息的能力有限，所以它通过把信息分成块和单元来处理复杂问题。7±2法则应用很广泛，例如iPhone通讯录中的手机号码被分割成”xxx-xxxx-xxxx“的形式，还有银行卡号、身份证号，我们总是喜欢把一长串数字拆分开来读写，目的就是降低记忆成本，提高信息的易读性，从而达到视觉防错的作用。
Web导航栏选项卡数量不超过9个
在设计网页导航时，如果希望用户记住导航区域的内容或者一个路径的顺序，那么数量应该控制在7个左右（不超过9个），如苹果、Dribbble、behance等网站的导航分类。
Web导航栏选项卡数量过多时
如果导航或选项卡内容很多，可以用一个树状层级结构来展示各级别关系，但要注意其广度和深度的平衡。例如人人都是产品经理和Dribbble，把更多子类别收在二级目录里。
移动端选项卡导航
在移动端应用设计中，常见的电商app例如奈雪和乐凯撒分类模块，两个产品的商品分类布局形式很相似，都是用了选项卡的方式来分类商品，层级明确，相应的提升了用户找寻单品的效率。
Tabbar区标签最多不超过5个
在移动应用设计中，底部Tabbar最少3个，最多为5个（几乎没几个超过5个），这样做除了减轻用户记忆负担，超过5个会降低视觉和操作上的体验。事实上就算只有4个，我们也经常想不起微信底部的4个Tab分别是啥。
顶部导航栏页签
我们看到的大部分app顶部导航栏的页签数量都严格遵循了7±2法则，虽然在横轴可无限滑动，
但在显示区域只保持7±2法则的显示数量，例如马蜂窝、飞猪旅行等。
金刚区图标不超过8个
我们常说的“八大金刚”就是一屏显示8个图标，超过的则放在第二屏。如果两行10个，往往第十个是“更多”入口，总的来说也没超过9个。
banner文案不超过9个字
产品运营banner主文案字数通常控制在9个字以内，在设计时也通常把长标题一分为二排两行，便于用户快速阅读，提升点击率。
在交互设计中，7±2法则是减少用户认知负荷，提升用户体验的重要环节。同时还强调了在设计过程中对产品的预见性，避免在不断为产品添加功能时，破坏原有的视觉基础。
0无需说明书
乔布斯曾说过：“苹果应该创造所有人都可以使用的产品，即使没有用户指南”。
1 一看就会
简单易懂，看一眼就明白你想说什么，不用教学就知道怎么用。
2秒法则
所谓“2秒法则”，是指用户在使用某类系统时的等待时长不超过2秒。在极短的时间内展示重要信息，给用户留下深刻的第一印象。这里的2秒只是一个象征意义上的表达，也许有一点随意，但是这却是一个合理的数量级。我们熟知的“F”浏览模式其实就是间接缩短用户看到重要信息的时长，达到快速浏览的目的。
进入App的首页加载时间如果过长就会导致用户产生厌烦情绪，很容易退出甚至卸载App的行为。因此我们看到许多应用将首页加载时的空白页进行占位图设计。
下拉刷新也是一个设计点，为避免刷新时间过长，设计师通常会在加载动画上做文章。充满趣味性的动效能安抚用户焦躁不安的心情，无形中降低了用户对等待时间的感知。
APP里面的banner设计要有视觉冲击力，如果两秒之内没有抓住用户的眼球，可能就被用户忽略了。
因此，在设计互联网产品的页面时，用户等待的时间越短，用户体验越佳。反之，就会让用户产生焦虑的情绪。
3次点击法则
用户在3次点击之内如果还没有找到他们想要的信息或了解网站特色，他们就会离开该网站。这条原则突出了清晰的导航，符合逻辑的结构和易于理解的网站层级的重要性。(来自《众妙之门》P133)
其实在交互体验中，点击的次数往往是无关紧要的。只要每次点击都是无需思考的，毫不费力地顺势进行，那么用户的挫败感就会大大降低。如果你的网站能够让用户知道他在哪里，从哪里来，要到哪里去，并且能够让用户了解如何完成目标，这样的点击即使有10次也是没有问题的。例如，在京东购买一件商品需要经过“立即购买>确定>提交订单>选择支付方式”4次点击才能到订单支付页面完成购买，这过程中可能还穿插其他的点击行为（比如选择地址、优惠券），用户并没有感受到不方便，使用过程流畅而自然。
在可用性测试领域，“三次点击”定律一直是一个很具争议内容。体现在以下几点：
·研究表明，用户在超过3次点击还没到达想去的页面时，往往并没有退出网站，而是会继续多点几次；
·当把一个3次点击就能到达的流程改为4次点击的时候，用户发现目标页面的能力反而提升了600%；
·合理的导航系统比点击次数更重要；
·比起“3次点击”，有人提出了“1次点击”定律，即用户的每一次点击都应该让他们更接近目标，同时尽量减少能干扰实现这一目标的因素；
·用户抱怨要花很长时间才能找到某个产品，实际上他们是在抱怨无法找到想要的东西，如果用户找到了想要的东西，他们就不会抱怨点击的次数了；
英国心理学家William Edmund Hick认为，在简单的判断场景中：一个人所面临的选择越多，做出决定所花的时间就越长。有时候在选择中花费太长时间从而导致决策失败。
生活中我们也经常会面临选择困难症，比如早上起床就纠结今天穿什么？中午去食堂就会纠结吃什么？造成我们如此纠结的原因就是因为选择太多了（远古人就没这些烦恼，寻找食物时逮着什么就吃什么）。
在设计中的应用
应用到界面设计中也是如此，选项越多，意味着用户做出决策的时间越长。
例如APP Store首页，改版前的首页把众多app平铺出来，对目的不明确的用户来说选择有点多。改版后的首页大幅减少了App的数量，卡片的设计方式简洁且目标清晰。
不得不面对较多选项时， 对主要和次要的选项做视觉权重区分，做好设计上的归类，提升用户做决定的效率。例如美团外卖金刚区第一行5个入口的图标在尺寸和表现手法上都比下面的入口图标要大更醒目。“我的”页面把一些低频率功能或不太重要的功能收纳到“设置”里，此外还可以通过置灰、锁定等方法间接减少选项，降低干扰。
对于多流程的任务进行分步操作，让用户专注眼前任务。 例如Clubhouse注册时，把需要用户选择的选项分步引导完成，让用户能专注当前行为。
对于多种类别的选项应当做二次分类的区分，我们都知道电商平台的品类繁多，仅通过单一分类是不够的，比如数码频道下面还分相机、影音娱乐、数码配件、智能设备、电子教育等大的分类。商品详情页的筛选功能也是贴合使用场景来设计的，所以分类不怕多，就怕混乱。
适用边界
虽然选择越少，用户做决策的时间越短，但这并不是提高用户体验的唯一标准，过度的减少选项，可能导致负面效果。
如上图右，如果在删除App的弹窗中只有一个“删除”选项，没有明显的取消之类的途径，那么用户会觉得特别难受，感觉被强迫去删除。如果当下有急需使用手机处理一些事情，那么这样会把这种负面情绪给无限放大，让用户抓狂。
希克定律主要受影响于选项的多少，但是它不适用于需要高难度阅读的任务。例如考试试题每道题只给你A、B两个选项（学渣窃喜），那也太容易蒙了，这就是希克定律在答案试题中的局限性。
希克定律是一个可以适用于设计的指南，记住要尽量减少用户在一次决策中要做的选项，因为决策效率是一个产品导致用户流失的重要原因之一。引导用户在明确的选项之间进行选择，以便快速将他们送到某个地方（例如账单支付），这将大大提升用户体验并达到你的目标。
费茨定律由心理学家Paul Fitts提出，用来预测从任意一点到目标中心位置所需时间与该点到目标的距离和大小有关，距离越大时间越长，目标越大时间越短。举例来说，你伸手去拿桌子上的咖啡杯，开始你的手臂迅速地往杯子位置移动，接着你会放慢速度直至找到杯子把手，这个杯子把手的大小与你“抓住”它有着一定的关系。
如上图所示，如果光标现在在任易地点想要去点击目标target，最短路径一定是D，最短路径上容错的最长路径是D+W，只要水平上移动超过了D+W你就点不到了，而这个点击动作所耗的时间是一个常数加上一个以D为正比W为反比的函数的和。
详细解释如下，图中红色方块代表点击目标，虚线代表移动路径，此时因为红色方块目标较大，所以用户从任何一处点击都很容易（可以用鼠标在屏幕任意点移至红色方块试试）。
相反，红色方块目标变小，快速点击就会困难很多，很难一次到位。
但如果红色方块目标很小距离很近的话，因为移动范围小，也能准确的点击到。
按钮越大越容易点击
在页面中，大而近的目标区域意味着用户不需要做太精细的调整就可以轻易的触达目标。比如页面中的大按钮。
将按钮放置在离开始点较近的地方
夸克浏览器的搜索栏就放在离手最近的屏幕底部区域，相比常见顶部搜索栏更方便操作，效率更高。
相关按钮之间距离近点更易于点击
注册登录界面，通常将「注册」和「登录」放到一起，不仅可以在视觉上增强用户对他们相关性的认知，还可以减少在他们之间的距离 。
适用边界
费茨定律鼓励减少距离，增加目标大小以提升用户效率，但反过来亦适用。比如iPhone关机按钮，没有使用点击关闭，而采用滑动操作，还把按钮放在屏幕顶部，这样明显增加了操作难度，进而避免了用户误操作。
App弹窗经常把“关闭”按钮放在卡片的右上角离手远的地方，希望用户先完成弹窗提示的任务。还有启动页广告，喜欢把“跳过”按钮放在难以点击的右上角（恰饭重要），以提高用户的误触机率提高转化。
思考小结
按钮越大越容易点击，因此在程序开发中，会增加按钮点击的热区范围，减轻用户精准点击的压力。但也不能过分的大，容易引起误触；
让相关联的内容更靠近彼此，用视觉手法增强用户对它们相关性的认知。距离产生美，注意不要靠的太近，会出事；
将按钮放置在离出发点较近的地方，比如页面主按钮一般会放在屏幕底部易操作区域；
屏幕的边角很适合放置像菜单栏和按钮这样的元素，因为在屏幕边缘和角落位置有“无限可选中”的属性，可以大胆操作而无需“微调”，参见macOS底部dock栏；
定律的反向使用可以适用一些特殊场景，比如想达到某种目的而降低按钮被点击的可能；
“任何事物都具有其固有的复杂性，无法简化”。
泰斯勒定律（Tesler’s Law）由Larry Tesler于1984年提出，也称「复杂度守恒定律」。
该定律认为：每一个过程都有其固有的复杂性，存在一个临界点，超过了这个点过程就不能再简化了，你只能将固有的复杂性从一个地方移动到另外一个地方。
生活中很多我们习以为常，感觉便捷方便的生活方式，是无数卓越的数学家、工程师、设计师等无数的时间投入，才实现的某个小功能，是他们把这些复杂性转移到自己身上替我们简化了。
说回移动端，每个应用中都有其无法简化的复杂度，也不能按照我们个人意愿去除这些功能。这就是为什么飞机稿都简洁好看，而一搬到线上就面目全非。常见的复杂性转移有：“查看更多”、“查看全部”、“查看详情”、“展开和收起”之类的文字做转移跳转，比如：顶部导航栏的更多图标，就是将常用的功能整合并隐藏在首页设计的更多功能模块中，把用户的操作范围转移到另一个地方。
除此之外，还有一些降低操作复杂度的方法：
删除、组织、隐藏
视觉层面的“降噪”方法，删除会干扰用户操作的选项；功能分类明确，围绕用户行为组织信息内容；隐藏那些不常用而又不能少的功能，延迟及阶段性展示。总的来说就是将复杂的信息收起来，展示重要且简洁的界面。
简化交互设计
可以用代码节省用户操作时间的地方，是互联网人一致的追求。例如，B站的一键三连，用户长按点赞按钮，会同时触发点赞、投币和收藏，省时省力。
算法解放“生产力”
个性化算法就是通过技术手段，将用户复杂度降低，而转移到开发者身上。抖音为什么会让人上瘾？是算法知道了你的喜好，专推给你喜欢的内容而不用自己去找，谁都喜欢私人定制。这对用户来说是一件好事，但就像鲁迅说的：“你觉得好，一定是有人在负重前行”，这里的简化复杂的难度就转移到设计和开发身上了，还逼得机器去学习。例如抖音、淘宝、知乎首页推荐的内容都是基于你的喜好定制化推荐给你的。
我们常说以用户为中心去设计，就需要从用户角度出发，在交互设计中尽量简化操作的复杂度，降低学习成本。但如“复制粘贴之父” Larry Tesler (1945-2020) 所说：“任何事物都具有其固有的复杂性，无法简化”。因此，如何取得复杂度的“平衡点”就是重要的部分，是让工程师及设计师花费大量时间去降低产品的使用难度，还是在设计中保留一定的复杂度是我们需要思考的事。
该原理是由麦肯锡国际管理咨询公司顾问Barbara Minto提出的理论，她强调结论先行，论点自上而下。
你是否遇到过这样的场景，部门开会时有人口若悬河的讲了半天，到最后你都不知道他想说什么。所以如果开会时你会走神，这不怪你，只怪讲演者说话没有逻辑，没有重点。
金字塔原理指示结构化表达遵循结论先行的原则，即任何问题都能归纳出一个中心点，让受众能够第一时间清楚你想谈论的主题。然后由数个论据作支撑，而这些一级论据可以继续由数个二级论据支撑，如此延伸，状如金字塔。自上而下，上层影响下层。
应用到交互设计上，即将信息展示的重点与交互行为的主任务优先展示，再根据用户在这个界面上所愿意停留时间逐级给予更多细节补充。以京东的商品详情页为例，首先金字塔的最上层是用户目标明确直接进行“立即购买”的底部全局按钮，其次是商品的头图和用户评价这些，让用户了解更多信息，进一步促成购买，最后一层是提供商品相关的全部信息、参数、评分等，确保交易的最终完成。在这个过程中，用户在每一层花的时间也在逐级增加，呈金字塔状。
映射到设计师身上也是如此，从设计新人到设计总监，中间差的就是一个完整的设计技能金字塔。就像升级打怪，每完成一项任务获得相应的经验值，累积的经验值帮助我们更快的升到下一级。当把工作中的需要攻克的难题一一解决之后，你的设计水平会在不知不觉中更加精进，形成一套自己的设计风格，成为一名优秀的设计师。
有趣的是，把金字塔模型倒过来就成了“用户漏斗模型”。自上而下，激励用户成长。它告诉我们：
用户的需求是永远满足不完的，所以什么值得做，什么是可分阶段去实现的是决策人需要明白的。如乔布斯所说：“消费者并不知道自己需要什么，直到我们拿出自己的产品，他们就发现，这是我要的东西”；
不断完善主要功能，以满足金字塔顶的核心用户群。决策者常常添加一些自己想要的而不是用户想要的需求，比如在信息流中添加一个广告位；
如何优化完善产品架构，检验产品策略的合理性和完整性；
防错原则由世界著名的品质管理专家新乡重夫提出，即在过程失误发生之前加以防止，是一种在作业过程中采用自动作用、报警、标识等手段。使操作人员不用特别注意也不会失误的方法。
防错原则认为大部分的意外都是由于设计的疏忽，而不是人为操作失误，可以通过优化设计把过失降到最低。该原则最初用于工业管理，后来应用于界面交互设计中，当使用条件没有满足时，常常通过功能失效来表示。
自动检测提示
bilibili在登录时输入框没有内容或没有输密码时，登录按钮处于禁用的置灰状态，只有两者都满足了才可以正常点击。此外登录功能就可能会有用户名错误、密码错误、网络超时、邮箱错误等不同的错误。通常必须账号和密码同时满足且匹配才能成功。
Twitter发帖时只允许用户输入140个字，为了提醒用户，其解决办法是在键盘上方的工具栏上显示还能输入几个字符，超过会以负数警示。知乎发布文章标题过长时也会提示错误预警。
消除可能的失误
防错法则认为大部分的出错都是产品设计的不够优秀，而不该责怪用户操作疏忽，通过设计手法可以把出错率降到最低。防错法则的核心观点是，如何有效的在用户出错之前就尽量避免错误的发生。比如，美团外卖在接受短信验证码时，系统会自动提取验证码在键盘上方显示，用户点一下就可以自动填写，省去了跳出应用——打开短信——记住验证码——再输入的繁琐过程，有效预防了出错的机率。还有微信在绑定银行卡时也是通过扫描银行卡自动提取账号，避免手动输入的出错率。
将失误降至最低
二次确认，在一些比较重要的场景让用户二次确认，通常以弹窗的形式告知用户再次让用户考虑自己的行为结果，进一步降低出错率。例如，最近大家都在用的报税App，会在提交信息前再次确认。
视觉暗示
可在视觉（置灰或隐藏）上屏蔽那些不能选的选项，避免用户点击后才报错或点击没反应。
其次，一些不可恢复的操作，视觉上通常会给强标识。例如，删除短信时的文字颜色“变红”。
为用户犯的错买单
当用户输入错误信息时，比如打错字，系统应该给予用户想要的信息，而不是无动于衷，冷漠视之。
范围限制
其实限制用户的选择并不是一个好主意，但是如果有明确的规则来定义可接受的选项，那么限制用户可以输入的类型是一个很好的策略。例如，Airbnb订房可选日期和设置闹钟时的时间范围。
研究得出，使用产品时有77.7%的错误都是人为的，防错法则可以帮助设计师站在用户体验的角度考虑设计方案，做到操作前、中、后都有及时的反馈，预测到他们有可能发生的误操作状态，让用户更快完成目标，帮助用户减少出错率。
每次拿起U盘插入电脑时，我就呆住了，到底朝那个方向才是对的？
防呆（Fool-proofing）是一种预防矫正的行为约束手段，运用避免产生错误的限制方法，使出错的机会降至最低，进而达到“第一次就把工作做对”之境界。
设计师应谨记：不要认为用户是专家。比如，我们都知道“汉堡”图标就是菜单，点击这个按钮就会调出某些功能。但是设计师忘记了普通用户可能并不理解什么是汉堡包图标、什么是面包屑、什么是抽屉式导航、什么是3Dtouch、怎样双指滑动。更何况普通用户并不会研究App，在他们眼中产品只是众多工具中的一个。因此，一定要把交互和设计做的简单，通用的图标、功能和交互方式最好保持用户熟悉的样子，减轻用户重复学习的负担。每个页面应强调一个重要的功能而不应该让用户做选择题，这些都是有效防呆的好方法。
△页面的中主按钮更突出
防呆设计是预防错误发生的方法，让非专业、无经验的用户可以高效完成正确操作，不要让用户去思考，而是我们时时为用户思考。
又被称作“简单有效原理”：“如无必要，勿增实体。”
通俗点去理解“如无必要，勿增实体”可以理解为“不要浪费较多东西去做用较少的东西同样可以做好的事情。”或者表述为“在其他条件相同的情况下，要求得越少的那个就越好，越有价值”。
应用到设计学领域，该法则认为做产品时功能上不可过于繁琐，应该保证简洁和工具化。例如，产品中为用户提供了收藏功能是否就不再需要喜欢？提供了喜欢是不是不再需要收藏？一定要保证功能上的克制。不必要的设计元素会导致使用效率降低，还会增加不可预知的后果。建议在不损及功能的前提下，干掉多余的元素，当两个设计方案都能达到设计目的时，选择较为简单的那一个有利于更好地传达内容更好地用户体验。
总的来说，我们可以结合《简约至上》一书中提到的删除、组织、隐藏、转移四个策略来将复杂的设计和体验变得更加简单。
删除：关注核心，让用户注意力集中在自己要完成的目标上，删除不必要的功能、流程和造成视觉混乱的元素等；
组织：繁琐的功能通过分块，被组织成清晰的层次结构。还记得我们前面说到的“7±2法则”吗，把项组织到7加减2个块中；分块越少，选择越少，用户负担约轻；
隐藏：隐藏那些主流用户很少使用，但自身更新需要但功能。通过渐进展示和适时出现的方法减少干扰；
转移：把合适的功能转移到合适的设备上去。让用户感觉简单的一个重要前提，就是先搞清楚把什么工作交给计算机，把什么工作留给用户。
小测试，下列饮料中哪一种给你印象最深刻呢？文末揭晓。
可口可乐、雪碧、芬达、崂山可乐、7喜、美年达
雷斯托夫效应又称隔离效应（isolation effect），以及新奇效应（novelty effect），前苏联心理学家冯·雷斯托夫认为，某个元素越是违反常理，就越引人注意，收到更多的关注。
一样东西与以往经历明显不同就产生了经历差异。比如人生中的很多第一次，第一次高考、大学的第一天、初恋、第一份工作等等。该差异也会出现在新奇面孔、电话号码记忆中。奇特的面孔和特殊的电话号码更能被人记住。
该理论以多种不同的方式应用到设计中，最明显的就是如果想要突出某个重点内容，就要使它特殊化，通过色彩、尺寸、留白、字体粗细等设计手段。利用对比来凸显想要表达的重要信息。例如金刚区、tab栏的运营活动广告，特殊化的设计让它们在背景中脱颖而出。
个人中心的会员卡为了吸引用户注意，增加开通率，都成了重点设计对象。
与以往不同的界面设计可以更加的吸引用户，加深用户的记忆，同时扩大了活动对用户的影响力。例如每年淘宝的双11首页设计都与往常不同。
Google doodle 会在一些比较特殊的日子改变 logo 的设计，把logo设计成与这个日子相关的插画或涂鸦，与平时的 logo 形成差异化，帮助人们更好地记住这个日子。
因此我们在界面设计中，若想让用户对哪个模块或者是元素引起注意或点击，就可以打破常规对该元素进行强调设计，使他在背景中脱颖而出。但是不要任何元素都强调，因为什么都强调就等于什么都没强调，就没有重点，所以要谨慎使用这个方法。
回到开篇的题目，答案是「崂山可乐」。相比其他饮料，崂山可乐遇到的少，反而成了最特别的一个了。你的答案是什么？欢迎在下方留言探讨。
食之无味，弃之可惜
损失厌恶是指人们面对同样数量的收益和损失时，认为损失更加令他们难以忍受。 同量的损失带来的负效用为同量收益的正效用的2.5倍。比如，丢100块钱的痛苦感要远高于你捡到100块钱带来的幸福感，也就是说要至少捡到300块才能平复之前的心情。
生活中类似的栗子还有很多，比如旅游时，虽然这个景点很烂，人们依然觉得来都来了，还是要看完再走才“不亏”；吃自助餐时，明明吃不下那么多，可想到花了那么多钱，就要尽可能的多吃才算“回本”，真是应了那句话：“食之无味，弃之可惜”；花了50块买了张电影票，过了10分钟发现是部烂片，就算在电影院睡觉也不愿提前走，觉得这50块钱不能白花...
那么，该如何将“损失厌恶”赋能给产品设计呢？
最典型的莫过于电商App中的各类券满天飞，比如：买二送一、3件7折、倒计时xx小时后恢复原价等等。商家就是为了营造现在不买就会错过的套路，用户也会觉得失之可惜。一年一度的天猫双11，京东618，还有情人节、中秋节等各种有的没的节日都是商家利用“损失厌恶”心理为基础刺激消费。
我们App的用户粘性不太理想，增加一个“签到”功能吧，产品经理如是说。如是我们看到各种签到得礼品，赢红包等活动。中间还不能中断，要连续签到多少天才能得到奖励，用户也担心中断的损失。
某网盘下载文件时，会给你一个10秒VIP高速下载的体验，计时过后又恢复到龟速，让你恨的牙痒痒。虽然这招有点损，但用户体验到了VIP的快感，很多人还是会乖乖成为付费会员。
产品运营中会经常发一些优惠券，虽然知道自己不会用，也要先领了再说。这些券也都有时间限制，快过期的提醒也会加快用户决策。还有0元开通会员，套路是第一个月免费，次月开始按正常价自动续费，典型的“骗”进来养肥了再“杀”。
人天生会对危险的，不好的东西避而远之。如是我们就看到保险行业，他们会用一些负面信息（空难、车祸）刺激你，用户就会产生焦虑，自然就想规避掉这些概率小的风险。例如购买机票时的意外险，QQ退出登录时的提示。
还有就是有用户自己的内容的东西，一般不会轻易舍去。拿我个人来说，飞书一直是我的写作工具，后来看到几个更好用的软件，但要想到把原来的这么多东西全部转移过去也是件很心累的事，太麻烦，还是继续用飞书好了。QQ这个“古老”的软件，估计很多人好久都没打开过了吧，但是让你删了它，你还是不愿意的，因为那上面有很多青春的回忆。
用户会将大部分时间花在其它网站上，因此他们会希望你的网站也能像他们已经掌握的其它网站一样，拥有相同的使用模式和习惯。
Jakob定律是由Jakob Nielsen提出的，他认为用户在其他网站所积累的经验教会了他们如何使用网站，所以他们会希望你的网站可以与那些熟悉的网站一样，相似的使用方式，在使用你的产品、服务、内容和信息的时候，他们不会感到恐慌，而是轻车熟路。该原则鼓励设计师遵循常见的设计模式，以避免混淆用户或导致更高的认知成本。
例如YouTube2017年改版前后的对比，在新版中，网站框架和功能上几乎没动，只是在UI上做了顺应新的设计准则，比如调整字体大小、颜色、栏目间距等。整体上和旧版没太大区别，而且还给用户提供了旧版的选择。
在移动端App中也应如此，在具有相同功能的页面，尽量保持一致。大到页面底层框架（比如电商应用中的购物流程），小到UI设计中的一个按钮，一个图标，甚至一句微文案。
在设计产品时，要先延续大众早已习惯的概念模型。然后再从自己的产品出发，对其进行改善。而不是从零开始制定自以为是的流程。
日常使用的各类修图软件，版式都高度相似，中间是图片，各种滤镜、贴纸、调整等功能都放在底部操作区域，很多相同功能的名称都一样。这是用户最熟悉的布局，可降低用户在同类软件使用的学习成本提升使用效率。
也许你会质疑当所有产品都遵循相同都设计模式，会让产品同质化严重，答案是必然的。此时需要深入了解用户的目标和心智模型（用户访谈、用户画像、用户体验地图等），并将其应用到我们的产品设计中去，缩小我们与用户心智模型之间的差距，从而获得良好的用户体验。上文YouTube例子中，就是通过简单的用户授权（新旧版本选择），避免了心智模型的不一致会带来的问题，当用户准备好随时可以切换到新的版本。相反的案例Snapchat在18年设计改版时，因为新的布局未能确保改版前后用户心智模型的一致性，导致大量用户流向竞争对手Instagram那里了。
但是也要注意设备之间的差异，比如在移动端“汉堡包”式菜单是个不错的方案，可是放到桌面端可能并不太友好，因为大屏幕可视范围更大，小小的汉堡包图标很容易被忽略，这时候平铺出来可能会更好。
思考总结
1、用户会把在其他产品使用中已熟悉的操作习惯转移到另一个看起来相似的产品上；
2、利用现有的思维模型，使用户可以专注于自己的目标上，而不是学习新的操作方式；
3、在进行必要的改版时，请给用户过渡到新版本的机会，即可以选择短时间内继续使用旧版本；
看名称挺拗口，另一种翻译叫做“对角线平衡的和谐状态”。它告诉我们浏览页面是由左上至右下的视线流，左上角是视觉第一落点区，右下角是视觉最终落点区，因此右上角和左下角都是一个强烈的视觉盲点区，大多数时容易被忽略。
在进行信息排布时，将最重要的信息放在左上角，右上角和左下角添加辅助元素，右下角作为整个视觉落点可以展示重要操作。运用视觉元素来创建一条虚拟的“线”，让用户的视线跟随左上到右下这条对角线移动，符合用户习惯性的眼动规律。
古腾堡图表应用最典型的例子就是商品详情页，在界面的顶部展示商品图片、名称、价格、快递和优惠等用户主要关心的信息；右上和左下通常是分享、客服和收藏等次要信息；右下角则放置最终促成用户交易的购买按钮。
我们都知道一般页面按钮都在界面底部是因为离手近，方便操作，但不仅仅如此。还因为浏览是用户的第一行为，他们的视线会根据页面元素进行移动，最终停留在底部结尾的地方。
看各种社交产品评论、点赞的位置，就知道产品希望用户先干什么的想法。
弹窗的按钮摆放一般都是左「取消」右「确认」，目的是让用户最快地看到主要操作内容。
余额宝的「转出」在左，「转入」在右，毕竟谁也不想财往外流是吧。
既然如此，为什么“发布”页面的按钮都在右上角呢？因为发布页是属于“编辑页面”，需要用户谨慎操作，这里关注的核心应该是可编辑内容区域，而不是按钮本身。
类似的例子还有很多，设计中与此视觉流与节奏规律相似的还有F型布局和Z型布局，合理运用这些节奏模式，使用者会跟随你“设计”的视觉流和运动规律来浏览页面，有效提高用户阅读的节奏和理解能力。
美国心理学家亚伯拉罕·马斯洛（Maslow.A.H.）从人类动机的角度提出需求层次理论，该理论强调人的动机是由人的需求决定的。他将人类需求分成生理需求、安全需求、社交需求、尊重需求和自我实现需求，依此由低层次到高层次的过程。马斯洛需求层次理论最大意义就在于，它告诉了我们，人在满足了基本的需求之后，就要去实现更高的需求和目标。
马斯洛需求层次理论有两个基本出发点，一是人人都有需求，某层需求满足后，另一层需求才出现；二是在上层需求未获满足前，首先满足迫切需求，该需求满足后，后面的需要才显示出其激励作用。例如，在能感受到爱之前，他们的生理和安全需求一定要得到满足。
回归到产品，一款产品，最核心的是解决用户的需求。马斯洛需求层次理论，为产品的需求分析指明了方向。
生理需求：满足人的最基本需求，如衣、食、住、行、生理方面的需求。诸如美团外卖、淘宝、马蜂窝等为日常生活提供方便的应用；
安全需求：人生安全、财产保险，也是强需求。如是各类投资理财软件层出不穷。
社交需求：包括友情、亲情、爱情多个层次，满足人类社会关系，让每个人不再是孤单的个体。如是微信、微博、Soul、探探、陌陌等不同类型的社交软件多如牛毛；
尊重需求：每个人都有被尊重的需求，都希望展现自己，获得人们认可。此需求可以深度结合在社交需求中。
自我实现：最高层级的需求，完成与自己的能力相称的一切事情，实现自己理想的需要。结合到产品可以理解为能满足自己外在展示（炫耀）的需求，如各类美颜软件，美化后的照片晒到朋友圈，给人看到最好的一面。
由此规律可以看出，越靠近底层需求越是刚需，越往上，就变得越来越不必要，如自我实现，变得可有可无，不再是所有人的刚需。一个优秀的产品，深谙人性满足用户核心需求，才能形成持续稳定高用户粘性的产品。
序列效应法则又叫系列位置效应，是指一种记忆现象： 在列举项目时,排在最前面与最后面的元素，要比排在中间的更容易让人记住。
因为人们对排在头、尾的项目，要比排在中间的更容易记起来。比如我们都知道第一位登上月球的宇航员是阿姆斯特朗，却很少人知道第二位奥尔德林；班级里我们一般都知道成绩最好的第一名和倒数第一名，至于排在中间的很难记住。因此对排在开头的项目产生加强的回想效果，称为“首位效应”( primacy effect)。对排在结尾的项目产生加强的回想效果，称为“近因效应”( recency effect )。
分类页签中，我们通常都会记得“精选”、“热门”这类标签，是希望给用户进入App后看到的主要内容。这就是“首位效应”，把重要性高的内容放在首要位置。
我们都知道界面中“返回”按钮放在左上角，除了操作习惯和防误触外，还因为它出现在页面左上角最开始的地方，更长久地储存在长期记忆之中，需要“返回”时能够快速回忆出来。
tabbar数量不管是3个还是5个，用户通常都会记得第一个“首页”和最后一个“我的”，对排在中间的都会选择性的忽略掉。
有时候新上一个功能，产品想提高它的位置引起用户注意，会和“我的”互换位置。例如网易云音乐，新版本中把“我的”放在第三个tab，为了提升“云村”重要性，把它放置最后一个tab，正是利用了“近因效应”。
近因效应常用于及时进行反馈的设计界面中，比如点赞、评论、分享等功能置于底部不仅可加深印象，同时用户在看到有趣的内容，想要评论或分享时，不用等到文章看完即可操作。从而增强内容粘性，提高互动率。
用户的记忆具有系列位置效应，而且人的短期记忆非常有限，通过序列效应法则的应用，我们可以帮助用户减轻记忆负担。在排列项目时，把重要的放在首位或末尾，以达到最好的记忆效果。
文章来源：站酷 作者：Fyin印迹
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
蓝蓝设计的小编 http://www.lanlanwork.com