Dribbble 平台对于互联网 UI 界面设计有着举足轻重的定位，对 Dribbble 设计的研究会让我们看清设计的方向。
为了保证这篇文章的质量，Dribbble 年度的每个作品都超过 550 赞。在此原则下挑选了 828 件作品，作品总的大小为 2.2G。
从挑选出的 828 件作品中，排名前十的作品中 9 件为 B 端设计，另一件作品也是 B 端产品 C 端化的产物。其中：
明眼人都能看出其中的比重关系，B 端设计再次大火，为什么是再次？因为 B 端设计之前火过，只不过没有赶上一个好的时代，在 C 端设计风光的十年里而忽略了其存在。随着 C 端市场饱和与数字化的浪潮下，实体经济、ToB、ToG 的产业再次迎来了它的曙光。视频动效的作品占比也已超过 C 端界面设计，相信今年视频动效作品占比还会再次提升。
Dribbble 年度最佳作品来自大家最熟悉的 UI8 团队中的 Tran Mau Tri Tam ✪，作者来自越南西贡，最佳作品截止目前355K浏览量，2933个赞。
为什么看似平平无奇的作品却能获得 Dribbble 年度最佳作品呢？既不是 C 端也不是纯 B 端的作品，更像一个网页与平面的结合体。如果去掉搜索图标、分类图标和按钮，你可以理解它就是一个平面作品，一个字体加几何形体构建的作品，为了丰富画面的层次，让画面更加的活泼采用了多彩加几何色块，让标题阅读有停顿感和呼吸感。faster 底部的横线让它从标题文字中脱颖而出，这种使用线条突出重要信息的设计也是今年Dribbble 设计流行趋势之一。
MetroUI 是 Windows8 的界面设计语言，在 2010 年至 2013 年间曾经风靡一时，那也是移动互联网的发展元年，现在国家推行实体经济、数字化带动 To B、To G 的发展元年，通过几何色块（MetroUI）实现 B 端产品与 C 端设计风格的传承与衔接，你会发现历史总是惊人的相似。最后背景结合今年最流行的微软风，毛玻璃的多彩高斯模糊渐变风，年度作品当之无愧。
最后来看下按钮的设计，正常的按钮要么文字加色块，要么左图标加右文字，它设计成左文本加右图标，更加注重信息的可读性和易读性，也体现 B 端设计重功能和交互体验，视觉点到为止的设计理念。
下面我们来欣赏年度最佳作品里面的流行趋势吧。
1. 易读性（停顿感）
字体三原则：可读性、易识性、易读性。当你同时读一篇文言文和一篇设计文章，肯定设计文章的内容可读性更好。易识性是用在字体设计上，不能过于浮夸的改变字体骨架、形体而不易识别。易读性和每个位设计师都息息相关，因为我们都需要编排文本。当我们小时候写作文时，不会写的文字可以用拼音代替。这时候读者读到拼音时会有停顿感，更加适合用户阅读。
通过给用户制作停顿感来增加用户的易读性。可以在相关联文本后面添加图片、表情、图标来更好的理解文本内容，丰富文本内涵。比如情侣间表达爱意时会输入文本，“我爱你”、“我 Love 你”、“我 ai 你”、“我❤️你”，哪个更加会有情感共鸣呢？不言而喻，相信你心中已经有答案了。
2. 曲线
在标题文字上添加曲线来突出重要文案是 2021 Dribbble 最流行的趋势之一，第一个设计目的就是突显文字，其次就是想表现铅笔真实书写的感觉。之前很多带有签名的设计中，签字的文本都是手写体的感觉，手写体对比电脑的机械字体会带有一种人文气息，也会让两者之间产生一种对比、矛盾。
除了突显文本外，曲线还有视觉引导的作用。通过视觉引导让用户按照设计师编排的顺序进行浏览界面。当然还有比这更科学的工具就是眼动仪测试，通过真实用户眼睛浏览界面显示对应的热点图。
3. 多彩高斯渐变风
多彩高斯渐变风是从色彩的角度来传达和丰富画面的，多彩高斯渐变风其实是从制造矛盾到平衡矛盾的过程，多彩渐变多为冷暖对比来制造画面的冲突，需要控制冷暖画面的大小来实现平衡。主流的还是以暖色突显为主。多彩渐变主要起到活跃气氛、吸引目光、平衡画面的作用。
多彩高斯渐变还可以结合轻拟物、几何图形、三维等新的组合方式去创新，给用户呈现一种更加新颖的视觉表现形式。最后我们还是要回归到内容上，为了更好的传达信息需要去设计与内容相匹配的视觉风格。
1. 侧边栏 Sidebar
B 端设计的火爆带动了 B 端相关模块设计，更多的人也愿意尝试 B 端相关模块设计，侧边栏作为产品架构中重要的导航系统，好的侧边栏设计能为用户带来更好的效率。主流侧边栏都做了展开、收起、拖拽等交互效果，也是受限于 PC 屏幕为展示更多数据而腾空间。侧边栏主要承担的功能有导航、分类、自定义筛选、共享、新增等。Dribbble 的 B 端产品设计已经不再是假大空概念设计，而是一套实用美观可落地的设计。
2. 仪表盘设计
仪表盘设计是一个很好的隐喻，想象一下开摩托车或汽车主驾驶前面的屏幕，汽车仪表有燃油表、车速表、里程表、水温表、转速表、故障指示灯等。B 端类产品后台界面的仪表盘设计也需要展示一些重要的数据和各种状态，大体分为侧标栏、导航栏、待办任务、个人信息、报表数据、消息中心、快捷入口等。当然最重要的就是报表数据，团队收益、任务进度、转化比例、新增、存量、团队工作时长等都是老板或领导关心的内容。每个公司业务不同、每个人员权限不同，自定义的仪表盘也各有差异。重要的是突显数据和业务状态，需要分层级系统性去思考和设计。
3. 流程设计
复杂的事情简单化，简单的事情标准化，标准的事情流程化，流程的事情自动化。流程设计是每一个企业核心功能和业务，可自定义的管理流程系统搭建也是 B 端产品设计的难点，需要对业务高度抽象，让每一个业务人员可自定义的流程才是好的流程设计。
4. B 端 C 化
B 端 C 化是 B 端产品设计的视觉表现力慢慢往 C 端产品设计的视觉靠齐，国内 B 端产品界面设计视觉水平还有很大的提高空间。除了视觉上的提升外，由于业务的发展，B 端产品也开始移动化、智能化，国内主流还是通过小程序、H5 来现实 B 端产品 C 端化。
5. 轻代码化
轻代码化是一种低代码赋能无代码的方式，弥补无代码拓展性差、覆盖场景少的问题。在保有无代码灵活、易用、快捷的同时，又能覆盖低代码使用场景。简单理解就是无需代码开发即可如搭积木般快速、灵活地创造属于你的个性化管理系统，轻松实现多元业务场景的数字化管理。
轻代码化将功能进行打包，升级成全局可以用的配置，技术人员配置好后，业务人员在应用编辑时直接选择使用模版，绑定对应的变量即可使用。
1. 人文气息
为什么人加色块的组合方式能流行起来？还是 B 端行业流行带动的。B 端讲的更多的是企业对企业。企业对企业除了讲行业解决方案外，还需要传达公司的价值观、使命、愿景。人加色块的组合方式非常适合体现公司的企业文化。对于一家全球化的公司不同肤色的人物组合在一起，这种人文气息和价值观已经就不言而喻了。
当然企业也需要进行营销，抓人眼球。几千年来的遗传证明了，人的大脑对食物、性、动的东西、人脸和眼睛、危险的动物很敏感。人加色块的组合方式也具有抓人眼球营销的功能。真可谓一举两得。
这种风格更适合大公司，国内的一些手机厂商 OPPO、VIVO 等也会通过手机+背景+人物来体现科技与人文的结合，而对于中小型公司产品差异化和行业解决方案展现应该还是重中之重。
2. 毛玻璃效果
毛玻璃效果加大了模糊程度，透明效果更加扁平，很好的顺应当下 UI 扁平化的设计趋势。苹果 Mac OS Big Sur 系统的图标、界面中运用了大量毛玻璃和半透明元素，界面更扁平。至于 C4D 三维彩色玻璃的视频教程可以在 B 站搜索“透光艺术-C4D 创建彩色玻璃的 4 个技法”，完全能满足 UI 设计师。当然还有一个好消息就是 Mac 用户可以享有 OC 一年免费的使用权，具体安装购买方法上某宝就可以轻松搞定，真香。
3. 轻拟物
轻拟物这几年一直流行，在 UI 设计中趋于稳定的位置。从写实到扁平再到轻拟物，其实是设计师们一路不断探索的结果。本质就是光影对形体产生的视觉感受。在色彩中对高光、亮面、明暗交界线、暗面、反光（环境光）五个部分的处理。写实三维的图标等设计更适用于简洁的画面中，扁平等设计更适用于复杂一点的界面中，比如 B 端产品界面中的功能图标。轻拟物可使用的范围更广，效果更佳。Sketch、Figma 软件对于渐变、高光、投影、高斯模糊处理已经非常简单且出彩。
4. 简洁设计
简洁设计遵从了密斯·凡德罗的“少即是多”的设计原则，在 B 端产品界面中更加需要简洁设计，我们最熟悉的 Sketch 软件界面已经是相当的简洁了。回到现实当需求功能不断增加，产品界面的编排如何取舍，如何保证界面的简洁是设计师需要深度思考的问题？如何与上级沟通？该功能是否可做可不做？是否需要埋点用数据说话？如果只是一味竞品有我们就需要有，功能不断累加只会让界面越来越重。
5. 几何图形
几何图形和几何插画有异曲同工之妙，几何图形多为产品界面和宣传内容的抽象，产品界面的几何图形多为占位符形式，加上色彩和几何色块让其成为一个整体。B 端产品视觉设计 C 端化的进程中，几何图形、几何色彩不失为最好的突破口，相信今年Dribbble B 端产品的视觉设计一定会更上一个台阶。
几何图形另一个场景化的地方就是品牌，作为一名 UI 设计师一定会经历从图标到几何图形到品牌设计的过程，品牌设计的技巧基本还是以几何图形为主，至于品牌的内涵需要更深层次的解读。掌握主流品牌设计的技巧对产品定位、品牌宣传打下扎实的基础。
6. 暗黑设计
暗黑模式的设计是解决在微弱环境下内容也可以有更高的可读性。随着用户夜晚及深夜使用电子设备时长增大，如何在夜晚这个特定场景下使用更加舒适。合理使用暗黑模式可以减轻眼睛疲劳，提高在夜间使用的可读性。
在设计暗黑主题时，不能为了突显视觉上的逼格，而去使用高饱和度鲜艳的色彩来突显界面的品质感。而应该把舒适度、可读性作为设计的衡量指标。Material Design 给出了暗黑主题的设计准则，即正文和背景之间的对比度应至少为 15.8:1。按照此标准设计，可读性都还不错。这里介绍一个插件“Stark”（Figma、Sketch、XD、Chrome 插件）用来测试界面的对比度。
7. 模块化（组件化）
为什么叫模块化，而不叫组件化，组件化更多的利用原子系统从原子、分子、组织、模版、页面来快速的搭建界面，但在 B 端产品设计中基础组件和业务组件的搭建是以提高工作效率为前提，是否有从 0 到 1 搭建 B 端产品组件的经历是设计师一生中最宝贵的经验之一，它能提高设计师的系统化思维、逻辑思维和抽象思维能力。
产品模块化设计就是将产品分成几个部分，也就是几个模块，每一部分都是具有独立功能，具有一致的连接接口和一致的输入、输出接口的单元，相同种类的模块在产品族中可以重用和互换，相关模块的排列组合就可以形成最终的产品。通过模块的组合配置，就可以创建不同需求的产品，满足客户的定制需求 。
8. 插画
插画作为设计的一大品类，不同的插画师都有自己擅长的风格，本质是都有自己的个性，但是在产品设计中更多是需要共情、共性来讲故事，表达产品理念和价值观。这就需要插画师去尝试并探寻出适合互联网产品设计类的插画风格。设计的本质是旧元素的重新组合，插画不会过时，而是需要结合当下和产品找到最匹配的设计风格。
9. 几何插画
几何插画算是插画简化的一种表现形式，人和物的形态不再写实，而是抽象成几何图形拼凑的感觉，同时保留人物形态的神韵。加上几何色块与人物交互形态的表现，传达出简洁、科技的现代感。难点还是在人物形态的表现上，平时多练习练习速写还是很有必要的。
10. 线面插画
线面插画最近一两年非常流行，准确的说是非常适合。首先线面插画主要是由线条和块面组合而成，用块面表现人物形态时某些结构会表现不出来，这时候用线条简单勾勒后，结构就会清晰明了。其次当线面插画运用在界面上时，可以打破界面纯文字或组件化的机械和沉闷感。线面插画的风格提升画面热闹感的同时，还能保持界面的干净整洁。
1. 微交互
界面微交互动效会让用户的体验更加精致到位。想要打造优秀的产品设计，微交互和动效设计是绕不开的，UI 界面设计通过微交互反馈告知用户当前正在发生的事情，所处的状态。细微的动效更能调动用户情绪，取悦用户。C 端产品微交互和动效已经很成熟了，一部分功劳来自 iOS 系统原生自带的效果。B 端产品的微交互和动效更多还是在学习海外产品，还需要给前端工程师灌输微交互和动效的设计价值，共同打造产品体验细节。
2. Mg 动画
Mg 动画需要很好的节奏感、韵律，每一个场景动画都需要其中的元素进行连接变化，让转场动画更加自然，MG 人物动画通过点线面的动效变化让画面更加有趣、自然，通过粒子效果让特定场景无限循环会让人更加印象深刻。
1. 三维图标
MacOS Big Sur 系统图标的更新带动了三维图标的流行，三维图标的应该场景还是需要有较大留白空间的界面，因为三维图标太小后就看不到更多细节。三维图标感觉又回到了拟物化和扁平化哪个更好的问题上？设计师应该保持开放多元的视角。设计本身也在不断的演化融合，存在即合理。合适最重要，它们都会有适合自己的场景和设计价值。
2. 轻三维
为什么轻三维在界面设计中占有一席之位？一个是设计师不断追求差异化的产物。另一个是更好的表现内容，并与用户产生共鸣。轻三维的基础模型都是来自手机界面中的各种元素，比如组件、开关、按钮、占位符、图表、几何图形、图标、进度条等，这些都是用户日常使用系统软件常见的元素，通过简单的几何形体建模—打灯光—加材质—渲染—PS调色。难度系数不大但效果很出彩。第一个出彩点是模型带有厚度的倒角，结合灯光渲染的光泽是二维软件不能比拟的。第二个出彩点就是材质自由添加，特别是当下流行的毛玻璃效果，玻璃材质渲染效果更佳。第三个出彩点就是可以加局部灯光，局部的渐变色或环境光更加出彩。
3. P4D（PS+C4D）
P4D 是 PS 加 C4D 的设计表现技法，也是视觉设计的最后一个环节，通过 PS 对 C4D 的渲染图片进行调色，利用 PS 的调色技巧可以很好的解决 C4D 打灯光的瑕疵，还可以利用 PS 强大的合成功能，将渲染图片与图片素材进行合成，来表现画面的视觉度，当然三维软件比较难实现的水、粒子、烟花等效果，也可以通过 PS 的后期合成来实现，这也是 P4D 的强大之处。
4. 卡通 IP
卡通 IP 设计最近三四年技术的迭代已经慢慢的走上成熟，卡通 IP 也从传统的纯 PS 手绘技法，转到 C4D 建模—角色绑定—MD衣服制作—OC渲染—PS（静态）/AE（动态）调色。
卡通 IP 火的本质更适合做营销，相比于品牌或 Slogan，卡通 IP 具有亲和力和画面感。随着各种手办行业大热，受互联网大厂影响下，卡通 IP 已经是互联网 B 轮以上公司的标配了。如果团队中没有这样能力的人，也可以通过绘制好二维，一套三维可以选择外包完成。
对于 UI 设计师来说学习是有成本的，暂时并不是必备技能，如果喜欢完全可以学习，从设计差异化的角度来看三维视觉确实有一定的竞争力。
5. 三维动画
C4D 三维场景动画通过构建实物和场景模拟生活中的现实场景，会让用户体验真实感，三维软件制作动效的最大优势是通过动力学和表达式来模拟真实感，未来在 AR/VR 领域会有更好的发展。相对于界面动效学习成本难度也相对较大。在三维动画中 C4D 软件对于域、动力学还是有一定的优势。
上一次写 Dribbble 流行趋势还是两年前了，通过两年的沉淀对趋势流行有了更深的认知。十年的互联网行业风风火火，随着最近的互联网裁员潮大家也慢慢的进入到反思层，客观的看待和理解这个真实的世界，曾经的流行趋势也需要慢慢的沉淀下来。
存在即合理，趋势流行稍纵即逝，注定是不长久的，只有大浪淘沙历史遗留下来的风格才能更长久。但我们也不能不去关注，因为哪有什么所谓的创新，只不过是旧元素的重新组合，并符合当下这个时代人的审美需求。香奈儿的“时尚易逝，风格永存”大概就是这个意思吧。
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
客户与公司的商务售前进行沟通，客户的痛点和建议会传达给产品经理，产品需求明确后，做出原型图给到设计师。等设计师拿到需求的时候，基本已成定局，合不合理、如何优化的空间都会比较小了。造成这个现象的根本原因是设计师能看到的视角范围有限，B端业务场景本身比较专业，难以直接带入使用者的角色，就比较难取得大的突破了。
如何打破这一僵局呢？答案只有一个，那就是设计师要主动更前置的加入到产品方案设计中，深刻理解业务，为产品升级提供助力。这就涉及到用户研究了，本文将和大家分享用研的相关理论基础和方法。
双钻设计模型由英国设计协会提出，该设计模型的核心是：发现正确的问题和发现正确的解决方案。
双钻模型是一个结构化的设计方法，被很多设计师喜爱和使用。
探索/调研——透析问题（发散）
定义/合成——聚焦领域（集中）
发展/构思——潜在问题（发散）
传达/实现——实施方案（集中）
实际工作中用到双钻模型会有一些变体，举个例子：
下图是对阿里内部款移动运维产品的分析，分析其从0-1的方向探索和从1-1.5的发展历程：
下图是曾经在一个设计讲座中，滴滴CDX 一位设计师的分享，她把双钻模型利用到设计的研究和输出阶段，个人感觉此模型的使用场景也很贴切。
不仅仅是在完整的一个项目中，在单一的某个阶段双钻模型也是理念很好的承载容器。在每一个“确定”前后，都有用研的身影。
用研旨在通过实验和观察结合的研究方法来提高产品的可用性，指导产品的设计、开发和改进。重点是通过观察技术、任务分析和其他反馈方法来了解用户的行为、需求和动机。
在获取后台数据之后，我们会分析为什么留存、为什么流失、为什么买这个不买那个，
设计师认为很棒的新功能，真的是用户想要的吗？用户真的会用吗？
观察数据只是一种手段，而非结果。当一个页面中出现值很低的功能时，我们不能直接判断他就是不重要的，也可能是因为视觉上太弱或者交互操作不方便引起的。只有做用户研究才可以真正了解用户的行为背后的原因，真正的动机。
如上图，是一个红包发放页面的设计前后对比，从数据中了解到使用优惠券的用户不到30%，埋点发现大多都点击了返回，用户没有按照期望的路径走，调研发现操作路径不清晰，没有形成闭环。由此可见，发现问题时，先埋点细化问题——再分析问题——结合用户研究，提出优化方案，才能真正发现问题解决问题。
产品的发展周期分为产品概念期、设计开发期、宣传推广期、平稳发展期和产品衰退期五个阶段，在每个阶段都有相对应的用户研究测试可以做。
对应上文的产品发展周期可以做的用户测试，我们要找到相对应的人群：
最后就是将用户研究进行落地了，如何让用户研究达到预期的目的和效果呢？可以在开始前的准备阶段问问自己如下的问题：
接下来我们看看到实际落地环节，有哪些用户研究的类型可以做以及怎么去做。
桌面研究又叫“文案研究”，指不进行一手资料的实地研究和收集，而是通过电脑，杂志，书籍，文档，互联网搜索等现有二手资料进行分析和研究的方法。
完整的桌面研究分为以下五个步骤：
在需求细分阶段，可以用到SWOT 分析、波特五力模型、PEST分析、波士顿矩阵等模型
收集数据通常可以从内部数据和外部数据来源广泛获取然后结合分析。
内部数据来源：市场营销数据、产品后台数据、其他相关报告等。
外部数据来源：政府部门、国际组织、行业协会、专门调研机构、联合服务公司、其他大众传播媒介、商会、银行等金融机构、官方和民间信息机构等。
定性研究是指通过收集、分析和解释那些不能被数量化的信息，来挖掘问题、理解事件现象、分析人类行为与观点的方法，主要作用是探索“可能性”。
定性研究专注于更小但更集中的样本，通过非结构询问和观察来获得不能量化的信息。
流程如下：
常用的定性研究方法：
我们需要明白访谈适合哪一种项目研究，比如要针对新功能进行一次面访。
接下来我们需要进行用户的招募，因为面访比较耗费时间和精力，所以最好准备一些礼品，否则很难招募到用户。招募用户的渠道可以是产品中投放问卷、社群招募等方式来邀约难度用户。
用户访谈环境，准备一个安静的房间，准备好水、纸、笔、录像、录音笔等工具。
整理访谈内容，每访谈完一位用户进行一次小结。
接下来模拟一次用户访谈的整个流程：
开场：首先介绍一下自己的情况，并且让用户了解这次访谈的目的，建立一个轻松的谈话氛围。
探索：针对研究目的进行探索，比如目的是做用户体验地图，了解用户在使用过程中遇到的问题。
注意：如果直接问平时怎么使用我们的产品，用户会比较懵。这个时候最好给他一个确定的环境，比如你能不能演示一下你平时是怎么管理货源的，这个时候他就明白原来需要我进行这样一个任务。
观察：在用户回答提问和操作演示中，查看用户碰到了什么难题。比如有超过一半的用户多次点击一个按钮，说明这个按钮设计的大小不太合理。
思考：深层次挖掘。比如用户反馈字太小，但实际操作中并没有眯着眼或更靠近屏幕，可能原因一是他们本身就把手机屏幕文字调为最大，二是信息排布过于密集，效率低，并非因为字小。
定量研究是指确定事物某方面量的科学研究，将问题与现象用数量来表示，进而分析和解释，从而获得意义的研究方法。定量研究的数据分析，主要作用是回答“多少”的问题。
定量研究的意义：
用一个数值来表示你产品的可用性。数值有时比质量检测的结果和视频更有说服力（特别是当你试图说服像高管或客户这样的人）时。
比较不同的设计（比如，你的产品的新旧版本，或者是你的产品与竞争对手的产品相比），并且确定你观察到的差异是否具有统计学意义，而不是随机的。
改进用户体验权衡决策。比如，如果预期的设计改进成本很高，那么它值得做吗？定量研究方法可以帮助你验证重新设计是否值得。
常用的定量研究方法包括：可用性研究、A/B Test、问卷调查和满意度调查。
测试的重点是收集数据指标，比如任务时间或者成功率，一旦你收集了相对较大的样本量（大约35个或者更多），你就可以使用它们来跟踪产品的可用性，或者将其与竞争对手产品的可用性进行比较。
在A/B测试中，团队需要创建同一界面的两个不同的最新版本，然后将每个版本展示给不同的用户，用来确定哪个版本的性能更好。基于分析的实验，对于决定同一个设计的不同变体非常有用，并且可以结束团队关于哪个版本最好的争论。
问卷调查是一种灵活的用户研究工具，调研时可以同时获得定量和定性的数据，比如评分、多项选择题中的答案的比例，再加上开放式问题的答案。你甚至可以把对调查的定性回答转化为数字数据。
问卷的一个优点是：可以经常将你的调研结果与行业或竞争者的分数进行比较，看看你做得怎么样。即使你创建了自己的自定义问卷，也可以随时间的推移对自己产品平均分数进行追踪，来监控产品的改进情况。
可以根据你的研究问题进行定制，这些方法通常会首先让参与者接触到产品（通过向他们展示静态图片或者要求他们使用现场产品或原型）。然后，要求用户通过从描述性的词语列表中选择一个来描述当前设计。
如果你获取自身目标用户的样本量足够大，那么整体趋势就会显示出来。例如，你可能会有84%的受访者将此设计描述为"最新"。
比如这次改版用户对新版本的满意度怎么样。只有确定了目标，你的问卷才是有价值的。
因子分析法要求调查数量是调查问卷问题数量的5-10倍，因此，如果调查问卷中共有20个问题，那么调查样本数量可以大概确定为100～200个，有效回收样本30份即可。
问题顺序的基本原则
往前放：
熟悉的问题
简单的问题
引起兴趣的问题
往后放：
开放式的问题
个人背景资料
简洁明确：
•你用了多久的Google map？（❌）
•你第一次使用Google map是什么时候？（✅）
这两个问题看似类似，但是当用户在思考的时候，第一个问题显然会思考更多的时间，用户很可能在想，是想知道我第一次用的时间，还是我用了多久的时间。
中立、无诱导性：
•你喜欢这个功能的设计吗？（❌）
•请您对这个功能的满意程度进行一个打分，最低1分最高5分？（✅）
避免使用带有引导性的问题，问用户是否喜欢、是否满意，这样通常用户都会偏向于回答喜欢。
设置选项时，要做到：
定量分析的结果多以数据、模式、图形等来表达。
•眼动追踪，英文Eye Tracking，是指通过测量眼睛的注视点的位置或者眼球相对头部的运动而实现对眼球运动的追踪。
眼动仪是一种能够跟踪测量眼球位置及眼球运动信息的一种设备，在视觉系统、心理学、认知语言学的研究中有广泛的应用。
注视分析——分析注视轨迹、先后顺序与流畅度
注视热点图——分析最关注区域和忽视区域
兴趣区分析——分析平均注视时间与各兴趣区注视顺序
通常需要辅助测试（如定性访谈）来收集更多实验数据
•脑电研究，大脑活动时，脑内亿万神经元活动引起头皮表面的电位变化，含有大量心里信息，测量脑电信号可绘制脑电图，以不同波形反映出来。
利用生理探测技术，研究用户对产品的情绪反应
相比传统调研，更加能够排除从众行为、事后回忆偏差、社会赞许效应等的干扰
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
很多网站在短时间内就取得了巨大的进步 —— 那些过去十年里最知名的品牌网站，与第一次迭代相比发生了很大的变化，这令人感到无比惊讶。
网站最初用于商业目的时，人们并没有过多地关注用户体验。过去的目的是将尽可能多的内容塞进一页里。现在，设计师们通过大量研究、数据挖掘和优化等方式来吸引用户的注意力，同时在正确的时间提供合适的内容、功能和选项。
越来越多的公司正在采用先进的心理学研究，以推动用户参与更多的互动和付费项目，这一现象使得曾经被认为是一门艺术的东西转变成了一门科学。
1997 年的 Apple 网站
除了许多必要的元素之外，好的设计总是会考虑到用户的情感和心理需求。让我们来看看什么是「说服式设计」，并探索如何将影响人类行为的心理过程应用到设计中。
“说服” 这个词往往与操纵、欺骗相关联，尤其是对一个善于使用「互联网陷阱」的设计师来说。但是，我们要明确一点，说服式设计中的 “说服” 并不是这个意思。说服式设计可以使网站易于使用，从而改善用户体验。因为，说服式设计是源于对心理诱因、用户行为的理解和运用。
（互联网陷阱：兴于 2010 年，由当时英国用户体验咨询师 Harry·Brignull 首次提出，指的是网站或应用程序采用诱导性或胁迫性设计，迫使用户采取或不采取某种行动）
例如，亚马逊就很好的运用了说服式设计，它通过推荐其他产品和配件，以及展示 “查看过此商品的顾客也购买了某物品” 的选项，引导用户继续购买更多商品。为了快速完成销售，他们还为购物者提供了一键购买商品的功能。
亚马逊运用说服式设计的案例
我们都一直在花费大量时间上网，设计师可以利用从线下行为中学到的知识来创造更好的用户体验。无论你是想优化现有网站还是构建应用程序，说服式设计都将引导和支持用户的在线体验。
设计师要如何利用心理学的研究成果来增强其设计的影响力呢？
理解心理学原理可以让你对工作的基本原理有更透彻的理解。它可以：
让我们来讨论一些心理学理论。
作为人类，我们天生就需要控制。这可以追溯到我们最本源的需求。在划分需求层次时，心理学家亚伯拉罕·马斯洛（Abraham Maslow）在提出需求层次时，将我们最基本的需求命名为：健康、食物和睡眠。所有这些都需要我们对环境进行一定程度的控制。
马斯洛需求层次
作为 UI 设计师，我们需要确保用户在我们为他们创建的环境中拥有积极的体验。这就意味着需要通过提供合适的工具来增强用户的能力，以帮助用户在产品的使用过程中获得控制感。
“今天，你可以调整屏幕的亮度，禁用通知，并可以决定手机是否应该同时连接蜂窝数据和 Wi-Fi …… 即使这些调整只会将手机的电池寿命延长几分钟，但这种可以掌控一切的成就感也会使用户感到温暖。” -- 用户体验顾问 Nadine Kintscher
我们需要创建能够平衡功能和视觉吸引力的界面，并将掌控权提交给用户，以便他们有更满意的体验。
澳大利亚房地产搜索网站 Realestate 成功的做到了这一点，它让用户能够根据自己的偏好筛选所有房产，并让他们可以选择按不同的标准进行排序。
澳大利亚房地产搜索网站 https://www.realestate.com.au
我们该如何设计一种数字体验，才能使用户在适当的时候进行所需的行为？这需要了解一个简理论 -- 「福格行为模型」：一个人行为（Behavior）的发生需要满足至少三个条件，动机（Motivation）,能力（ability）和诱因（trigger），用公式表示即 B = MAT，这三者必须同时具备，缺少任一条件都不会导致行为的发生。对于任何试图实践劝导心理学的人来说都是理想的选择。理论表明，一个行为得以发生，行为者首先需要有进行此行为的动机和操作此行为的能力，接着，如果他们有充足的动机和能力来实施既定行为，他们就会在被诱导时进行此行为，预期的行为就会发生。
（福格行为模型：由斯坦福大学「说服技术研究实验室」Persuasive Technology Lab 创始人 BJ Fogg 研究而来）
动机 -- 人们做出这一行为的原因是什么，做出这一行为的原始动因是什么；
能力 -- 人们做出此行为需要满足什么能力，人们是否有条件来完成这个行动或者做这件事；
触发 -- 是什么诱发用户会做出这个行为，什么因素会导致用户会完成这个。
福格行为模型（https://behaviormodel.org/）
尼尔·埃亚尔（Nir Eyal）和瑞安·胡佛（Ryan Hoover）合著的书籍《上瘾》中曾提到过 福格行为模型，揭示了很多让用户形成习惯，甚至“上瘾”的互联网产品服务背后的基本设计原理，告诉你怎样打造一款让用户欲罢不能的产品。作者根据自己多年的研究、咨询及实际经验，提出了新颖而实用的 「上瘾模型」（Hook Model），即通过四个方面来养成用户的使用习惯。通过连续的“上瘾循环”，让用户成为“回头客”，进而实现循环消费的终极目标，而不是依赖高昂的广告投入或泛滥粗暴的信息传播。
上瘾模型
一个很好的例子是 TurboTax，在《为心灵设计：劝导式设计的七个心理学原则》一书中讨论过。
即使交税不会使我们感到开心，我们仍有很强的动力来报税。然而，与其他所有国家一样，美国的税收制度过于复杂，难以理解。TurboTax 在书中提到，使用户能够通过询问基本问题更轻松地完成纳税，可以有效的提高用户的纳税能力。在 TurboTax 的设计中，他舍弃了冗长的文档，相反，创建了一个工作流，使用户可以进行简单的逐步操作。最终便捷的操作方式会成为诱因，使用户愿意尝试在线提交税款。
TurboTax 设计的报税系统
用户有充足的动机和能力，同时又具备诱因，三个要素完美结合的情况可能会让人感到过于理想或不自然。事实上，其中某一因素占比多也没关系。发微博就是一个很好的例子，没有什么重要事情的话，发微博的动机可能很低，大多都是浏览；但触发因素随时都可能出现，提醒你可以开始行动了，可能是一个转发抽奖的活动、可能是朋友正好生日；同时，发微博的操作非常便捷，用户具备能力随时都可以发布。
作为设计师，我们可以使用该理论来检查是否为用户建立了足够的动机和能力，并提供诱因来引发他们的行为。
以上两种理论（控制感，以及 动机、能力和诱因）都需要进一步的研究，它们在设计界面时非常有用。
或者，有一些更简单的心理学理论，不需要较复杂的研究，即可用到你的设计中，比如 稀缺 和 害怕错过（FOMO -- Fear of Missing Out）的概念。
亚马逊在商品上增加 “只剩下 1 件存货” 强调库存不足，使用 FOMO 加强紧迫感
几十年来，心理学家一直对人们保持注意力的能力不断下降而感到困扰。
眼动追踪已经存在一段时间了，它主要用于测量用户注视某一点的位置和持续时间。研究表明，互联网的平均注意力持续时间不到几秒钟，用户会立即做出有关网站的决定，如果不适合，就会离开。
数据驱动的设计（https://www.eyequant.com）
EyeQuant 将这一想法向前推进了一步，利用眼球追踪数据构建了一种预测算法。你无需自己进行眼动测试，而是将设计上传到他们的网站，他们会告诉你用户在使用你的网站时关注点在哪些地方。
他们找了德国的参与者，并利用这些参与者建立了一个庞大的数据库，该数据库包含了大量吸引用户注意力的内容和不吸引用户注意的内容。研究发现，高对比度色彩比较容易吸引用户，表情和粗体的文字也是如此。
眼动追踪软件可能很昂贵。取而代之的是，诸如 Sumo Heat Maps 的在线分析软件，可用于显示访问者单击的内容和位置，以及吸引最多注意力的内容。然而，请记住，虽然我们可能会抓住大脑的注意力，但我们也有可能会把用户从更重要的事情上拉走。
使用眼动追踪或热力图可以使设计人员立即获得有关其设计的客观反馈。作为设计师，它可以用作用户体验想法的验证，并为你的设计决策提供数据，允许你通过 A / B 测试来优化设计。
眼动追踪可获得用户行为的客观反馈
你是否曾经注意到人类天生会有模仿他人的欲望？一个人的欲望也会促成他人的欲望。这种理论是由勒内·吉拉德（Rene Girard）提出的，理论认为，如果某人表现出对某件物品的渴望，你也会渴望得到这件物品。广告商就是利用这一方式促成人们对某物的渴望，显然，广告成功的激发了人们更多的欲望。
你我都是模仿生物。Darren Bridger 的《神经设计》一书就探索了这一理论，研究发现我们有一个镜像神经元系统。换句话说，仅看到某人执行某项操作（例如捡起一件物品）就会使你的大脑反映出该活动。
模仿一词的英文解释
模仿欲理论意味着如果我们看到别人拥有某样东西，我们便也想拥有 —— 这一点可以用 「社会认同」（或从众心理）来解释。
一种社会认同是来自 “用户的认同”，就像是推荐。推荐之所以有效，是因为它们来自拥有共同愿望和价值观的人。例如，专门为企业家服务的媒体 Foundr 不仅使用用户的声音，而且还显示人脸，从而触发了镜像神经元系统。
Foundr 专门为企业家提供媒体服务
另一种社会认同是来自 “专家的认同”，即你的产品获得了专家的认可，例如你的产品被 Twitter 提及、新闻引用、甚至有大 V 专门为你的产品撰文。Google 在其最新的 Pixel 手机广告系列中使用了这种技巧，用 Google 自身的品牌影响力作为最强力的背书推荐这款手机。
仅仅强调这款手机是 Google 出品，无须多言
对于设计师来说，现在是一个令人激动的好时代 -- 有丰富的资源和研究可以支撑我们的工作。
设计趋势正在向体感，语音、虚拟现实（VR）、增强现实（AR）、混合现实（MR）和物联网（IoT）转变；随着这些交互技术的不断发展，人们需要以更直观的方式来使用界面。
我们将迎来许多新的设计机会，而心理学将在其中发挥着重要的作用。
下一个我们日常生活中与设备交互方式的重大转变，将从触屏变为使用脑电波交互。该技术已经可用，使人们能够通过思想直接控制其设备。
随着我们逐渐接近人们的真实想法，心理学在设计中的应用以及设计师的道德责任将发挥越来越重要的作用。
除了使用分析法、用户研究、用户体验地图和其他方法来帮助做出设计决策并迭代产品外，设计师还应考虑使用上述四种有说服力的设计方法来完善其 “技巧工具包”。
有说服力的设计并不邪恶。它是一种工具，并且像任何工具一样，它可能被滥用。然而，通过正确的研究和深思熟虑的应用，它可以成为任何设计师工具箱中的宝贵补充。
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
前两篇，探讨了个人对交互设计价值观的理解，以及其对从业者和用户的价值。
这一篇，我们就来探讨一下，如何做到之前提到的 4 点价值观。
先从“周到“开始。
仅为一家之言。欢迎留言交流，说出你的看法。
本着严谨的态度，先捋一捋概念。
常言道，金杯银杯，不如百姓口碑。
同理，周不周到，最终还是用户说了算。那用户是怎么评判的呢？通常是凭主观感受。
拿上篇文章中网易号文章编辑页面的例子来说，因为“保存”和“存草稿”功能做的不够好，所以给笔者留下了不够周到的印象。
翻译过来，就是，一些体验细节，影响了用户的印象。
《设计师要懂心理学》这本书中有条原则，叫“整体认知主要依靠周边视觉而非中央视觉”。
讲的是视觉和 UI 层面的用户认知。就是说，用户会关注并不显眼的边边角角的设计，而且这些边边角角的设计会影响用户对整体设计的认知和印象。
举个例子。假如说，微博信息流页面的扫一扫图标，在风格、大小等方面和其它图标不统一，就会给用户留下比较糟糕的印象，用户很可能会觉得微博的设计不够专业。
这些是 UI 设计层面的。在交互设计层面，也是类似的道理：体验细节会影响用户的认知。
总的来说，至少在常用的交互细节上，不要给用户留下负面印象，也不要让用户产生负面情绪，避免所有的不周到，才算是周到。
个人觉得，最关键的地方，是满足好小需求。
啥是小需求？
个人观点，笼统的讲， 小需求是一种共性需求， 主要是一些体验细节。比如信息的分类与展示、衔接不同页面的各种弹窗与提示、对各种状态的提示、对各种情况的到位解释，等等。
有小需求，就有大需求。
所谓大需求，更多是一种个性需求， 不同的产品，会有不同的大需求。比如短视频产品，它的大需求会包含视频的拍摄、上传、播放等；资讯类产品，它的大需求则包含文章的撰写、编辑、发布、查看等。
工作经历，笔者见过一些交互设计不够周到的产品。它们的共同特点就是： 大需求基本上得到了很好的满足，小需求没有得到很好的满足。
这一大段，就围绕如何更好的满足小需求来展开。主要建议如下。
笔者有个客户，是从事教育行业的，之前并没有接触过互联网行业的产品与设计工作。
这位客户找到笔者的时候，是想要设计一款小程序的界面。当时客户非常自豪的对笔者说，这个（原型）是我用墨刀画的，现学现做。
说起墨刀，本人也用过。和 Axure 相比，确实好用太多，在简洁性和智能性方面，感觉和 Sketch 有异曲同工之处。
关于墨刀如何好用，网上已经有太多溢美之词。笔者就结合自己的使用经历，简单总结一下：
1 好用，上手快。零基础，只要会操作常用办公软件，简单学一下就能上手
4 能查看页面之间的跳转逻辑。借助工作流功能，可实现这一点
以上主要是墨刀自身的优点。结合本段主题，我们再探讨一下，对于日常工作，墨刀这把利器有哪些优势。
1.1 可以把更多精力花在创作上
当我们不会用一款工具时，通常会有一些挫败感。如果必须要用，接着很可能就会有一点焦灼了。
而墨刀，基本上不会让我们体会到这些感觉。
我们也不用花无谓的时间去学习一些艰难的高深的技法，而是可以把更多的时间花在“创作”这件事上。
1.2 可以更好的去满足小需求
部分公司，可能面临如下情况。
公司没有专门的交互设计师，产品的原型由产品经理来画。产品经理本身还兼任项目经理。
如果项目又特别赶，客观上，产品经理确实没有太多时间去关注交互的体验细节。
主观上，如果产品经理对这些交互细节的兴趣或重视程度不足、同时产品经理上面的决策层也不去抓这些体验细节，最终的结果，就是产品的原型上可能会丢失很多体验细节。
笔者就有类似的经历。
一款 App，产品经理用 Axure 画的原型。评审或宣讲需求的时候，大家都是在电脑或会议室大屏幕上来看这个原型，同时所有人最先关注的是大需求。
理解完大需求，会有部分同学就大需求提出自己的看法或建议。最后，才会有部分同学就小需求指出不足并提出建议。
受限于职责、时间等各种因素，大家也不可能针对小需求提出太多建议。结果就是，仍然会有相当数量的小需求被遗漏，或者没有被很好的满足。
墨刀有两个功能，可以较好的规避这些问题。一个是工作流功能，一个是手机端预览功能。
工作流功能，类似流程图，即把所有页面以合乎逻辑的方式链接起来。客观上，会促使我们画出所有包含小需求的页面，包括弹窗、状态提示等。
支持多人的手机端预览功能，使得我们在手机上，可以通过点击等方式来模拟体验这款 App。这样的环境下，我们会更容易理解大需求，也更容易发现小需求存在的问题。
所以，个人的建议，就是用墨刀来画原型，同时把工作流和多人手机端预览（针对 App、小程序）这两项，作为硬性标准。
一款产品，在体验或使用时，非常容易发现问题。
因为这时候，我们可以松弛下来，把自己切换成普通用户。忘掉所有费脑子的需求和设计原理，只依赖经验和直觉来用这款产品。我们的主观感受，会告诉我们，这款产品的交互，到底周不周到。
据陆树燊的《微信团队的实验室文化》一文显示，张小龙评审微信的功能，不看原型图，不看设计稿，也不看 Demo，而是体验前后台代码开发好后的产品。这就意味着，如果一个功能在给到用户前有 N 个方案，就会有 N 个方案对应的前后台代码。
一定程度上，微信团队就是通过这种在正式发布前反复试错、不断打磨的方式，最终给用户提供了优秀的交互体验。
估计，绝大部分团队和公司，都做不到微信这样，开发 N 个版本，并去一一体验和比较这 N 个版本。
无法体验已经开发好的 N 个版本。但是，在真实的设备上体验 N 个原型，我们还是可以做到的。
原型虽然没有开发好的产品那么顺畅和流畅，但是，如果用墨刀在手机端体验一款加了链接和动效的 App 原型，一样可以发现很多问题。
不过，根据经历和观察，笔者发现，我们人类，是不喜欢体验原型的。
想一想，平常工作中，我们可能会乐此不疲的去体验开发好的测试版产品。但对于原型，大部分时候，都是匆匆忙忙就过掉了。
个人有个猜测，就好像人类喜欢逗猫遛狗、却不太喜欢逗桌子上的模型猫和模型狗一样，我们人类是不太愿意花费太多时间和精力去和原型这种“假产品”互动的。
所以，某种程度上，体验原型，是一种反人性的行为。
但却是一种非常经济和高效的方法。
因为首先，大部分时候，我们都是先选中一个原型方案，然后去设计、去开发；其次，等到开发好进入测试环节，这时候，原型往往就成了测试的标准，依靠测试来优化原型是不现实的。
所以，结合现状，综合来看，小需求能不能得到很好的满足，很大程度上还是要依靠原型。
也就是说，很有必要对原型进行优化。具体方法，就是在真实的设备上体验原型、反复体验、多人体验，并进行相应优化。
如前所述，用利器来创作原型，反复在原型里体验产品，这些强调的是内部力量，即自身的努力。
下面，再谈一谈外部力量，即外界海量的知识与经验。
说起外界知识，除了直接参考其他产品的设计以外，大家参考最多的，可能就是《iOS Human Interface Guidelines》和《Material Design》这些设计规范了。
根据笔者的实际经验，这两个来自苹果和谷歌的设计规范，很多时候，我们都是拿它们当字典用。即哪一点不会或不太确定的时候，去翻一翻查一查。
虽然这俩规范很优秀，但是却很难被我们“物尽其用”，因为它们的知识体系过于庞大，有点像一本字典。拿着“字典”里的每一条原则去检验我们的交互设计，这是很难做到的。
但是有一个设计规范，去非常适合拿来检验我们的交互设计，那就是尼尔森十大可用性原则。
太详细的就不赘述了，这里我们再简单回顾下这十条原则。
1) 状态可见
用户时刻清楚，正在发生什么
2) 环境贴切
营造一个用户熟悉的环境，比如语言、词语、图标等
3) 用户可控
控制权交给用户，并且多数时候，考虑支持撤销重做
4) 一致性
方方面面的统一，比如文案、视觉、操作等
5) 防错
尽最大可能，帮助用户，避免用户犯错
6) 易取：识别比记忆好
通过把组件、按钮等元素可见化，降低用户记忆负担
7) 灵活高效
优先考虑人数最多的中级用户，同时兼顾高级和初级用户
8) 易扫：优美且简约
阅读体验要好，扫视体验也要好；保持简约和美观
9) 容错
帮助用户识别、诊断，并从错误中恢复
10) 人性化帮助
日常的使用最好脱离帮助文档，但有必要提供帮助文档
个人非常建议，在日常工作中，把尼尔森十大可用性原则作为一把标尺，来时时刻刻检验我们的交互设计。
交互设计，在涉及体验细节的小需求上，避免所有的不周到，方才是周到。
用利器创作原型，要包含流程图；多体验原型或产品，以体验结果为准、而非讨论结果为准；参考优秀的设计规范，用尼尔森十大可用性原则来检验原型。
以上三点，可以帮助我们做到交互设计的周到。
其中，个人认为，最为核心的是第二点：多体验原型或产品，直到自己觉得周到为止。
因为，正如电影《霸王别姬》的一句台词所说：人，得自个儿成全自个儿。
最近有同学问老王，UI设计师是不是需要交互设计能力？
当然需要，不懂交互的UI不是好UI~
首先UI设计不仅仅需要把功能需求可视化，还需要注重用户体验。所谓用户体验，其实就是用户与页面的交互。而在交互设计中有很多的方法和理论，如格式塔心理学、尼尔森可用性原则、7+2法制、3次点击法制、功能可见性原则、菲茨定律等。他们大多的方法也是共同的。
所以呢，今天老王来说说交互设计用的最多的原则——尼尔森十大可用性原则。
很多情况用户是不知道当前状态的，所以在适当的时间内做出反馈很重要。不仅能让用户知道情况，还能防止用户发生错误操作。常见反馈有刷新提示、新页面加载提示、支付提示、下载提示。除了结果反馈提示外，对于进程中的页面会用进度条进行表现。
今日头条APP首页中，看过的文章标题变为了灰色、而没读过的文章标题依旧保留了黑色字体。
简单来说就是让软件看起来跟符合真实世界，还原现实认知。通过直观的视觉快速传达给用户。
音乐软件通过模拟现实唱片并结合旋转的播放动画，从而降低了学习成本，更轻松的理解界面。
说白了就是给用户发后悔药，当用户误操作时要给用户提供提供撤销、取消、重做等相关功能。买错商品可以无条件包邮退回。
拼多多凸显了“退货免运费”“7无理由退回”服务，解决了用户买到不满意产品的售后担心。减少了承担运费的成本，从而促使了用户快速下单。
一个好的产品从视觉上首先是统一的，色彩、字体、元素保持统一，能加强用户的记忆力。在交互中同样如此，页面结构、操作反馈都需要保持一致性。
QQ首页列表中不管你点击那一条目，下一级界面都是由右往左滑出。点击左上角返回按钮，会从左往右滑回，体验完全一致；几乎所有产品进入下一层级页面的交互方式都是如此。
为了减少用户错误的可行性，进阶是给出错误反馈是不够的，用心一点的设计师其实会发现很多的产品是这样做的。为了防止错误的发生，会进行防错设计。
比如在发朋圈时，点击返回按钮出现的提示弹窗。弹出框方式会增加不可逆操作的难度，减少操作删除带来的顺势。更人性化的是，提示给出了保留和不保留按钮选择，选择保留退出还可以再次编辑。
通过把组件、按钮及选项可见化，减少用户的记忆负荷，让使用更轻松。在使用过程中不需要记住上一页面的信息就能完成当前页的操作。
通常更新完APP之后，会出现新功能引导。引导提示能告诉用户新功能所在的位置和作用。这也是协助记忆原则的体现。
好的产品不仅仅需要满足新用户，还需要满足深度用户。保证第一次使用者，能清晰明白功能。对于老用户需要提供更高效使用方式。
对用户重复使用的功能，提供便捷按钮。比如叮咚买菜的再次购买。
适当的留白能让页面功能突出，也能让视觉更加舒服。精致的图形元素能给用户留下好的印象。
很多K12的产品会运用IP形象进行延展，不仅强化了品牌记忆力，更增强了互动感。
好了，以上就老王对尼尔森十大原则的解析。其实原理很简单，甚至很多都是很直观的废话，但如果不把它们一条条列出来，还是有很多人连这些废话都做不到。
关注细节，才能成就大事！
一、什么是交互设计？
先来看一下百度百科的定义
交互设计（英文Interaction Design, 缩写IXD)，是定义、设计人造系统的行为的设计领域，它定义了两个或多个互动的个体之间交流的内容和结构，使之互相配合，共同达成某种目的。交互设计努力去创造和建立的是人与产品及服务之间有意义的关系，以“在充满社会复杂性的物质世界中嵌入信息技术”为中心。交互系统设计的目标可以从“可用性”和”用户体验“两个层面上进行分析，关注以人为本的用户需求。简而言之，交互设计是解决特定场景下的人群如何高效使用机器或软件的目标行为。
为什么要做交互设计
在使用网站，软件，消费产品或各种服务的时候（实际上是在同它们交互），使用过程中的感觉就是一种交互体验。随着网络和新技术的发展，各种新产品和交互方式越来越多，人们也越来越重视对交互的体验。当大型计算机刚刚研制出来的时候，可能为当初的使用者本身就是该行业的专家，没有人去关注使用者的感觉；相反，一切都围绕机器的需要来组织，程序员通过打孔卡片来输入机器语言，输出结果也是机器语言，那个时候同计算机交互的重心是机器本身。当计算机系统的用户越来越由普通大众组成的时候，对交互体验的关注也越来越迫切了。因此交互设计作为一门关注交互体验的新学科在二十世纪八十年代产生了。
从用户角度来说，交互设计是一种如何让产品易用，有效而让人愉悦的技术，它致力于了解目标用户和他们的期望，了解用户在同产品交互时彼此的行为，了解“人”本身的心理和行为特点，同时，还包括了解各种有效的交互方式，并对它们进行增强和扩充。
通过对产品的界面和行为进行交互设计，让产品和它的使用者之间建立一种有机关系，从而可以有效达到使用者的目标，这就是交互设计的目的。
二、交互设计常用原则和定律有哪些？
尼尔森十大可用性原则
1、状态可见原则
系统应该让用户时刻清楚当前发生了什么事情，也就是快速的让用户了解自己处于何种状态、对过去发生、当前目标、以及对未来去向有所了解，一般的方法是在合适的时间给用户适当的反馈，防止用户使用出现错误。
即在用户操作界面功能时给予实时反馈，例如：页面加载状态提示、按钮点击后的状态变化、进度条提示等。
2、环境贴切原则
设计的一切表现和表述，尽可能贴近用户所在的环境，将现实环境的操作功能巧妙的转化为线上功能，使其贴近用户。使用用户能听懂的专业术语，涉及到专业化语言时要转化成用户熟悉的语言。
即模拟真实的事物，使用户更容易理解。例如：天气应用中的天气插图、音乐播放器的胶片都是生活中熟悉的场景和物品，降低理解成本。
3、操作可控原则
对于用户的误操作，提供二次确认或者撤销的功能，这样可提高用户的操作可控性。
例如：删除联系人二次确认提示、消息可撤回操作。
4、一致性原则
遵循统一的产品设计规范／逻辑。这里的一致性包含产品和跨平台产品之间的一致性。
一致性包含视觉交互、文案描述、组建样式等，例如：微信小程序设计规范。
5、防错原则
设置防错的机制，减少用户犯错。在用户选择动作发生之前，就要防止用户容易混淆或者错误的选择。
例如：用户名称校验提示、手机号码位数限制等。
6、易取原则
减少用户记忆负荷，在适合的时机给用户需要获取的信息。
例如：验证码读取、找人转账提示等。
7、灵活高效原则
提供灵活的操作和高效的获取信息能力。
例如：手机号码一键登录、消息关键字识别等。
8、优美简约原则
保留产品最主要的信息，如果不是优先级最高，要尽一切可能避免去影响产品的简洁和美观。
9、容错原则
用户在使用产品过程中出现了问题，及时准确的告知用户出现问题的原因。
例如：信息输入提示、搜索无结果等。
10、提供人性化帮助
在用户需要的时候提供必要的帮助说明。
例如：新功能引导、解释说明文案等。
七个交互设计定律
1、菲兹定律
点击一个目标的时间同以下两个因素有关：
（1）设备当前位置和目标位置的距离（D）。距离越长，所用时间越长；
（2）目标的大小（S）。目标越大，所用时间越短。
该定律经常运用于鼠标从点A到点B的运动。
例如常用按钮的尺寸设计等。
2、希克定律
一个人面临的选择（n）越多，所需要作出决定的时间（T）就越长。
交互设计中要合理设置选项，以免用户使用中决策时间过长，降低使用效率。
3、米勒7±2定律
乔治米勒对短时记忆能力进行了定量研究，他发现人类头脑最好的状态能记忆含有7（±2）项信息块，在记忆了 5-9 项信息后人类的头脑就开始出错。
例如：手机号码的分位显示、应用中标签栏数量等
4、邻近性法则
人们通常将距离近的事物划分为一组。
界面设计中可以用对象间的相对距离来区分信息层级。
5、复杂性守恒定律
每个应用程序都具有其内在的、无法简化的复杂度。无论在产品开发环节还是在用户与产品的交互环节，这一固有的复杂度都无法依照我们的意愿去除，只能设法调整、平衡。
例如：在智能手机出现之前，手机上的操作按钮都是实体按钮。在智能手机出现手，手机被整个屏幕占据后，所有的操作都集合在了手机系统之中，等于把物理操作转移到了系统操作中，其本身的功能复杂程度并没有发生改变，只是转移了而已。
6、防错原则
大部分的意外都是由设计的疏忽，而不是人为操作疏忽。因此，在设计中要有必要的防错机制；在此，特别要注意在用户操作具有毁灭性效果的功能时要有提示，防止用户犯不可挽回的错误。
例如：登录时用户名校验，手机号码位数限制等。
7、奥卡姆剃刀原则
“切勿浪费较多东西去做，用较少的东西，同样可以做好的事情。
”这个原理称为“如无必要，勿增实体”，即“简单有效原理”。
在设计中可以使用户关注最主要的信息而非其它无关紧要的事物，从而提升使用效率。
三、交互设计如何开展工作
首先在交互设计师拿到需求后不要急着打开软件开始绘制线框图，而是要先分析需求，了解产品的战略层和范围层的业务目标。把握产品设计大方向，只有方向对了后面的工作才是有价值的。
把握了产品方向，下面就该进行需求的分析，
首先针对需求考虑5个问题：
1、为什么要做这个功能？（业务需求）
2、产品期望得到怎样的成果？（业务目标）
3、谁来使用？（目标用户）
4、他们要怎样使用？（用户需求）
5、如何让他们都来使用？（将业务目标转化为用户行为）
清楚这5个问题后，再根据交互设计流程进行一步一步的进行
这实际上就是对需求的战略层分析。
我们进一步分析业务需求（业务目的、业务目标）和用户需求（目标用户、用户体验目标），把握关键因素（用户的动机、担忧和影响目标达成的障碍）。
归纳这些需求，明确设计策略。
将“业务目标”转化为“用户行为”，通过引导用户的使用来帮助产品实现目标。
从设计“用户行为”到设计“用户界面”，用户行为决定了用户界面，用户界面也导致了用户会出现什么样的行为。
设计需求分析方法就是要帮助用户创造动机、排除担忧、解决障碍。
四、如何进行用户研究，方法有哪些
评估的形式及方法
常见的评估形式分为三类：
1、评估主体：根据评估的主体不同来进行区分，即谁来做评估。
按照评估主体来区分主要有两个主体：用户和专家
用户评估主要靠收集用户使用数据，也就是用户测试，它的数据相对客观，但时间和费用较多，评估范围较窄。
专家评估是让工程师及设计师等专家基于自身的专业知识和经验进行评估的一种方式。专家评估相对主观，但费时少、费用少、评估范围窄。
两种评估方法可以相互补充，并结合使用。
2、评估性质：例如定性评估、定量评估或着其它方式。
按照评估的性质来区分可以分为定量评估和定性评估。
定量评估是指对可以计量的部分进行评价，如点击量、使用率等，可以用数据来说明。
定性评估是指对非计量性的部分进行评价，如流畅度、舒适性、创造性等进行评价。它只能表示一个度，无法准确用数据来说明问题。
3、评估过程：按照评估的过程来进行区分。
从评估的过程来区分可以分为理性评估和感性评估。
理性评估相对客观，从客观的角度出发判断客观事物。
感性评估更为主观，评估结果并没有客观规律。
在实际应用中也需要将理性评估和感性评估结合使用，才能完整的完成我们的任务，达到我们的目标。
常见的评估方法有四种：
1、原型评估方法：在产品研发过程中，对于界面设计以及程序的测试来获得用户的反馈是至关重要的。以用户为中心和交互式设计的重要因素之一就是原型方法，原型方法的目的是将界面设计与用户的需求进行匹配。
一般来说原型评估方法分为三大类型：
（1）快速原型：原型迅速成型并分配实施，在原型实验收集的信息基础上，系统从草案中得以完善。
（2）增量原型：应用与大型系统，从系统的基本骨架开始，需要阶段性的安装，及系统的本质特征是在初次安装完成后允许阶段性测试，以减少遗漏的重要特征。
（3）演化原型：对前期的设计原型不断进行补充和优化，直到成为最后的系统。
2、简易测试评估方法
在条件不允许的情况下，可以采取简易的方法来对用户体验进行评价。步骤是：
（1）实验室环境准备：准备好测试用的电脑或其他媒介。两个房间，房间1用来对被测试者进行测试，房间2用于设计师和工程师的观察。
（2）被试选择：分为用户组和专家组。
（3）进行测试：房间1中被试者根据自己的选择进行操作和测试，同时说出自己的内心想法，观察员在调查表上记录被试者的每一次的操作情况，包括出错情况和被试者的口语描述，当被试者在测试过程中遇到困难或操作无法进行时，观察员要给予一定的客观提示。房间2中通过相关设备将房间1的情况传输到房间2，设计师和工程师实时观察和记录被试者的情况，以便今后对产品做进一步的修改和完善。
（4）结果分析：通过多次测试后，将测试结果汇总，提取出交互设计中存在的问题，以及对交互设计有益的建议形成测试报告。
3、眼动评估方法
眼动追踪可以用来评价对产品（包括硬件产品和软件产品）设计的感性意象，评测产品设计特征。眼动评估的主要指标有注视热点图、搜索过程测量指标、兴趣区域即用户视觉注意的焦点区。可以结合口语分析法了解用户的所想 和所做。
4、脑电评估方法
通过对脑电信号的分析，研究者可以探索大脑的认知加工过程和受试者的心理状况。近年来脑电评估方法在人机交互心理学等领域应用广泛，被用来评估交互设计、人机界面、产品设计等方面的内容。但是脑电评估也有一定的缺陷，例如空间分辨率上的局限性，因而对某些认知过程和脑区的定位并不是很准确。第二，在许多相似的实验研究中，由于研究者采用了不同的实验材料和方法等，实验结果也存在差异性。第三 ，由于采集记录时间的滞后性，脑电所记录的并不一定是当下被试者所想到的内容。
采取哪种方法来开展用户测试和评估，要根据不同的任务结合不同的环境来开展，比如：时间、成本、资源等。
启发式评估法
是专家评估法的一种，也被称为经验性评估，最初由Nielsen博士提出。简单来说，启发式评估是一种简易的可用性评估方法，使用一套相对简单、通用、有启发性的可用性原则，让几个评审根据专业知识和经验来进行评估，发现产品潜在的可用性问题。
启发式评估的两大要素：评估者和评估参照的原则。
对评估者的要求主要有四个方面：
（1）人数：推荐3-5人，有时会更少
（2）知识：最好同时具有可用性知识及设计知识
（3）身份：最好是非设计者本人，否者不具有客观性
（4）岗位：设计师或用户研究员
评估参照的原则有：尼尔森十大可用性原则、八项黄金法则、首页可用性指南、ios设计指南、拓展原则、HHS网页设计与可用性指南等。具体需要根据实际项目来选择，常用的是尼尔森十大交互原则。
什么时候适合使用启发式评估法？
交互设计和UI设计阶段、测试优化和产品发布后的阶段。
启发式评估的优缺点有哪些？
优点：成本低、效率高、发现大多数可用性问题，甚至是用户测试时不会出现的问题。
缺点：不能代表真实用户，相对主观、有时候发现问题过多、对评估人员知识背景要求较高。
什么时候适用？
（1）适合时间、资源有限的情况下快速发现可用性问题，降低风险及成本。
（2）版本变动不大的情况下，小成本检验。
（3）作为可用性测试的之前准备。
启发式评估流程是什么？
（1）准备阶段：确定范围、背景调查、参考评估原则、评委邀约、材料准备
（2）执行阶段：任务走查、整体走查、结果记录
（3）分析阶段：汇总讨论、报告总结、优化方案
可用性测试
先来看一下我们在平时工作中常常会听到这样的问题
产品经理：我们的用户觉得产品好不好用？使用过程中会不会遇到问题？他们是否满意？
设计师：设计的过程有一些纠结的地方，不知道实际用户是怎么理解和操作的怎么办？
产品开发后：想在大推前检验一下产品是否靠谱，适不适合大推？
当我们遇到这样的一些问题时，如何找到方法快速得到答案呢？
那就是接下来要介绍的可用性测试方法。
可用性测试是一种常用的、高效的方法。
它的定义是：通过观察具有代表性的用户，完成产品的典型任务，从而找出产品可用性问题并解决，目的是为了改善产品，让产品更容易使用。
什么时候适合做可用性测试呢？
一般是在：交互设计或UI设计、测试优化、正式发布三个阶段来做。当然是越早做越好，可以尽早发现问题并及时调整。
类型分为两种：形成式和总结式
形成式特点：小样本、发现问题为主、不能做定量对比。
总结式特点：大样本（30人以上）、定量的评估、可以做对比评估
可用性测试可以解决什么样的问题？
1、发现问题，产品在体验上是否存在问题
2、检验实现，期望的设计目的有没有达成，是否满足了用户的期望
3、产品评估，用户是否会满意
4、理解用户，了解用户行为习惯，了解用户认知，找到某些问题的原因
测试流程是什么？
整体上分为4个阶段：1、准备 2、测试 3、分析 4、优化
1、准备阶段要做的有哪些？
确定目标：确定测试目标决定了后面测试过程要怎样去设计
常见的测试目标有：
·对整个产品做可用性评估
·对新增的功能模块进行评估
·提前观察新方案对新老用户有怎样的影响
·提前检测改版是否达到预计目标
·设计时存在争议，如何选择解决方案
·某个环节流失率较高，检测是否为设计原因导致
·需要拓展某一类特殊用户，测试针对这类用户在设计上是否需要作出调整
准备测试方案
方案中应当包含以下内容：
·测试目的：明确测试的目的及范围，测试目的决定了测试方案
·测试关注点：与负责的设计师一起梳理测试中要关注的问题
·用户招募：招募要求，样本配比，招募渠道
·经费预算：奖励的形式和额度
·时间计划：用于把控时间计划
撰写测试脚本：设计测试任务，通过用户行为去观察提问来获得我们想要的内容
基本的流程有：
·暖场：3min，简单聊天，消除用户的紧张情绪
·测试说明：2min，对测试内容规则做说明
·测试前访谈：10min，了解用户基本信息
·简单试用：3min，让用户熟悉产品
·测试执行：30-45min，提示任务并观察
·事后访谈：15min，针对疑点问点追问，填写评价表
·道别：5min，支付礼金，送用户离开
招募用户
招募什么样的用户呢？
·根据测试目的来定，找出与测试目标有关的筛选纬度
·特别考虑用户使用行为相关的特征，例如竞品使用经验，使用产品的目的，用户的活跃度等
·挑选最核心的纬度，转化成用户招募的条件，并尽量客观化，具体化，可衡量
·避免设置交叉条件过多，导致样本代表性降低
·学会辨别真假的用户信息
招募多少用户合适？
·以发现问题为目的快速可用性测试，6-8名即可
·考虑产品的复杂性，覆盖人群差异性，适当做调整，拓展到10-15名
招募渠道有哪些？
·公司内部
·现有产品用户库
·公司其他产品用户库
·熟人，朋友等
·推广渠道：官微、公众号、门户网等
·社区，论坛，qq群等
·第三方调研公司
准备测试素材：低保真或高保真原型，或线上已经可以使用的产品，也可以准备一些量表工具来辅助测试。在测试
过程中需要用到的电脑或手机设备，摄像头，纸，笔，桌椅等。
测试场地选择：
·专业可用性测试实验室：一般对测试质量要求较高，旁听人数较多且需要采集丰富的数据的时候采用此方法。实验室有两个房间，一个测试间，一个观察间，中间有单向玻璃分隔。测试间中有多角度的摄像头，用来记录测试过程，观察间可以同步看到测试间里的情况，
·普通测试环境：在观察人数较少（小于3人），条件有限时使用。
预测试阶段：正式测试前进行预测试，保证测试流程通畅
·走查：记录可能出现的问题
·预测试：找人先测试一下
·调整：调整测试流程
正式测试阶段
测试参与人员有
·主持人：引导整个测试流程
·记录员：记录操作行为，访谈内容，发现问题等
·产品团队：参与旁听，观察，结束后交流
·用户：完成测试及访谈任务
测试过程中需要观察的要点：
·用户是否独立完成了任务
·是否存在无效操作或不知所措的情况
·用户是否满意
结果分析
边测试边总结，越及时越好
·测试完一个用户，做一次小结
·测试结束当天写小结，与设计师当场讨论
·重要问题反馈后再总结分析报告
·边测边改，边改边测
结果分析4个步骤：1、对发现分类 2、整理不确定项 3、评定优先级 4、结果记录
撰写报告
从4个方面来写：
·总体如何
·有哪些问题
·严重程度如何
·建议是什么
·除此之外，还可以围绕关注的问题，未满足需求补充分析
优化跟踪
在测试之后需要出优化的方案，测试优化的过程是循环的。
测试之后如果还有其他问题没有得到解决，可以结合其他的一些测试方法来得到。
问卷调研
问卷调查法是以书面提出问题的方式搜集数据的一种研究方法，研究者将所要研究的问题编制成问题表格，让受访对象以邮寄、当面作答、在线作答或追踪访问的方式填写，从而了解被试者对某一现象或问题的看法和意见。问卷调研可以用于需求挖掘阶段，也可以用于产品上线后的评估阶段。
如果是想了解用户对产品上线后的满意度，可以使用问卷调研的方法。它比较适合去了解用户的认知态度，也可以附带了解用户的行为习惯，
问卷调研的优缺点
优点：统一性、灵活性、量化性、匿名性
缺点：（1）只能获得书面的信息，而不能了解到生动、具体的情况。（2）缺乏弹性，很难做深入的定性调研。（3）调查者难以了解被调查者是否认真作答，是不是自己填写的。（4）填写问卷比较容易，有些别调查者会随意选择，或者按照社会主流观点选择，这样会使调查失去真实性。（5）回复效率低，对无回答者的研究比较困难。
问卷调查的使用场景
适用于：（1）需要进行定量分析的调研。（2）需要匿名进行调研的问题。（3）对已有假设进行检验。（4）寻找问题隐藏的关联。（5）对产品设计用户认知及态度的评估。
不适用于：（1）发现和描述具体问题。（2）探索受访对象的模糊态度。（3）获取创新想法。（4）获取精确的行为数据。
问卷调研流程
1、确定目标：确定调研目的、对象、分析目的和应用对象。
2、调研方案：通过访谈、经验、理论等，确定调研框架，题目选项，分析思路，投放渠道，相本配比等。
3、问卷设计：问卷设计，问题美化，投放渠道。
4、问卷测试：多人测试，确保问卷的可读性，逻辑通畅
5、问卷投放：按照计划好的投放渠道进行投放，回收数据，数据清洗
6、问卷分析及填写报告：分析及报告填写，调研结果落地
数据分析
概述：通过在网站或应用中进行数据埋点，获取用户对产品的使用和行为数据，并进行基于产品体验优化的数据进行分析。
数据分析可以做什么？
1、可以做到用户从哪里来，来了多少
2、获取用户属性，用户地域，用户设备
3、访问了哪些页面，使用了哪些功能，消费了多少钱，消耗了多少时间
4、哪些流量可能存在问题，忠诚度如何，活跃度如何，有没有达到目标，和行业相比如何
5、流失情况如何，离开之后是否还回来
可以作为产品的眼镜和大脑，提供客观衡量的依据，可以持续优化改进。
数据获取方式的对比
日志文件：优势，完整的服务端请求记录。
缺点，日志的获取和清洗有过滤成本，许多页面操作无法记录。
JS页面标记：优势，数据获取可控、灵活，可以对页面操作记录进行记录，获取数据比较完整丰富。
缺点，需要在页面植入JS标记代码，某些情况下无法获取，如当用户禁用JS功能时。
常用的数据监控平台
1、第三方监控平台：如Google Analytics、百度统计、腾讯云分析等
2、自研平台
数据分析流程
1、监控 2、定义 3、埋点 4、测量 5、分析 6、优化
Web分析常用的指标
PV：是指页面浏览量，网页浏览数实施评价网站流量最常用的指标之一，用户每一次访问网站中的页面均被记录，对统一页面多次访问，访问量累计
UV：是指独立访客，是通过互联网访问、浏览这个页面的自然人
UPV：是指唯一身份综合浏览量
访问：是指在一定时间范围内，网站所有访问者对网站发起访问的总次数，从访客来到网站到最终关闭网站所有页面，记为一次访问
识别用户的方式：IP、IP+User Agent、cookie、User ID、设备ID、其他
复合指标
跳出率：指用户来到网站，只浏览了一个页面就离开的访问次数，占全部访问次数的百分比，简称“来了就走”。跳出率可以被用来衡量流量和页面质量，高跳出率表示访问者对着陆页面不感兴趣，没有继续访问更深入的页面。也可能页面设计存在问题，也可能是导入的用户不匹配。跳出率可以通过调整广告渠道，优化页面内容来降低。
退出率：访问者离开网站一次被记录为一次退出，某一范围内退出的数量/该范围的综合访问量就是退出率。如果关键流程中的某一页面退出率高，代表某一页面可能出现了问题。
访问时长：网站停留时长，页面停留时长，应用使用时长。访问量是访问质量的一个衡量指标，较长的访问时间说明用户与产品进行了较多的互动。
访问深度：可以理解为单个用户平均访问的页面数，是PV/UV的比值。访问深度也是访问质量的一个衡量指标，可以考察用户是否和网站进行了较多互动。这个比值越大，代表网站的粘性越高。
转化率：指在一个统计周期内，完成转化目标行为的次数占总访问次数的比率。根据设置不同目的进行计算，例如注册转化率、付款转化率等，是一个重要的分析指标。
移动端基础指标
移动端的基础指标监测与web端略有不同，但分析思路大致相同。指标分为：新增设备、累计设备、启动次数、单词使用时长。
常见分析内容
流量分析（哪里来？）、用户分析（什么样的用户？）、行为分析（如何使用的？）、路径转化（表现如何？）、流失分析（粘性如何？）
A/B test
A/B测试是一种帮助网页优化实验的方法。A/B测试的目的在于通过科学的实验设计和采集数据的方式，来获得具有代表性的实验结论，从而寻找到更好的产品策略。
简单来说，就是为同一目标制定两个方案，让一部分用户使用A方案，另一部分使用B方案，记录用户的使用情况，对比两个方案的结果，选择更符合的方案。
A/B test一般会在产品改版正式上线之前使用，来验证新的设计是否可以提高产品的表现。
A/B test可以测试的元素有：标题、图片、颜色、社交元素、段落文本、按钮、导航、任务流程、页面布局、价格、视频等。可一次只改变一个元素或一次改变多个元素的方式来测试，这就是两个测试类型单变量测试和多变量测试。
A/B test工具
Google Website Optimizer：搜索巨头提供的免费A/B test工具，一个很好的入门级工具，但是没有一些先进的功能。
Visual Website Optimizer：一个易于使用的A/Btest测试工具，包含功能有所见即所得的编辑器，单机地图，访问者分割和标签等。
Unbounce and Performable：集成着陆设计的A/B测试工具。
Vertster,SiteSpect,Webtrends Optimize and Omniture's Test&Target：企业级测试工具
App Adhoc Optimizer：国内A/B Test工具，同时支持前端（Web/H5、IOS、Android）及后端（Node.JS、PHP、Java）AB测试服务的专业Saas平台
Optimizely：是网上现有的最专业的AB测试工具之一，它的价格要比其他的工具高很多（也可以免费使用一个月），它提供了一些非常好的功能。
Unbounce：对于登录页面的测试来讲非常不错，而且它不仅仅是个测试工具，还可以在无需自己编写任何代码的情况下来创建登录页面。
如何做A/Btest
1、确定目标，例如提高网站的付费转化率，降低跳出率等
2、测试方案，建立假设：购买按钮的颜色会影响点击率？缩短流程可以提高复费率？改变导航可以降低跳出率等？
3、创建相比较的两个版本，改变其中的变量
4、发布测试，将部分流量导向B方案，但不一定是5：5
5、数据分析，收集数据，对比AB版本的转化率、跳出率、留存率等
感谢阅读！
米勒定律背景：
1956年经美国心理学家发表了一篇名为《神奇数字7》的论文，论文中讨论了一维绝对判断的极限和短期记忆极限之间的关系：一维绝对判断的备选数目与短期记忆极限的数目大致相当，数字都在 7 左右徘徊。在后来的好些研究虽然也对论文中的一些概念进行了改善，但这个数字7依然被保留。这也是人们关于短时记忆内容最早期的研究结果，现在也普遍适用在设计中，也就是现在的米勒定律。
米勒定律定义：
从心理学的角度来看，人类处理信息的能力是有限度的。人脑在处理信息块的时候会受到7±2规则的限制，即人的大脑最多同时处理5到9个信息块。原因是短期记忆储存空间的限制，超过9个信息团，将会使得大脑出现错误的概率大大提高。
思考结论：人们的短期记忆有限，通常只能记忆7±2信息块。信息块越多，人们能记忆的信息精准度越小，越容易出错。
米勒定律应用：
在产品设计中，米勒定律可以说是信息内容处理的一条规范准则。通过减少对信息层级的划分、归类分组、辅助记忆等，来提高用户对信息的高效识别与记忆。在追求极致用户体验的趋势下，用户对信息的预见与计划在产品设计中也是极为注重，无论在产品设计的初期还是成熟期，合理的信息处理将会大大提高用户对产品的好感度。
01、控制数量，减少用户选择
人们对信息的记忆处理是有限的，通常信息越多我们将越难以记忆。所以在做产品设计的过程中应该控制好信息块的数量，增强辅助用户识别与记忆，提高用户体验。
02、信息分段，辅助用户记忆
在产品设计时我们经常能遇见一连串信息（数字、文字、段落等）的情况，当信息数量较大的时候，我们可以采用对信息分段的处理方法，将一连串的信息以7±2个内的信息数量为一个段点，辅助用户记忆。
03、流程分步，优化用户操作
经常会遇到信息特别多或者复杂业务场景，特别是在B端产品设计。通常我们都会先梳理业务流程，然后分步骤处理对应的信息。从而减少单屏信息内容过多给用户带来的急躁，让用户每个步骤都沉浸与当前的操作。
04、信息排序，引导用户记忆
人们在记忆一组多数据信息块的时候，通常都会对首末的两个位置信息块的记忆会相对比较强，所以在产品设计的时候，需考虑把重要的信息放在首位/末尾位置，引导用户去记忆该信息。这也就是系列位置效应（首因效应、近因效应）。
A、首因效应：指在整个序列的信息块中，相比中间位置的信息，人们对最前面的信息记忆更加清晰。
B、近因效应：指在整个序列的信息块中，相比中间位置的信息，人们对最后面的信息记忆更加清晰。
C、设计思考：人们对信息流排序的时候应把重要的元素放置在首位或者末尾。若用户是长期记忆的的话考虑首因效应、短期记忆思考近因效因，人们的记忆不仅受到位置的影响，同时也受时间影响，在不同的场景下合理应用系列位置效应.
米勒定律在产品设计中的应用主要是解决信息块对用户的记忆问题，合理的信息布局和信息处理可以大大的提高用户对信息的阅读和记忆。还可以根据不同的业务场景引导和辅助用户识别和交互，增强用户对产品的好感与体验。
文章来源：站酷 作者：TerryChen_
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、
BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
尼尔森的十大可用性原则是尼尔森博士在分析了两百多个可用性问题的基础上，提炼出的十项交互设计原则。被广泛运用于网页、APP以及各种人机交互领域。
要注意的是，这10项原则是启发式（heuristics）的、通用的经验法则，而不是具体的规定。
系统应该通过在合理时间内的适当反馈，向用户通知正在发生的事情或者当前的状态。
不要蒙蔽用户，沟通是所有关系的基础，无论人还是设备。
当系统响应时间小于1秒时，通常正常反馈即可；
当响应时间长于1秒时，我们通常会通过加载动画、分步加载、占位符加载等方式，减缓用户等待的焦虑感；
如果超过10秒还没有得到响应，那么通常会认为这次请求是失败的，需要给予用户失败提示。例如：刷新提示、新页面加载提示、支付提示、下载提示。
当然加载时间并没有固定的规定，有个例子是这样的：
某个APP的用户反馈说他们的页面加载太慢了，希望提高服务器反应速度……于是他们对此进行了优化，优化后用户的反应：新版很给力，很快！
那这个团队的优化方案是什么呢？
。
。
。
——他们把小菊花转圈的速度提快了
对用户操作的适当反馈是用户界面设计的最基本准则。让用户了解当前状态、位置、是否成功、进度如何，减少不确定性；并引导他们在正确的方向上交互，而不是浪费精力在重复操作上。反馈有：
·状态反馈
用户需要知道自己的操作是否被系统感知，所以用户操作后，应该第一时间给出反馈。最常见的就是各种按钮的不同状态，比如未点击、点击、不可用状态，以及选中、未选中状态。
就拿小说类批量订阅列表来说，起点通过明显的线面和颜色区分选中和未选中的章节；而长佩我买的时候是需要反应一下：免费不可选中是浅灰色、未选中是深灰色，选中是绿色……但是初始状态时深灰色看起来像是选中？？
·进度反馈
进度通常有页面加载进度、下载进度、视频播放进度等
比如下图的invision网站，在阅读文章时通过顶部进度条的反馈，让用户知道自己的阅读进度。
·位置反馈
因为网络空间中用户无法像物理空间那样感知到自己的位置，所以我们需要在视觉上进行提醒，以免用户迷失。
比如标签栏、导航栏通过选中状态来定位当前所在页面，阅读、看视频、听音乐时系统会记录当前的位置，下次打开后继续。
·反馈方式多样化
反馈可以通过元素的颜色位置、文字、声音和震动，甚至动效去表达变化。
比如京东，通过产品图缩小-加入购物车的动效来反馈“商品已加入购物车”，直观形象。
使用用户熟悉的语言，单词、短语、图形，而不是系统导向的术语；遵循现实世界的惯例来呈现信息。
这里的语言不仅仅包括文案层面的语言，还包括产品的设计语言（图形、配色和风格）。
产品使用的语言应该使目标用户能够清晰理解的。如果用户不能理解，他们会感到被忽视和受挫败，许多人将选择其他产品完成目标。
特别是现在很多公司选择耕耘细分市场的产品来分一杯羹，比如针对中老年、青年、儿童的产品，抑或商务、娱乐的产品，都要分别使用符合自己的定位的语言。
比如bilibili的设计语言和每日优鲜的文案语言——
模仿现实世界的产品或者使用映射，能够利用人们现有的知识，降低学习成本，使他们轻松快速的理解界面。
像早期拟物化的设计，以及MD的魔法卡片模拟了物理世界中的纸张。IOS的指南针也类似现实世界中的指南针，以便用户轻松的使用。
熟悉是这些体验让用户愉快的原因。
比如微信阅读打开书的动效就像现实世界的打开一本书一样、给medium文章进行标记就像我们现实中使用马克笔一样。
用户经常会在使用时发生误操作，所以产品需要一个非常明确的“紧急出口”帮助他们——即提供取消和重做的功能。
用户在使用产品时可以自由进退，遵循从哪里来就可以返回哪里去的原则；比如常用的各种二三级页面左上角必备的返回按钮。
当用户误操作时要给用户提供提供撤销、取消、重做等相关功能，比如聊天类产品的信息都可以短时间内撤销。
（突然发现这张图暴露了我每天点外卖的事实 ヽ(。>д<)ｐ
不可逆的操作需要给用户明显的提示，以免对用户产生严重的影响。比如删除功能通常需要二次操作，重要操作会有弹框类提示。
设计者应遵循一致性原则，统一标准能确保用户理解各个元素在设计中，并且知道去哪里寻找哪些功能。
移动市场成熟的今天，已经有很多约定俗成的惯例。和用户的习惯一致，意味着用户不再需要重新学习，各种应用的切换之间没有学习成本。这也是我认为设计的趋同化未必不是一件好事情的原因。
比如常用的几种操作手势、下拉刷新功能、我的/地图/购物车图标等
在同一个产品中，同一层级的信息应该使用一致的设计语言。
比如导航、弹窗、按钮、列表，这是我们推行设计组件和规范的一个原因。
除此以外，颜色、文字、圆角、阴影等也是需要注意一致性的。
△谷歌google visual guidelines-google ads
用户经常分心于手头的事情，因此需要通过提供建议、利用约束来防止无意识错误。
其实限制用户的选择并不是一个好主意，但是如果有明确的规则来定义可接受的选项，那么限制用户可以输入的类型是一个很好的策略。
比如订房时，对可订房日期进行限制，防止用户选错时间。
提供清晰的提示，也能防止用户犯错，提示包括标签、文字、颜色、以及反馈状态等。
比如IOS的键盘，选中的字母会放大，提示用户；输入文字光标会放大，防止用户操作失误。
比如负向操作通常为红色，红色是一种警示色，给用户预警防止误操作。
尽可能减少用户的记忆负担，向用户显示他们可以识别的内容，而不是自己记忆和填写。
选择和输入的操作成本相差巨大。产品应该给用户提供选项，让用户可以直接选择，而不是自己输入。比如淘宝填写收货地址
在用户使用产品的过程中，会有产生一些需要记忆的内容、或者操作路径，这个时候我们要避免用户记忆，把信息直接提取出来，送到用户手里。
比如自动读取短信验证码，比如bilibili会提醒上次播放的位置
内容可预期，减少用户操作路径，防止来回跳转。
比如起点章节付费时可以直接看到当前的余额、
比如京东金融首页直接显示了余额和代还金额（本来应该打个码的，但是想想我三位数的资产打码还不够费劲呢(ಥ_ಥ)
好的产品需要同时兼顾新用户和资深用户的需求。
对新用户来说，需要功能明确、清晰，对于老用户需要快捷高效使用高频功能。不可迎合某一种用户，把不必要的信息占据重要部分。
在首页放置常用功能，比如淘宝、支付宝、bilibili等等；或者提供自定义入口，比如猿题库可以自定义科目
对用户频繁使用的功能，提供重复操作入口或者模板。比如美团外卖，可以直接选择再来一单
通过提供系统默认选项，而减少用户多余的操作。比如美团、携程、每日优鲜等当地服务类产品，会默认选择当前定位的城市；购物会选择默认收货地址等
不要包含不相关或低频次的信息/操作。页面中的每个额外信息都会降低主要内容的相对可见性。
能够方便用户无障碍的浏览信息，越重要的内容越突出。
通过颜色、大小、字体的字重、对比度、元素的间距、特殊造型、动效等来表现。
页面中背景、装饰元素视觉过重的话，就会干扰到用户对于信息的阅读。
比如以图片为背景，我们要考虑图片上文字的识别性；列表页过重的分割线、页面内过多的装饰元素都会给干扰信息阅读……
比如下厨房菜单推荐的卡片，字体识别度特别差；移动掌厅的这个模块，字体色和背景色对比不清晰、以及字体太小，都会干扰用户识别信息——我们需要做的是降低这些干扰
错误消息应以简单的语言表示，准确指出问题，并提出解决方案。
当发生错误时，提示信息一定要直观，视觉上能够引起用户注意，可视化处理，文案要简单概要。比如账号密码错误、以及各种异常状态
当用户遇到错误时，不要只是报错，尽可能提供详尽的说明文字和指导方向，遇到了什么问题，以及如何解决等等。
帮助性内容有一次性提示、常驻提示和帮助文档。
多用在用户第一次使用，或者产品更新后，通常为气泡形式，或者snakebar的形式呈现。
用于操作时必须注意到的内容，在页面中以文本或者标签形式呈现。
一般用于解释规则或者热点问题，通常以超链接的形式存在于页面中；或者以集合形式位于设置页中，此时需要注意要易于检索。
本篇文章主要介绍了尼尔森的10大可用性原则，以及介绍了适用范围和案例说明。最后我们再来复习一遍加深记忆吧~
一个个看起来精致的页面也是由这些UI设计细节组成的。对于页面细节的处理也往往可以体现UI设计师的专业和严谨度，本文分享的这些设计细节，不仅新人设计师常常会忽略，就连有经验的设计师也时常会在这些细节上处理不当。
文字细节
A．文字行距
在做段落文本时，我们很少直接使用默认的文本行距，为了保证阅读的可读性和舒适性，必须设置比默认值更大的数值的行距。
具体的数值可以设置在字号的1.3～1.8倍之间，一般情况下，字号越小，需要的阅读空间会略大一些，特别是在设计一些阅读类需要阅读大段文本的产品页面时，一定要加大行距来提高文本的可读性和阅读舒适性。
B．文字对比度
在界面设计中，应该要保证任何文字的可阅读性，它应该有足够的对比度，即使是提示性文字也要保证在任何类型的显示器上都可见易读。
间距和边距
A．去掉多余的边框和分割线
用大量而明显的分割线和边框将模块分开，是UI设计新手常常犯的错误，但在设计的同时，可以停下来好好思考：用分割线分开一定是最好的方法吗？有必要吗？
有时用1px的边框和分割线确实是合理的，但也有其他的方法来进行信息的归类和分割，比如利用阴影和更大的间距。
B．避免不均匀的边距
在进行卡片式设计时要注意内容与卡片边缘的边距。如果你是以常用的从左上角到右下角的方式来布局内容，那就让顶部的边距比左侧的边距稍大一点，看起来会比四边都相等的边距更加舒适美观。
投影
在物理现实中，物体的投影绝对不会是黑色的，物体的投影颜色始终会受到其所处在的环境的影响。
应用在界面设计中，物体或是卡片的投影颜色应考虑其背景和环境颜色来进行结合设计，即不应选择纯灰色，而是选择带有背景色彩倾向的灰色，同时设置适当的透明度和模糊值，来营造自然舒适的投影效果。
内容填充
重复和随意的示例文本和图片放在设计图中看起来会很不专业，应该避免交付这样的设计稿，它会让人觉得你对自己的设计是不专业不用心不愿意花时间的，同时也反应了你对与自己的设计产出的重视程度。
此外，也已经有一部分插件可以自己自动选择填充内容，为设计师节省了这些素材的填充时间，所以在交付设计稿时，让自己的设计稿尽量完整专业，哪怕是为了演示效果，也应该放上相应的不同的内容标题、文本、图片，让整个设计看起来更加专业和完整。
以上提到的每一条规则都要结合具体的产品来进行具体分析和设计，但是可以适用在在大多数情况下，设计从来没有一个标准答案，对于设计新手要训练的是，如何找到那个最合适当前产品的设计方式，希望这篇分享能对你有帮助，感谢阅读。
当我们拿到网页设计需求时，首先要确定是不是要单独开发移动版本。因为响应式布局兼顾了手机端适配问题，但是受加载速度、手机浏览器、栅格化系统的限制设计发挥的自由度、等的影响很大。
栅格化设计：是针对网页设计师。主要是为了提高网页的规范性。
栅格设计系统：（网格设计系统，标准尺寸系统、程序版面设计）是一种屏幕设计的方法和风格，运动固定的格子设计版面布局，其风格工整、整洁。
栅格化布局：针对前端开发人员，指前端攻城狮使用的css框架，来实现页面的响应式布局。
设计师使用纵向的栅格（列）让页面元素垂直方向上对齐，使用横向的栅格（排）让元素水平方向上对齐。设计师结合基准网格（8pt）和纵向栅格（12栏 16pt）进行设计。
基于设备的逻辑像素进行UI设计——设计开始前UI设计师要根据桌面和平板手机分辨率大小，考虑最大最小响应的屏幕，给出响应的策略设置断点和次断点。
断点：(breakpoint)是页面改变布局的临界点，一个响应式网页可能会有一个或者多个断点。有时候网页也会设置次断点。
次断点：(minor breakpoint)并未对页面布局做很大的改动 只是对细节做了一些微调。
媒体查询：（media queries）是实现断点的一种方法，它提供了简单的逻辑方法来根据不同的设备特征（宽度 高度 像素比）应用不同样式，最常用的媒体查询变量是min-width和max-width。）
设计师根据网页的内容找到合适的断点。设置多少个断点由网站的内容决定，设置几个断点就需要设计几套UI设计图。设法避免列间空白太宽或太窄的情况。常见的设计尺寸1920PX（大屏电脑）、1440PX/1280PX（小屏电脑）、1024PX（横屏Ipad）、768PX（手机和竖屏Ipad）。（这些是根据市场常见的机型分辨率来的。再根据网页内容多少进行合理的增减。）
用chrome浏览器打开一个响应式网站，检查元素，右上角会显示视窗当前的分辨率，慢慢缩小视窗的宽度，找到页面布局的变化点，就是我们上面说到的断点或者次断点。）
这个当然不是了。这个视网站中每个页面的内容而定，甚至同一个页面的不同内容模块布局断点设置也不尽相同。在我的实践过程中，很多页面只需要设计三套，当然比较复杂的页面，在这五个分辨率上，都需要对布局做一些修改或者自动隐藏部分内容。
蓝蓝 http://www.lanlanwork.com