奔驰法（SCAMPER）是能够帮助我们拓宽解决问题的思路检查列表。在解决问题的过程中，如果感到束手无策，可以尝试从列表中显示的方向重新思考问题，从而打开解决问题的思路。你将通过本文熟练掌握其运用方法。
SCAMPER 是七个英文短语的缩写，同时也代表着七个解决问题的方向，这七个方向是：
SCAMPER 法的具体实践步骤：
麦当劳家喻户晓的知名度得益于极具传奇色彩的麦当劳创始人雷·克罗克先进的经营理念。毕竟麦当劳的出现让人们的生活模式发生了翻天覆地的变化。时至今日，我们仍然可以从麦当劳的商业战略中识别出 SCAMPER 法的踪迹：
替代
这里需要考虑的总体问题是：何物可被「取代」？
寻找当前选项的替代选项。这些替代选项可以是人，物或方案等一切等同于现有选项的东西。例如产品的替代材料，服务的替代方案以及后备人员等。
思考清单：
整合
这里需要考虑的总体问题是：可与何物合并而成为一体？
将现有产品和别的产品或系统结合在一起使用，或者能否与其它产品合并而成为一个整体？
思考清单：
调整
这里需要考虑的总体问题是：原物是否有需要调整的地方？找出所有可以调整的选项。
思考清单：
修改
这里需要考虑的总体问题是：可否改变原物的某些特质，如意义、颜色、声音、形式等？修改现有的所有或部分选项，重新组合出新产品。
思考清单：
另用
这里需要考虑的总体问题是：可有其它非传统的用途？不断寻找现有产品的新用途，将现有产品推广到新地方。
思考清单：
消除
这里需要考虑的总体问题是：可否将原物变小？浓缩？或省略某些部分？使其变得更完备、更精致？消除不必要的选项，减少不需要的功能。
思考清单：
逆反
这里需要考虑的总体问题是：可否重组或重新安排原物的排序？或把相对的位置对调？重组或重新安排选项的顺序，或把选项的位置对调。
思考清单：
这个检查列表最早是为头脑风暴设计的，旨在激活参与人员思路，起到发散思维的作用。心理学家罗伯特·艾伯尔总结了这些列表并做出最终的解释。目前奔驰法主要用在产品改造和服务升级的过程中，但它对普通问题的解决也有帮助作用。
文章来源：优设 作者：陆小凤不传奇
品牌 IP 化最大价值在于：通过挖掘品牌的人性，赋予性格、文化、价值观更像一个有血有肉有灵魂的人，通过持续的内容生产，吸引用户参与，进而使用户产生精神共鸣，在与用户产生关系的过程中给予情怀和温度、最终实现商业价值。
IP 在百度上解释为：（Intellectual Property）知识产权，指的是通过智力创造性劳动所获得的成果，并由劳动者享受成果的专有权利，是一种无形财产。现在市面上见到的 IP 现象呈现出来的是一种新商业现象、新商业模式、一种新的思维方法，比如我们见到的漫画、电视剧、明星、小说、游戏等……
用一句话解释：IP 就是自带流量、散发魅力、可以吸附粉丝、商业转化。
十多年前，品牌设计被叫做企业形象设计（VI），他的基本要素就是：企业 logo 图形、标准字、辅助图形、吉祥物设计等。设计师通过创意设计出简洁生动的图形传递品牌的形象，这个图形就像一个符号占领用户的心智。
企业的最终是要售卖产品达到盈利的目标，就要投入大量的成本去各种渠道推广品牌形象，比如灯箱广告、电视广告、车体广告投入等，以保持品牌曝光度。
1. 品牌IP化
近十年来，在早期一些互联网品牌变化中，我们发现京东、天猫、当当、国美……很多品牌都在打造动物形象。
从 2016 年开始，各个企业的品牌设计出现的一些新的方向，他们打造符合品牌的 IP 形象符号或者 IP family，比如知乎刘看山、 AcFun 的 AC 娘、哔哩哔哩的 2233 娘、QQfanmily、MTfamily，用一些傻呆、萌、贱、骚等个性鲜明的形象吸引粉丝，获得用户对品牌的好感度。
傻呆、萌、贱骚的个性IP形象：
IP族化：
从过去品牌设计发展到如今品牌 IP 化后，品牌逐渐变得有温度、有人格灵魂、更容易互动了。
1. 从理性功能定位转变到情感精神寄托
品牌设计在推广中强调的是产品功能，属于漏斗式输入。而品牌 IP 化追求的用户对价值和文化认同，提供给消费者的是一种情感的寄托。比如《故宫》不再是过去威武严肃的印象，以俏皮、卖萌的周边形象深受年轻人的喜爱，故宫的文化、传统元素也找到了新的传承渠道。
2. 用户购买行为由需要转变为热爱
品牌是通过传统的定位理论占据用户的心智，当用户需要什么产品？选择什么品牌？是根据产品融入脑海中品牌理念而选择了这个产品。比如当我们需要买去屑洗发水选择买海飞丝洗发水。
品牌 IP 后在一定程度上弱化了品牌，利用天生形象优势、人格魅力、深受用户追捧。用户的购买行为是感性的，由内心热爱驱动购买。比如爱莎这个形象深受女孩子的喜爱，有关爱莎的裙子、玩偶、绘本、电影等孩子会不顾一切要求购买。
对于企业来讲，是否可以生产一些吉祥物就可以进行品牌 IP 化吗？
其实并不是那么简单！品牌 IP 化远远不止于做一个动物卡通形象就可以了。我们在前面说到在 2012-2015 年互联网品牌大量采用动物形象，但是他们并没有形成品牌 IP 化。
判断品牌 IP 化的三个特征是看品牌 IP 化后是否具有内容持续生产力、跨界连接力、商业衍生力。
1. 品牌IP化可以持续输出内容、具备内容生产力
品牌 IP 化通过自身角色和人格设定，吸附更多的用户的喜欢和追捧。品牌 IP 化的形象可以成为一个优质的内容源，提供持续的优质内容，不断引发与用户的关注和互动。
内容具有持续性：
line 在全球深受粉丝的追捧，这很大一部分原因在于 line 不断持续制造内容。line 最初是韩国的一家通讯公司，2013 年因为表情包深受用户的热爱，并因此带来 10 亿的收入，之后 line 打造了ugc模式，由用户创作表情上传带来 147 万美金的收入。此后几年持续创作有新成员加入，制作新的热点和内容。
2016 年布朗尼妹妹丘可加入
2. 品牌IP化具有连接力，可以连接用户、跨平台、跨品牌连接不同圈层
连接不同圈层：
在以往品牌对产品的推广上，由于产品特点、行业本身的壁垒，品牌难以跨越圈层和其他品类进行营销方式上的更多尝试，而 IP 营销则打破了这一壁垒，跨越了产品品类和行业的界限，带来了营销方式和品牌创新上的更多可能。
比如 linefrineds 与京东、天猫、优衣库、VANS、悦诗风吟、施华洛世奇合作推出了很多联名款的产品：T 恤、护肤品、项链、运动鞋等。这些合作跨越了行业、品牌等。
连接粉丝或用户：
最初，熊本熊只是熊本县政府宣传案的「副产品」，但这只熊火爆程度比肩哆啦 A 梦。在形象产生一个月便策划一系列神奇而疯狂的事件，比如聘任熊本熊为临时公务员，熊本熊大阪失踪，寻找腮红事件等。这些具有热议感、刷屏感、卷入感事件曝光和粉丝持续产生了连接。
品牌 IP 化赋予鲜明的形象与性格，这样形象与性格能与用户产生更近的互动，当这个形象持续产生内容输出后，让用户会产生更强的参与感、立场感，品牌与用户也就更强地连接一起。
延伸阅读：熊本熊之父的故事
3. 品牌IP化具备衍生力，实现商业闭环
品牌 IP 化只是品牌在互联网时代的一个新的工具或者方法论，最终都是要实现商业价值。要想实现商业变现、长久发展，必须有不断跨界合作、衍生周边产品和服务的能力。比如 line，最初由一个卡通形象，慢慢发展到漫画、表情、周边。他可以在不同时代捕捉到当下的流行，并与之紧密结合，达成品牌 IP 在不同品类和不同时期都保持强有力的衍生变现能力。
品牌 IP 化最大价值在于：通过挖掘品牌的人性，赋予性格、文化、价值观更像一个有血有肉有灵魂的人，通过持续的内容生产，吸引用户参与，进而使用户产生精神共鸣，在与用户产生关系过程中给予情怀和温度、最终实现商业价值。
文章来源：优设 作者：咏舍
数据可视化是传达信息的最好的方法之一，它可以直观地呈现数据，快速吸引用户的注意力。但是如果设计师对图表设计的理解有偏差，在界面呈现上可能会对用户产生错误的引导，因此笔者结合自己的工作经验对图表设计进行总结，希望每位设计师都能成为优秀的数据搬运工。
下面我将从功能、交互和UI深挖图表设计的各个知识点，敲黑板划重点咯～
1.概念
图表泛指在屏幕中显示的，可直观展示统计信息属性（时间性、数量性等），对知识挖掘和信息直观生动感受起关键作用的图形结构，是一种很好的将对象属性数据直观、形象地“可视化”的手段。
如果说表格可以承载数据的全面性，那么图表可以完美展现数据的特点和变化，它对数据的解读能力是表格无法做到的。
2.使用场景
(1)比较数据差异情况。基于分类的数据，可以通过比较数据来了解不同分类的差异，比如柱状图。基于流程的数据，可以通过比较数据了解数据的变化趋势，比如折线图。
(2)分析数据关联情况。展现数据间相互关系和数据的流向。比如桑葚图。
(3)查看数据分布情况。对于错综复杂的变量之间关系，可以通过图表来找出规律。比如利用气泡图进行回归分析。
(4)了解数据构成情况。发现各变量的占比情况，比如饼图。
3.原则
(1)轻量。众所周知表格是可以承载数据的全面性，但将相同的数据用可视化展示时，设计师总想将所有的信息堆砌在图表上，显得图表非常笨重，因此增加了用户的思考时间。在此建议明确你图表类型的特点，将主要信息呈现在图表上或者分层展示图表，比如数据钻取功能。
(2)直观。设计师应该将数据信息清晰而直观地表达出来，使用户一眼就能洞察事实，更快地发掘商业价值并作出决策。
(3)美感。缺乏美感的数据可视化仅仅是数据展示。美感包括两个部分，第一个部分是整体协调美，比如对图表中的各个元素（标题、网格、坐标轴、缩略轴、图例、提示信息、预警线和辅助线等）进行合理的排版和使用协调的配色。第二部分是局部细节美，比如设计师根据流行趋势给图表加上渐变色。
我将用一种最复杂的图表类型-双轴图当作示范。
1.标题。包括左对齐、居中对齐和右对齐。在选择某种对齐方式前，请兼顾图例的摆放位置。
2.栅格。包含点状、线状和斑马线。
(1)根据数据特点选择横纵向辅助线，横向引导线增强水平方向的导视。纵向引导线增强垂直方向的导视。
(2)线状建议用虚线，因为不是用户确定指向值。
4.缩略轴。包括滑面和滑柱。
(1)拖动滑柱滑动，增加或较少滑面，从而改变查看密度。
(2)拖动滑面滑动，保持滑面长度，进行前后移动。不改变查看密度，只改变查看范围。
5.图例。离散型数据包括横向排列和纵向排列，连续型数据包括连续图例。
(1)所有图表类型的排列方式要统一，所以要考虑整体的图表空间是适合横向排列，还是纵向排列。
(2)所有形式总长度超过内容区换行或换列。
(3)双轴图包含了2种图表类型，不同类型的图例样式要有所区分。
(4)连续型数据通过渐变色来展示数据大小的变化。
7.预警线。数据超过阈值就会报警，帮助用户监控数据。
(1)预警线建议用实线，并用警示的颜色引起用户的注意，最好用邮件或短信通知用户。
8.辅助线。用户设置某值作为数据参考进行比较，比如设置平均分为参考数值。
(1)辅助线建议用虚线，仅起参考作用。
1.加载方式。加载动画建议使用和图表相关的样式。
2.排除异常值。允许用户剔除高度异常点，因为异常值会影响用户对整个图表的分析。
3.数据钻取。单击某个数据可以看到该数据的详细信息，变换分析的粒度。
4.适配
(1)增减留白。图表大小固定不变，只是增减留白空间。
(2)等比缩放。图表的长宽都以相同比例缩放。
1.颜色
(1)颜色主题
1)深色背景。适合较少信息内容。
优点：可以通过布局建立良好的视觉层次，深层次地反映内容，而且视觉吸引力强，给人以高端的视觉感受。
缺点：可读性低。页面太过聚焦所以对留白的平衡要求较高。
2)浅色背景。适合较多信息内容。
优点：可读性高，增加了页面空间。
缺点：内容不聚焦，信息过少则页面显得太空。
(3)颜色生成规则。一个变量统一用一种颜色，再按配色方案依次出每个变量的颜色。 使得同一图表的色彩搭配和谐且具有美感。
(4)视觉缺陷。世界上有一部分人群有视觉缺陷，他们无法通过颜色来得到来精准地区分图表的维度和变量。作为设计师不能忽略这部分较为庞大的特殊群体。
设计师常用的PS和AI提供了模拟红色盲和绿色盲的校样设置，选择“视图—校样设置—红色盲型/绿色盲型”。
想要从根本上解决这个问题，推荐一篇腾讯设计师的文章信息图形中的颜色探讨—面向色盲人士友好的设计解决方案。
2.布局
视觉层级要符合逻辑层级，利用信息深度引导用户阅读。每个元素要保持一致，保证布局的整体协调。
3.插画
符合主题和整体基调，简单易懂，数据可视化具有一定的认知门槛，有时候需要插画来提高用户的理解力。
4.留白
信息过多容易造成视觉压力，合理的留白可以增强用户对信息的吸收能力。
5.字体
避免有个性的衬线字体，字体要保证清晰可见。字体大小适中，太小影响阅读，太大容易占用图表控件。普通字体大概12px，标题用14px。
1.使用大厂开放的图表库
图表库的图表类型丰富且统一，而且大大节省了开发时间，比如百度的Echart和阿里的G2。
2.在专业数据分析网站获取灵感
笔者刚开始学习数据可视化就是拿着数据表格不停地在竞品上摸索，作为一名用户去感受这些图表的交互体验。这里推荐一份数据可视化网站名单。
1.先懂数据，再谈可视化
为此我们要了解图表类型的适用场景和局限，可以看33种经典图表类型总结，轻松玩转数据可视化。了解这些可以帮助大家通过UI设计更好地展现图表的特点。比如展示各地区的人口密度，可以用柱状图来展示，但是我们发现用地图会更加接近用户的期望。
2.为了数据，过度可视化
很多时候设计师在图表上很难展现自己的设计功力，从而会给图表增加过多的视觉效果，比如3D效果。
3.真实数据，友好可视化
数据产品不要试图去掩盖问题，而要反映真实数据，暴露问题，并且和用户一同解决。比如对数据阈值进行监测，预警线就是很友好的可视化方式。
转自：简书
作者：idatadesign
链接：https://www.jianshu.com/p/816f10b7d594
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
现如今无论是工作汇报，产品设计，后台设计甚至是数据大屏，越来越多的设计师需要和数据打交道。尤其是想要做B端的设计师，数据可视化更是必不可少的一个技能。数据可视化，可谓是越来越体现一个设计师的专业能力。
因此掌握数据可视化能力，是面向未来的设计师所必备的能力。然而尴尬的是，国内没有一款针对于教学数据可视化的全套解决方案，这让很多渴望学习的设计师摸不着头脑。所以这也促使我开启了这个系列――「设计师需要了解的数据可视化」，希望能够给大家带来一些不一样的内容，为大家梳理一个完整的数据可视化框架。
今天带来的就是这个系列的第一篇，数据可视化的概念以及数据可视化设计的基本准则。最近一直在做国际外包，时间非常的零散，而写逻辑性强的文章又非常耗费精力。所以从开题到现在，用了将近2个月的时间才将这篇文章彻底收尾。全文总计25000字左右，阅读需要20分钟左右，干货满满，请大家做好准备。（如果没有时间，我之后我也会将该内容录成音频，如果有兴趣，可以持续关注我）
什么是数据可视化
数据可视化就是借助视觉的表达方式（不局限于文字），将枯燥的，专业的，不直观的数据内容，有趣的、浅显的、直观的传达给观众的一种手段。
非设计师在制作数据可视化时，往往会因为重点突出数据的重要性，而让可视化图表变得枯燥乏味。而设计师在制作数据可视化时，又会因为过度注重绚丽多彩而让数据的呈现效果大打折扣。所以在这种大环境下，催生出了数据可视化行业。作为设计师，如何拥抱这个新兴的行业，如何把握设计与功能之间的平衡，从而更好的沟通与传达信息，即是本文的重点。
信息图表，就是数据可视化后产生的结果，就是我们在工作汇报中，项目介绍中，以及后台系统中经常见到的数据图表。信息图形由信息和图形两个词语组成，它被称之为「信息图形」(Infographics或Information Graphics)。
信息图形最初是在旧的纸质媒体上刊登的，更加有助于人们理解新闻信息的可视化内容。
信息图表的分类
根据木村博之的定义，从视觉表现形式的角度，将「信息图表」的呈现方式分为六大类：图解(Diagram)、图表(Chart)、表格(Table)、统计图(Graph)、地图(Map)、图形符号(Pictogram)。
1. 图解—主要运用插图对事物进行说明
文字有时候是一种匮乏的信息传递方式，而可视化的方式，则是人类最本源的一种信息传递方式，图解就是将很多无法准确或用语言传达的内容，以生动形象的图形解释出来。下图是一张经典的对于咖啡种类图解，38种咖啡配方，不必要用多余的文字解释，直接用图解表示，简单明了，清晰易懂。
2. 图表—运用图形、线条及插图等，阐述事物的相关关系
图表通常用于简化人们对于大量数据之间的关系的理解。人们通常理解图表会比理解数据要快很多。图表和图解唯一的不同点在于，图解是用可视化的方式去传递信息，而图表则是用来去阐述信息之间的逻辑关系。流程图就是典型的图表。
下图是一张宠物狗的进化图，用巧妙的方式清晰地向我们传递了，狼是如何被人类驯化成不同种类的宠物狗的。
3. 表格—根据特定信息标准进行区分，设置纵轴和横轴
表格是按照行和列或者采用更复杂的结构排列的数据，表格广泛应用于通信、研究和数据分析。其实表格并没有一个确定的定义，它会因为不同的行业和谈论环境而存在差异.
4. 统计图—通过数值来表现变化趋势或者进行比较
统计图是根据统计数字，用 几何图形 、事物形象和地图等绘制的各种图形。它具有 直观 、 形象 、 生动 、 具体 等特点。统计图可以使复杂的统计数字简单化、通俗化、形象化，使人一目了然，便于理解和比较。因此，统计图在统计 资料整理 与分析中占有重要地位，并得到广泛应用。
下图是大城市通勤的时长统计，通过这些柱状图，我们能很清晰的看出各个级别的城市通勤时长的比例关系，并了解他们的拥堵时长和非拥堵时长分别是怎样的情况。
5. 地图—描述在特定区域和空间里的位置关系
将真实的世界转换为平面，在此过程中必然要讲一些东西略去。实际上，要说「省略」是地图上最关键的词也不为过，无论是哪种信息地图，最重要的是让用户找到想要看到的信息。
信息地图也可分为两大类：
第一类，将整个区域的布局或结构完整呈现的地图。
第二类，将特定对象突出显示的地图。
以下是美国各州拥有枪支人数占总人数的百分比统计图。
6. 图形符号—不使用文字，直接用图画传达信息
所谓图形符号（也就是我们常说的icon），基本就是通过易于理解、与人直觉相符的图形传达信息的一种形式。生活中处处存在图形符号，包括地铁站出入口上的地铁标识，路边的指示牌与限速标识。人们会约定俗成的运用一些符号来代表一些固定的意思，比如厕所门口的男女标识，很多商店为了个性化设计，使用了不常用的符号来表示男女，这会给消费者造成很大的困扰，因为这脱离了他们常见的理解范围。
图形符号的设计原则是尽可能不使用文字，其作用有两条：
避免语言不通造成的困扰。
更便捷的、更清晰的传递信息。
多年来，最经典的图形符号应用案例可以说是奥运会和残奥会的运动图标了。图形符号可以说已经成为奥运会和残奥会的重要组成部分，就像火炬传递和运动会LOGO一样，从赛事门票到奥运村的品牌，图形符号都在被广泛使用。
下图即为东京奥运会的运动图形符号（局部）
达到数据可视化目标的基本方法
目前我们工作中经常遇到的数据可视化，大多数是制作数据图表（即统计图 Graph），所以我们本文的主要教学内容也是围绕着如何制作统计图来说。
制作统计图的过程可以被四个步骤，分别是：明确目的、选择图表、视觉设计、突出信息。
明确目的：明确数据可视化的目标，通过数据可视化我们要解决什么样的问题，需要探索什么内容或陈述什么事实，并选择合适的图表。
选择图表：围绕目标找到能提供信息的指标或者数据，选择合适的图形去展示需要可视化的数据。
视觉设计：以可视化的手段将数据转化成有趣的设计语言。
突出信息：根据可视化展示目标，将重要信息添加辅助线或更改颜色等手段，进行信息的凸显，将用户的注意力引向关键信息，帮助用户理解数据意义。
1. 明确目的
大多数情况，明确图表本身要达到的目的，比制作好图表本身更加重要。如果对数据认识不清，就会造成2种结果：
无法拟定合适的图表标题，从而使读者失去阅读图表的兴趣。
无法选择出正确的可视化方式，从而使图表难以理解。
知识点 01：好的图表标题 ―― 等于成功的一半
大多数图表都需要一个好的标题，这样才能让面试官知道他们在看什么。
标题应该是一个结论，是你希望面试官从中获得的信息（有意义并且有趣的部分），而不仅仅是对图表展示内容的概括（即无意义且无趣的部分）。
2. 选择图表
Andrew Abela 根据统计图的主要功能，将所有的统计图分为了四大类：比较、联系、分布、构成。在其资料的基础上，我制作了一套更适合设计师的「图表选择器」（The Way of Data Visualization）。
所以作为新手的我们，只要能熟练掌握这六种图表，即可应付大部分的使用场景，而对于我们这种更专业的人士来说，上述的「图表选择器」能够大大提高我们的工作效率。
3. 视觉设计
接下来也是数据可视化中最重要的一步，视觉设计。很多时候我们在设计图表时没有既定的规则，全凭借在平面设计和UI设计中获得的知识来进行设计。但之所以数据可视化被单独细化成一个类别，并在国外蓬勃发展，甚至衍生出了专业的数据可视化设计师，就证明在数据可视化领域，很多规则是与其他设计不同的。
一个最简单的例子，市面上大多数的配色方案都在数据可视化领域不适用。
毫无包容性的配色方案
首先，适用于数据可视化的配色方案，一定在明度上是有变化的。很多配色方案不仅不具备这种特性，甚至不会考虑包容性。UI设计的配色方案看起来都很绚丽多彩，但是很明显，他们是为了用户界面而设计的。色盲人士往往很难去阅读那些运用了低包容性配色方案的可视化图表。
没有足够多的颜色种类
另一个问题就是，大多数配色方案并没有足够多的颜色种类。
在构建一套完整的可视化图表时，我们往往至少需要6种颜色的调色板来进行设计，我们见过的大多数配色方案并不具有这么多种颜色。
虽然这些配色方案同样绚丽多彩，但是他们不能灵活应对图表中复杂的信息层级。
难以区分层级的配色方案
渐变配色方案可以轻松解决上述两个问题（颜色之间有明显的对比，且可以无限细分颜色种类）。但很抱歉，这样的配色方案同样不适用数据可视化，我们举一些简单的例子大家就可以明白。
这些渐变色看起来没什么问题，但是当我们选择其中一个，将其颜色分类扩充到10时，问题就出现了。
你能区分出最左边的4个颜色之间有什么差别吗？恐怕很难。
前面的阐述，大多数是为了让大家对数据可视化有一个清晰的概念。在「视觉设计」这一章我将重点讲解，数据可视化（即图表制作时）需要注意的设计准则。下面的内容主要解决大家在数据可视化中所遇到的三个问题。
如何制作数据可视化图表？
如何快速的制作数据可视化图表？
如何制作一份兼具实用性和美观性的数据可视化图表？
适用于所有图表的制作规则
1. 图表中的线条
有无刻度线
当数据的数值非常重要时，一定要使用刻度线来让观众更清晰的了解数据。
如果你的听众只需要了解A数据大于B数据，那么刻度线是没有必要的，只需在坐标轴上使用小刻度即可。如果你的读者要花一些时间在柱状图上并感兴趣A数据是45.65而B数据是37.66，那么使用刻度线将有助于他们理解。
刻度线的颜色
如果确定要使用刻度线，则需要使它们比作为实际数据的点或者线条要层级低。因为这些刻度线也属于背景的一部分。
总结来说，不要使用全黑或者全白的线条。如果你的背景颜色是白色或者浅色系，那么你应该让你的线条灰一些。你也同样可以让这些线条变成亮灰色，点状或者虚线.
负空间的刻度线网格
你也可以使用灰色的背景，然后将刻度线反白。这是一种很好的利用负空间做设计的方法。或者刻度线可以用稍微偏黑色一点的灰色，因为很明显这样会让刻度线更融入背景一些。
坐标线
坐标线应该比刻度线，线条更粗，颜色更深，才能让整个图表显得更有主次的区分。
2. 选择合适的坐标上下限
选择合适的坐标下限
一般来讲，我们应该把我们的坐标下限设置为0。
有人会问，这样的话我们的数据就会变得没有那么起伏变化了。那可能是因为你的数据本身就没有那么长势喜人。
但同样，其实很多事情可以反过来思考，之所以有人愿意不把坐标轴设定为0为起点，其实就是为了在视觉上让人形成对比强烈的感觉，从而突出业绩。这种方法的使用因人而异。
比如在小米的发布会中，为了对比，小米把数据的下限起点设置为了10000，从而使小米的跑分数据看似跑赢了友商一倍还多，但其实小米的数据增长，只比友商高出了25%。
再举个例子：这张条形图也是经福克斯新闻准许使用的。
3月31日目标的值为7,066,000，比6,000,000高17.8%，然而第二个柱形几乎是第一个柱形长度的三倍。
这也同时提醒我们要注意，在观看别人的图表时，仅仅观看柱状图的高低趋势往往不能得出正确结论，需要注意坐标轴起始位置有没有被人做过虚假处理。
同样的，有些人为了汇报业绩，也会使每个刻度的跨度不一致，从而提高柱状图整体的对比度。这种情况也应该多留心观察，不要被表面的内容所迷惑。
选择合适的坐标上限
坐标轴中另一个需要注意的点即为坐标上限。上限界定的方式有两种，可根据需求自行判断。
如果只是为了比较各个数据的数值，可以用数据的最大值作为坐标轴上限。
如果是需要将数据与某个最大值比较，则用此最大值作为上限.
3. 刻度值
虽然Y轴的刻度值标签通常放置在刻度线的最左边，但我们也可以把它们放置在其他的地方，比如刻度线的顶部。（但此时一定要把握好亲密性原则，稍不注意就会引起观众的困惑，这也是我们经常会在看其他图表时遇到的问题，到底刻度值标记的是哪一条刻度线？）
刻度线和刻度值相辅相成，这会让图表看起来更加规范。刻度值放置在哪里无所谓好坏，只是需要根据不同的场合加以使用。
间隔均匀
在坐标轴上应该使用均匀的跨度0,5,10,15,20，而非不均匀的跨度0,3,5,16,50。这里即呼应上方「坐标轴下限」中的最后一点，有时图表制作人也会用不均匀的刻度来蒙骗我们对数据产生误解。
当然，此处的举例只是夸大了错误的效果，现实生活中的不均匀刻度往往更加隐蔽，需要我们仔细去甄别。
不要使用非水平和竖直的文字标注，也不要使用转行
有时坐标轴上的注释文字会很多，所以很多人为了妥协，在小空间内显示出所有的文字标注内容，而使用倾斜的文本，或者将文本转行处理。
不要用过于复杂的设计形式，数据可视化的第一要义是简单易懂，所以在遇到标签文字过长时，可以采用以下方法进行解决。
4. 数据的处理与排序
我们在每次制作前都对数据进行排序，而不是随机排布。这样我们可以在图表中为观众展示更多信息，即某个数据在总的数据库里面的序列。
大小排序
我们还是从一系列国家的数据开始。
目前的排布很随机，或者是按照字母表排序的。接下来我们要按照数值从大到小进行排列。
我们随机挑选一组数据，比如玻利维亚(Bolivia)，再上图中，我们只能得到玻利维亚的数据值，以及他大概在数据库中排在中游的位置，仅此而已。但是下图中，根据大小排列好的数据，我们不仅可以获得刚才的两个信息，同时还能马上知道玻利维亚在整个图表中的排名（第四名）。同时你还可以看到吉尔吉斯斯坦（Krygyzstan）和越南(Vietnam)居于榜首而美国(America)是倒数第一，这就是好的图表能给我们带来的「更多的信息」。
我们再看一遍按照字母表排序的图表，你能轻易的输说出「冈比亚(Gambia)」排名第几吗？
刻意的序列
在发布会中我们常常见到，为了突出自己产品的强悍，往往要与友商的数据做对比，在这种情况下，我们的数据也不是随机排布的，我给这种数据排布方法起了个名字，叫「刻意的序列」。
在 魅族 16th 的发布会中，这张旗舰机重量对比的图表很有讲究，可以发现，除了索尼（最重的手机）以及 魅族 16th（最轻的手机）外，其余所有的手机都是按照降序排列。不看颜色对比，把 236g 的索尼和 152g 的魅族放置在一起进行讲解，以更加突出魅族的轻薄。
那么这个图表的数据排序其实经过了三次处理。
把重量从高到低排序。
把重量最高的和的手机单独放置，并给予特殊颜色单独显示。
把这两个数据放置在最后，再次突出对比，吸引观众注意。
这就是我们学习数据可视化时非常需要注意的细节点，在数据可视化中，细节决定成败。
5. 关于图例的设计
数字需要四舍五入
我们有时为了保证图表的清晰整洁，并不能完全选择符合数据上限和下限的数字作为刻度，而是选择一些取整的数字。
同样的，这不仅仅适用于图例中的数字，同样适用于坐标轴上下限的数字。
标记图例的边界比标记图例的范围更好
在需要用多种颜色做区分的图表中，有时可以通过标记图例边界而不是标记图例范围的方式，来提高观众的阅读效率。
水平或者垂直方向的图例
对于数字的刻度，水平图例往往比垂直图例更加容易阅读，因为这符合我们的阅读习惯。
但是，对于有类别区分的图例来说，垂直图例往往效果更好，因为我们可以在图例的右边放置更长的文本（跟坐标轴的注释同样的道理）
删除内部边界
有时我们甚至可以更简约的表示图例，当你只想表达一个渐进的过程，24和55之间的差异并不重要，观众只需要知道后者比前者大即可。在这种情况下，我们可以尝试只标记出图例的最大值和最小值，而不必要标记出每个边界或者颜色，这样可以给观众减少不必要的信息负担。
6. 图表上的文字信息
文字标注的作用，不是来填充空白的，而是用来强调相关信息或拓展额外的背景知识的。
引用消息来源
大多数情况下，我们制作的图表都不会将原数据附在旁边，因此最好在图表中引用你的数据来源。一般来说，引用规则是在左下角防止数据来源信息，往往采用特殊字体
用数字辅助表达
有时你需要在你的图表中标注出数据值，而不仅仅应该依赖视觉元素向观众传达信息。
通常来说，不需要太严谨的图表，我们会对数据值进行一定程度的处理。
有小数的值四舍五入。(234.19 ―― 234)
在数据的量级非常大时，将一定位数数字取整。（52,133 ―― 52,000)
当所有数据的量级都非常大时，将一定位数的数字缩进单位中。（521,000,000 元 ―― 5.21 亿元）
Y轴刻度值尽量转化为千位分隔符，如K，M，B。
Y轴最大值取值要恰当，保证图表占据2/3以上。
如果我们不这样处理，你就会发现你的图表总是不那么整洁。
7. 控制字体的数量
图表中的字体数量以及字体大小的种类加起来不要超过3种（标题和副标题除外）。通常来说，我们在制作时会把注释和坐标轴标签设置为两种字体样式，所以只需要确保将这两者统一起来，那么就可以保证我们的图表不超过3种字体样式。
柱状图的制作规范
1. 柱状过宽或过窄
过宽的柱会让图表看起来笨重，尽量保持柱的轻薄，这样可以保持优雅的外观，但是太薄了会让用户很难对数据进行比较。
标准的数值为，柱的宽度为「柱与柱间距」的2倍，当然这只是个参考值，实际我们根据不同的情况，对宽度作出调整。
2. 尽量不要超过7个值
一般进行数据比较时，柱状图建议不要超过5个数据值，对于条形图来说，建议不要超过7个数据值。
折线图的制作规范
1. 有层次区分的折线/曲线
当我们在制作一个复杂的折线图时，我们想要显示其中的一条数据，最好的方法就是加强它与其他元素的对比，从而提高它的重要性层级。
利用我们之前的方法，把其他的数据变为灰色。
将我们需要强调的曲线置于顶层。
2. 什么时候是用折线图
2017年1月和2月的大米出口量是相关的，他们代表一种数据在不同时间下的数据值，因此我们可以用折线图将它们连接起来。但是2017年1月的大米出口量和玉米出口量（16万吨）是不相关的，所以我们不能随便用折线图来代替柱状图。
用折线图可以很好的表示每天去医院的人数，因为统计每天去医院的人数可以用来观察趋势。
3. 按照时间推进的数据并不能总是用折线图来表示
有时我们也需要进行一些区分。如果我们想要绘制美国大规模枪击事件的伤亡人数随时间推移的图表。这些枪击事件确实是一个接一个发生的，但是它们本质上却没有关系，所以你不能用折线图（应该用条形图）。
但是，如果按年份对它们进行归类，并计算每年的伤亡人数。这样的情况下可以使用折线图进行统计，因为统计结果的趋势变化是有意义的，是可以得出相应的结论的。
4. 使锯齿状的线条平滑
如果你的折线上下浮动过于剧烈，那么你应该尝试拉长时间间隔，比如不每天采样而以周为单位来采样。观众们不会去阅读锯齿状的线条，或者说他们不会喜欢这样的图表。
5. 在你的折线图中绘制数据点
当有些特定的数值特别重要时，我们可以在线条上标注出他们，如果你有大量的数据需要展示，或者你只想展示数据的走势，那么其实你只需要使用折线就足够了，不需要增加数据点。不信你可以试试，大量的数据点 = 混乱不堪的界面。
饼图的制作规范
饼图和圆环图在数据可视化方面生病狼藉，但却是使用的最频繁的图表之一。饼图是一种应该避免使用的图表，因为肉眼对面积大小不敏感，并且几乎没有对与角度大小的概念。更何况是肉眼完全无法重合比较的图形。
例如上面左图，我们很难去比较每日从肉类（Meat）中摄入的卡路里与从糖类（Sugar&Fat）中摄入的卡路里数量的比例。人眼的直觉中，糖类与肉类的比例应该在2：1左右，但实际的比例却是1.5：1。
上述右图将这一现象放大的更加明显。人眼的直觉中，办公与接待的数值差距非常大（这是由于我们直觉更习惯从面积上做判断），但实际上接待与办公的比例为1.5：1。
很多设计师认为饼图应该是被禁止使用的图表，我觉得不能说的太绝对，不管怎样，迄今为止事实情况是，仍然有很多人在使用饼图，所以我们至少可以争取正确的使用他们。
虽然如此，但是在强调个体与总体的比例关系方面，饼图还是有其独特的优势。
1. 避免过度分割饼图，否则最终会导致根本无法阅读
那么有同学会问：分割多少块是过度分割？这是一个需要在实际制作时进行判断的问题。一个简单的方法，如果我们已经很难从图中看出其中一块扇形是另一块的两倍大了，或者好几块较小的扇形看起来差不多大时，那么就不能再分割了。此时可以考虑把较小的类目归入一个更大的：「其他」模块。
如果一定要给出一个确切的分类数目，我认为一般不要超过9个，超过的话，建议用条形图来展示，不要太依赖于饼图。
例：这张饼图来自维基百科，它展示了国家的不同区域。
左边这张饼图已经分割出了无数个扇形了，但旁边另分离出一张饼图，显示出了左图中更多的，看不到的更小国家的情况，以此来提供更多的信息。其实还有很多的方法可以展示这组数据，例如树状图或者普通的地图。局限较大的饼图只适用于展示只有几组值的数据。
除饼图外，环形图（甜甜圈图）亦可表示占比，其差异是将饼图的中间区域挖空，在空心区域显示文本信息，比如标题，优势是其「空间利用率更高」。
2. 饼图的起始位置要得当
人们的阅读习惯往往是从12点钟开始的（跟表盘类似）。所以我们在制作饼图时也要遵循观众的阅读习惯，从12点钟方向开始制作，这样才能呈现出更加清晰的数据。
3. 饼图的顺序要得当
这个规则与其他的数据图表一致，我们在拿到数据后，不要急于去进行数据可视化，而是应该对数据进行排序处理，一般来讲，我们对于图表都要进行从大到小的数据排序，才更有利于我们展示数据，但是有一个例外的情况。
当数据中包含一个类别叫「其他」时，无论其他的内容占比为多少，我们最好都把他放置在饼图的最后来展示。
4. 切割的展示方式
有时，我们可以想一些创意形式来解决饼图对比不够明显的问题。
当我们将饼图分拆开来设计时，将他们设置为同一起点，我们可以清晰的对比出数据的大小，但严格意义上来讲这已经不算是饼图了。
散点图的制作范围
1. 散点图可以承载最多四个维度的变量
当包含多重变量时，散点图本身包含2个维度的数据，当出现更多维度时，我们可以通过改变散点的颜色和大小甚至是形状来对数据进行更多维度的划分，这个时候，散点图即变成了气泡图。
2. 尽量为散点图添加趋势线
通过添加趋势线，可以更好的让观众感受数据的变化，人们不会愿意接受未处理的数据，往往倾向于接受已经被处理好的数据结果。
面积图的制作规范
面积图又叫区域图，与折线图很相近，都可以用来展示随着连续时间的推移数据的变化趋势。区别在于，面积图在折线与类别数据的水平轴（X轴）之间填充颜色或者纹理，形成一个面表示数据体积。相对于折线而言，被填充的区域可以更好的引起人们对总值趋势的注意，所以面积图主要用于传达趋势的大小，而不是确切的单个数据值。面积图有三种不同的形态，根据数据以及背景的不同，均有其最佳的展示环境。
1. 尽量不重叠，使用透明色
当图表中要展示多组数据时，最好保证所有的数据都不重叠，这样才可以更好的展示数据。如果无法避免重叠，则应该适当的设置颜色和透明度，使得重叠的区域变得更加易读。
2. 不要超过四个类别
面积图只适合展现少量的数据，最多建议不要超过四个类别，否则就会导致非常难以识别。因此在多个类别下，要尽量避免使用面积图。
突出信息
1. 重要的内容用颜色区分
有时我们为了突出展现某部分数据，需要对它们进行特殊的处理（包括添加辅助线，更改颜色，线条粗细等方法）来加大它们与其他数据的对比，以吸引用户注意，并表明你想陈述的观点。
如上左图，通过添加辅助线和标红的方式，来显示快递公司未达到60万件派件标准的月份，从而突出显示公司业绩不合格部分。如上右图，通过对9月份的颜色区分，来突出显示二手房价格在9月份达到前所未有的高度。
2. 把不重要的内容变为灰色
对于不太重要的内容，我们通常会把它们的层级降低，将其变为灰色往往是一个好方法。（如上左图中1-6月与9月数据的配色，以及上右图中1-8月数据的配色）
通常来说，我们会用灰色来标记：
未被选中的元素或者背景。
为重要的数据点做对比的数据。
（在交互图表中）不是当前选中的元素。
3. 没有那么多重点信息
如果你觉得每个信息点都很重要，然后为他们都做了特殊的备注，那么请把他们都去掉，因为那恰恰证明他们都不重要。
数据可视化的精髓就在于你去用视觉元素去帮助用户做筛选，如果观众们真的很想知道每个数据代表什么，那或许你应该给他们展现一份表格而不是图表。
4. 添加必要的辅助说明
关于这个图表，如果我们不进行标注的话，它只能讲述故事的一部分。如果要把故事讲述的全面，那么就必须添加一些标注。
如果我告诉你，这个图表想告诉我们，在第6天的时候该团队使用了敏捷开发，在使用新技术初期，Bug数量明显上升，而后瞬间下降。加上了标注，图表讲述了一个跟之前完全不一样的故事。
所以，我们为了更好的说明我们的目的，有时需要对图表进行特殊处理，包括做一些突出某些信息的标注。
5. 添加必要的辅助线
这一点主要针对于柱状图和折线图，比如当我们想要呈现两个不同时期的数据变化时，添加辅助线可以更直观地体现出其中的变化。
比如像这个图表，为了体现出响应速度有很大的提升，，添加了相关辅助线并标注了相应的数字，使 PRO5 和 SONY Z3+ 之间的对比更加明显.
转自：简书
作者：极创设计
链接：https://www.jianshu.com/p/a8996c452c2d
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
很多时候，当你的设计遇到了挑战，你无法客观地回答为什么，甚至在和业务方沟通的过程中表现得很被动。
通常根据人们的习惯，我们将核心行动操作都放置在右侧，例如下图核心的行为召唤按钮都放置在右侧，那为什么都要放在右侧呢？
我们可以用古腾堡图表来解释一下。古腾堡——西方活字印刷术的发明人，顺便看一下他发明的图表，啥意思呢？就是当我们在浏览一个不熟悉页面的时候，我们通常浏览的路径是一个对称的，从左上到右下的一个路径，最终的视觉落点通常就会在这条线上。
所以我们很多的信息和操作按钮，都是在右侧。然而我们发现有些对话框却把行动按钮放在左侧，我们来分析一下原因，像下方的对话框：
左侧的是我们常规看到的一个模态弹框，弹框内右侧的行动按钮可以是确定，也是可以删除，但是右侧的弹框基于我们的猜测是希望用户在高风险操作下，再次确认要进行的操作，所以当用户视线移动到右边的行动按钮时发现它并不是想要的操作，这时用户会对左侧信息进行一次再浏览，确认后再选择，很多时候用户在进行操作的时候会下意识地进行右侧点击，所以这样的处理方法可以避免用户对高风险行为的误操作。
但是话又说回来，这样的设计其实违背了用户的习惯和预期，所以还是要慎重考虑。
我们再来看一下高德地图的案例， 点击「退出」后展开两个选项，「退出导航」在左侧高亮，取消放在了右侧。
那这算不算违反用户的习惯和预期呢？我们换一种解释，这里运用到的是「菲兹定律」，目标按钮的大小、和手指间的距离影响用户操作的效率
如果退出导航放在右侧可以吗？在别的场景下没问题，但是在行车驾驶的场景中，任何的操作都需要快速。可以再想一下场景，什么时候会退出导航：1.目的地已到 2.开到一半认识路了 3.导错目的地了 4.要换交通工具了…..所以高德作为一个工具型产品，是一个核心的准则。
菲兹定律深入解读：
现在随着大数据和人工智能的科技进步，人们日常生活也变得越来越便利，或者说人也变得越来越懒。我们不用再费尽心机寻找我们想要的，所有的内容都会跟我们的习惯、行为被智能推送，产品也越来越人性化。所以我们今天的十万个为什么就来聊一聊个性化设计！
1. 内容个性化
个性化内容需要通过发现偏好-帮助过滤-使用 3 个步骤来看。首先内容个性化可以分为用户偏好个性化以及用户设置个性化，比如抖音、淘宝等应用，会根据用户对内容的搜索、浏览等行为习惯的偏好进行不同的算法推送，比如抖音我最近看鉴宝和篮球比较多，所以针对这些视频，我的完播率、播放数、点赞评论数据有变化之后，推送给我视频内容的权重就发生了变化。
其实很多用户不太理解，在电商应用，我已经购买过一件商品后，却依然还是给我推送同样类型的商品。
而用户设置个性化比如在使用 bilibili、漫画等应用时会在正式浏览前让用户设置自己的偏好和基础信息帮助用户进行更精准的推荐。
但这里有一个问题是，我们给用户设置的选项和用户实际本身不符，比如让用户选择他的年龄，很多用户可能觉得自己会更年轻，所以选择年龄和实际不符，那么推送的内容是他需要的吗？所以这里就需要根据用户真实行为数据来进行再次的过滤。
但是如果我们就这样把用户所选的内容都推送给他，那效率一定很低下，所以我们会从时间、热度和用户自身行为权重进行排序计算，当然这些内容也并不是都用 feed 流来承载，形式可以多样化，也包括进行分类，就像微信阅读会推荐 3 本书，你也可以选择点击换一换，甚至还把推荐来源给写出来了。
2. 场景个性化
最近看到两个不同的界面，实属有趣。某天我下了地铁用支付宝扫码出站后，页面提示我是否要进行打车，我觉得还是挺贴心的，虽然我不需要打车但是这个场景让我有了更加方便的选择。
同时发现在群里有另一个小伙伴也截了这个页面，他的界面却是提醒他是否要租一辆共享单车！这简直是赤裸裸的「歧视」呀。当然这个也就是和下面要讲的用户行为有关了，如果你经常骑车，他就会在这里给你推荐共享单车。
还比如高德地图在导航的时候如果即将进入收费站，在页面明显的位置也会出现支付宝入口的图标。（图片找不到了）
3. 行为个性化
这个应该正确的说是行为导致的功能个性化，比如知乎，从之前的上下切换话题到左右切换，再演变成上下切换话题。大家用过知乎的同学知道，现在上下切换话题其实还是有些不方便的，但是知乎为了让更多金主爸爸的广告能露出，不得已出此「下策」。
我们在设计的过程中也有一个原则「避免功能即按钮」的设计，在业务的背景下也被选择性忽略，所以他做了一个悬浮可动的切换按钮，其实在可动之前，他是固定的，是由于用户频繁误操作的行为，让知乎的设计师将它变成了可动吸附的按钮了。这个就是行为导致的功能个性化。
再比如腾讯视频、爱奇艺里的「只看 TA」这个功能。通过数据和用户行为路径的分析，发现很多用户会在一个视频里频繁观看某一个演员的片段，可能是自己喜欢的演员，可能是被其他平台吸引过来看某个片段的用户，这样大量的行为让我们发现用户的这个高频需求。
4. 目标个性化
最近也在体验了一款游戏，完美世界的笑傲江湖。其实现在很多的手游都会有这样的功能，就是会让用户选择如何体验游戏，由于玩游戏用户时间、职业的不同，所需要体验游戏的内容也是有区别的。
时间多的用户更想要体验所有内容，快速提高战力。而女性用户可能更想边看风景边玩，看唯美的画面。如果是时间少的上班族，那么更希望能做一些性价比高的任务，不至于脱离大部队的节奏。所以当用户有不同目标时，产品也有相应的策略让用户更好地体验产品。
很多设计师在进行信息设计的时候，通常靠着感觉和曾经尝试过的经验进行信息美化。但是当我们遇到需要对信息设计进行解释的时候，理由通常很苍白。
你无法说出为什么用户能够快速地浏览信息，只是觉得又大、又粗、又鲜艳的信息能够被识别。所以今天我们就要来聊一聊，为什么。
首先给大家介绍一些经过研究之后的数据结论：
人类视野的空间分辨率从中央向边缘减少。我们人类每只眼睛具有 700 万左右的视锥细胞，它们在人眼中的分布是越靠近中央凹的区域越密集。而另外一个研究表明，边界视觉的信息在被传递到大脑之前是经过压缩的，而中央凹的视觉则不会。大概就是下 2 图这个意思。
然后有同学会问，既然我们的边界视觉那么差，当用户在浏览界面信息的时候，为什么给用户 3 秒钟时间看界面他还是能够记住页面中的一些信息呢，或者会说为什么我们在浏览的时候，它不像下图那样只有一小圈是高清，而边上的文字是模糊的呢。
这其实是因为大脑通过一个比较粗犷的方式，基于我们的预期，给视野进行填充，大脑也会命令你的眼睛对边上的信息进行细节采样。所以这是一个很快速的过程。
为什么有的人能够一目十行就是，他的大脑能帮他补充得更多，或者说他的中央凹面积大。
但是有一个实验是，我们通过眼动测试，当用户的中央凹停留在一篇文章中的一个地方时，这个文字显示的是正确的，但是随着中央凹的移动，他周围的文字会进行随机的变化，他虽然能够成功地完成阅读，但是速度大幅下降。
比如大家看一下这个页面的区域：
当我们扫完这个页面也就 2-3 秒，但是如果你没有把中央凹停留在一个信息上的时候，其实都是靠大脑对我们的预期进行的补充。而真实的情况是，你们并没有发现页面中错误的地方。
言归正传，为什么你的信息用户总是看不见呢。我们又要讲到边界视觉。我们的设计如果不考虑边界视觉，那么就会影响到能够被识别的信息。那么边界视觉到底有什么用呢？
1. 引导中央凹
我们刚才说了中央凹的重要性，那么我们在什么时候会把中央凹放到我们要看的信息上呢？其实就是依靠我们的边界视觉。
边界视觉引导中央凹，它帮助中央凹捕捉关键信息。我举个例子，大家在查看一个食品包装的生产日期的时候是怎么寻找的呢，大家的眼睛不断地在搜索，而边界视觉是提供了低分辨率的线索，帮助大脑，控制眼睛以线索的发现顺序进行移动。
2. 捕捉运动元素
边界视觉可以非常快速的捕捉到运动的物体，所以在界面设计中，无法放置在核心位置的元素但又需要用户去注意到的时候，通常就会使用动效。
1. 将信息尽量放在中央凹或者中央凹边上能够被预期的位置
在小红书很早的一个版本中，当用户进行点赞操作后，反馈消息在顶部显示，让用户无法察觉和关注到。因为边界视觉都无法捕捉。所以当用户在进行操作时，如果需要将状态、文字告知用户，就需要显示在用户能预期以及能被边界视觉捕捉到的位置。
2. 使用图标、图片的形式标记出关键信息
比如在一大段的文本中，用户无法快速的查看内容标题，我们就可以在标题前使用图标、图片的形式进行标记，让边界视觉获取到信息之后在大脑中产生预期模型。
3. 使用动态效果吸引用户注意
动态效果能够快速被捕捉，甚至引导用户的视线。比如马蜂窝在底部进行点赞后通过动效引导用户，告知用户该点赞是为用户而赞，同时让用户的视线又回到了顶部，可能增加用户的停留时间。
4. 使用高亮的颜色来吸引用户的边界视觉进行捕捉
由于边界视觉的搜索是线性的，所以我们必须将重点的信息进行高亮显示，比如警告的红色，可点击的蓝色等。
在这里再补充一个我总结出来的规律，不一定对。
大家可以看到，下方的知乎话题界面，一进入界面我们的边界视觉立马给我们进行信息捕捉，所以首先被关注到的是呈现蓝色的文字、图片、图标等。
这里大家发现一个问题没有
为什么在这个界面中上方的两个按钮不用色块的形式做呢？
例如右边这样，很多同学在这里第一反应是这个按钮太重了！很突兀！为什么很突兀？
既然要引导用户为什么不做得重一点呢？那有同学又会说这样设计会干扰用户对其他信息的浏览，那么为什么会干扰对其他信息的浏览呢？
我猜测人眼的中央凹视锥细胞会根据界面中信息的重要程度进行调整，也就是说不同程度的强化会让边界视觉的捕捉能力下降。
像右侧的色块按钮让中央凹的视觉细胞更加聚集，而导致边界视觉的范围也大幅缩小，所以你们看左边界面觉得信息优先级很清晰，但是右侧的就会觉得我只看到了两个大按钮，而其他的信息都没有被捕捉到。
那继续思考一下，什么时候能用大色块的按钮呢？很多电商平台的购物都是大按钮，这个难道不会让用户的边界视觉受影响吗？
大家发现一个规律没有，有大按钮的页面基本上图片、图标都很多，而一般都是文字的页面，通常都不会出现大按钮，因为出现了就会被喷太突兀了！！
这就是因为大按钮在没有其他更高层级信息的配合下让边界视觉捕捉范围降低了，如果都是高层级的信息，那么边界视觉的捕捉范围就会「一视同仁」。
所以，为了让一个界面的按钮不突兀，一种方法是用和它相似级别的元素进行辅助展示，另一种方法就是降低该按钮的视觉引导层级。
不知道大家是否曾经或者现在使用过某个产品，当我们在完成某一个任务或者在某个场景中时，自己的操作行为特别自然流畅，注意力也非常集中，这种感觉让你非常的愉悦、舒适。
所以契克森米哈提出了心流的概念：个体完全投入某种活动的整体感觉，当个体处于心流体验的过程中，会对周边干扰视而不见，过程非常愉快且会觉得时间过得很快。
所以当我们在做交互设计时，我们追求的就是一种自然、能让用户进入心流的交互体验。但是大家不要误会了心流的概念，有些同学觉得我们在刷抖音、微博、微信就是一种心流的状态，那就错了。
心流并不是一种简单的沉浸的状态，当我们在娱乐时不过是被内容吸引了，让你觉得沉浸只不过是你的行为操作形成了习惯，不是心流状态。
今天我就来和大家分享一下如何通过一些方法，作出让用户进入心流状态的设计，这些都是有迹可循的。
开过车的同学都知道，左侧刹车右侧油门，档在右手边，在国内所有车都是这样，所以我们不会搞错。在经过一段时间的驾驶后我们更能够清楚的了解汽车的动力、刹车等性能，所以我们会觉得这辆车的操控感觉很好。原因是他的设计符合了用户的预期。直觉的预期、位置的预期、功能的预期以及结果的预期。举个例子，当我给你一个任务，希望你能够快速的进入 xxapp 进行个人头像的设置，在这个前提条件下我们来看一下刚才说的几个预期：
直觉预期
每个人的直觉都不同，这来源于他生活中的环境影响和习惯影响所以对于我个人的直觉来说，要完成这个任务首先必须找到最初的入口，我的直觉告诉我这个功能大概率可能出现的位置会在底部标签中的个人中心板块中。
位置预期
个人中心板块的位置可能会根据信息架构而出现变动，比如抽屉导航中会出现个人中心的入口，例如滴滴。当我们进入之后会看到头像、名字、箭头等信息，特别是箭头，这个图标给人的预期是你可以继续进入进行下一步操作，那么用户对下一步操作的预期基本上就是会点击箭头或者头像，这个也是比较明确的。或者直接来一个编辑的按钮也是可行的，这样就不需要用户去猜了，但编辑的功能比较垂直了，所以到底用哪种形式，要根据内容来。
如果没有这个箭头，用户一定会产生试探性的行为操作，此时内心已经有疑惑且不自信了。所以在心流交互中，明确的功能引导非常重要。
功能预期
用户预期通过他的操作能够达成目的，那么最基本的就是在这条路径上的功能不能缺失以及减少其他的干扰。可以发现微信的个人中心最底部板块有两个热区，并不是一块直接进入个人中心的热区，如果点击名字这一整行，则会下拉引导你拍摄一段视频。所以有时候想替换头像以为点击这一块都可以进入二级，却发现这并不是我要的功能。
结果的预期
最后当用户进入编辑头像页面之后，需要关注其场景，这边微信做的就挺好：
很多时候交互流程已经做的非常自然了，但是当用户正在他的心流体验中，突然一个模态弹框跳出打断了用户，令人啼笑皆非的是这个弹窗只是告诉你一个不痛不痒的信息，这就比较难受了。
而我们来看马蜂窝当用户在 app 中完成某些特定任务后，不会出现模态弹窗的强制干扰，而是在顶部出现一个通知 bar，这样原本在进行任务中间阶段的用户不会受太大的干扰，可以继续任务行为。
再例如美团外卖和饿了么，用户在点餐时对优惠优惠的关注是特别强烈的，而是否能够让用户认真的挑选菜品，我们也尽可能做到影响的打扰，就像满减去凑单的交互形式，点击后不跳转，仅在当前页面以文字形式让用户明白并行动，但这里去凑单很容易和去结算有误操作。
例如马蜂窝自定义旅程，进行多标签选项，当用户在当前页面选择完该页面的选项后自动帮助用户定位到选择日期的功能模块中。这样减少了用户不必要的下滑操作，像这样单一场景中对用户的行为预期是比较好判断的。
之前玩过很多款手游，即便是一些常用的套路，每家都能玩的不一样，例如宝石合成、英雄装备获取，有些游戏能够做到让用户在一个场景中不脱离。
比如宝石合成这个功能。宝石从哪里来？是否能在合成合成路径中穿插购买的分支并再链接回合成场景？在包裹中进行合成和在装备界面进行合成是否流程一样；然而有些游戏当用户购买完宝石后需要重新自己再打开合成界面，非常繁琐，同时也导致了用户消费路径的断裂。
再比如装备副本获取这个功能，这里我们看一下权利的游戏这款游戏，当我一件装备的零部件不足需要进行扫荡获取，这里有两种场景，一种是我刚好只需要这 4 个件合成 1 件，另一个是我需要更多的零部件，不仅仅这一个，所以对前者来说我达成了目的就可以返回去合成界面，而后者我可能需要更多数量的零件，但不管如何我一定还是需要返回合成界面的，然而不管是哪个场景，都必须点击两下关闭按钮才能返回合成界面，所以在这个地方缺少了一个快速拉回用户状态的按钮，叫做「去合成」。
当我已经完成了我的需求后，能够让我快速的返回合成界面，因为合成装备才是我的最终目的，而不是刷更多的碎片。
下方的案例再解释一下第 3 点，当用户点击合成之后，不要提示告知用户数量不够，因为你已经显示了数量未达标，用户想点击的目的是让你告诉他未达标改怎么办，所以这里最好的处理方式就是把获取该装备的方法告诉用户。
我们希望一个产品使用起来很自然，除了操作成习惯之后流畅外，一些帮助用户潜意识的连贯的微交互也显得非常重要。不需要有华丽的动画，有时候仅仅只是一个晃动，一个速度曲线就足以合理的表达功能的语言。
文章来源：优设
您最近填写过在线表单了吗？
答案应该是肯定的。根据最近的研究，84% 的人每周至少会填写一份线上表单。
虽然你可能没有感受到，但在线填表单已经成为我们生活中不可或缺的一部分了。
其实，几乎每个把用户由 A 带向 B 的线上交互都是一个网络表单：与某个公司联系、订火车票、购物、订一晚酒店等等。
网络表单最早在 1994 年开始用于在线销售，第一个拖拽式表单 2006 年在屏幕上出现。从那时起，表单已经成为线上交互的关键。
企业和客户之间需要通过网站进行联系，小到县城的官网，大到国家政府网站，现在很难想像一个没有网络的世界。
但为什么线上表单一直备受诟病？
当然，确实没几个人喜欢填表，但大多数人绝对不会介意填写那些清晰、简洁、设计优秀的表单。
其实这也就是症结所在。太多的在线表单冗长、令人迷惑或让人感到有所冒犯（有时甚至三者同时出现）。
当表单产生让人迷惑，或提出的要求超出必要范围时，用户的放弃几率就会大大增加。 有些用户可能会放弃填写，甚至退订整个业务。无论是以上哪种情况，您都不会再有第二次机会。
在设计一个表单的时候，我们怎么保证用户能填到最后一步？
「创建一个表单很简单，难的是让人填完它。」
在帮助 420 万用户创建线上表单后，我们在 JotForm 发现了一件重要的事情，就是一些小小的改变会让整个事情大有改观。通常，这些改变都是从那些被放弃的表单中获得的灵感。
例子：
表单设计成什么样呢？应该直观、简单以及体验友好。以下是一些推荐的参考方法。
1. 欢迎填表者：标题与介绍
无论是谁，欢迎朋友的时候难道不会说「你好吗？」我们都知道礼貌的重要性，但是在线上却往往忽略了这一点。
欢迎页和标题让您有机会以一种清晰而友好的方式介绍表单和自己，而且还会留下一个良好的第一印象。
看看 BettingExpert 的数据吧：通过修改表单标题来强调「注册理由」以后，他们的注册率提高了31.54%。
标题是对下文最短最精的概括。用户一般都会跳过表单内容，而且几乎都不会仔细阅读那种特别详细的描述。所以用最少的文字说清楚一个表单的目的尤其重要。
标题可以简单理解为描述被调查者对表格的期望。尽可能保持中立：要确保应答者诚实回答，而不是去满足出题者的设想。甚至像陈述一个目标这样简单的事情，也可能会不知不觉地诱使应答者试图迎合。
而且现在也需要一份清单，说明应答者应该事先准备的外部文件，没人想中途去满屋子找纳税证明或者护照。
如果填表需要很长的时间去完成，一定要提前告知用户。不过如果是又快又简单的？让用户感到惊喜吧(但不要冒险侮辱任何人的智力，以防万一)。毕竟，他们能够通过查看进度条或字段数量来推断出这一点。
2. 放置相关的标题和副标题
一个有趣的事实：人类会在 50 毫秒内形成第一印象。重点：由于时间不够长，他们无法仔细阅读你的作品。
表单用户很可能就是快速浏览一小部分内容，忽略大部分内容。而且有很大可能是他们正在忙着其他事情，无法集中注意力或者几乎就没有什么耐心，只想要快点结束。
显然，我们无法阻止用户，所以只能通过简洁明了的标题来引导他们。标题绝对是个得力助手：可以将文本结构化、清晰化、保持用户的参与度。
用户应该可以看一眼标题就知道他们应该怎么做，而不是非得把剩下的全部看完。
测试这一点的最好方法是单独阅读标题，是否能让人看懂呢？
3. 问题之间要有分隔符
分隔符很重要。就传统表单来说，在视觉上把问题隔开以达到减少干扰的最好方法，就是使用分隔符。并不需要在视觉上做出很大的区别，区别太大反而容易分散用户注意力。
4. 多页面表单或单页表单？
这主要取决于表单有几个议题。
如果只有1，2个议题，单页表单肯定是最佳选择。但是如果一个表单有很多议题，那么就需要多页表单来呈现。想象一下：用户在面对一个似乎有成千上百议题的表单时，得有多心烦。
5. 强调「行动召唤」（CTAs，Calls-to-Actions）
成功的「行动召唤」强调的是「行动」部分：单击这个按钮，用户要执行什么操作？类似「发送」，「注册」或者「过程」之类的通用标签并不会削弱召唤机制。描述越多越好。
为了消除不确定性，试着从用户的角度回答一下这个问题「我想干什么？」举个例子，如果是某项服务的调查表单，那就应该是「我需要免费咨询」。
还需要更多证据吗？在这类研究中，Unbounce 发现只是把「开始你的试用」换成「开始我的试用」，就提高了90% 的点击率。
6. 标明表单中的区域
这并不是说要弄得花里胡哨的……
单选框、挑选区域和复选框之所以有效，是因为它们既简单又常见。表单元素的标准格式等同于更好的可用性。
单选框适用于有很多选项而只有一个可选的情况。复选框用在多项选择的情况下最好。
为了更短的认知适应过程，要尽可能地使用多选框或者单选框而不是下拉菜单。就像 Luke Wroblewski 说的：「下拉菜单应该是 UI中的最后选择。」
7. 别忘了「感谢」页面
记住用户是花时间的。所以千万不要唐突结束，要记得说谢谢。
以下是一些关于表单书写艺术的小建议。
从形式上来说，我们都更喜欢简单的语言，尤其是那些学者，天才和专家。那为什么还有那么多线上对话像是复读机一样？
「请接受来自我们最诚挚的道歉。即便如此，我们还是希望能知道您的建议。除此之外……」
像一个老学院派那样说话只会疏远用户，让他们瞠目结舌。
简单不意味愚蠢，而是等于可读性。这意味着最清晰的平白直述。每个词语都应该是最短，最直接的版本，能用「不过」就别用「尽管如此」。不用行话，不写复杂句。
你可以通过大声朗读来检查连贯性。耳朵能够听到眼睛看不到的东西，特别是在描述那些冗长复杂概念的时候。
一份表单应该就像是你和填表者之间的对话。通过用「我」，「你」，「你的」这些代词来拟人化。
主动语态的表达（比如：约翰写了一封投诉信）比被动语态（比如：一封投诉信由约翰写出）更加有力。
被动语态会更冗长，不够集中。
（译者注：以下文章中带横线的内容适用于英语语法，不感兴趣的读者可自行跳过。）
一个被动语态句子究竟有多糟？这是两点教训：
还是不确定？你可以去查一下微软 Word 可读性标准，或者普渡大学语句方法。
许多作者都会陷入这样的思维误区：用的词越多，就显得他们越聪明。其实不是这样的。在表单编写方面，或者说各种写作中，删减词语都要比添加词语更加有益。
「你删掉的每一个词，都会为你多增加一个读者。」
在仔细检查不必要的词语后，文章会更笃实，更连贯，更吸引人。
删减重点：
比起完整形态（比如 cannot，is not），语句的缩写形式（比如 can’t，isn’t）能够让文章看起来更简洁，友好和易读。
另外，还能节省文字篇幅。一份优秀的表单阅读性都不错。
What’s 优于 What is。很简单。
冗长曲折的句子容易让人难以理解。密密麻麻的文字堆也是如此。
对于大多数读者来说，每个句子最多 20 个单词，每个段落最多 3 个句子，是最合适的。把每个长句都扩成两个短句。短句实际上并不逊色。
使用空格，项目符号，表格以及打破繁琐说明的任何其他元素，都会使您的读者松一口气。
在我写博客的过程中，我（艰难地）认识到，优秀的文章是 30％ 的写作加上 70％ 的编辑。
当你完善了问题，精简了文字和内容后，把表格存储好。隔几天再回过头来看，你会发现有些之前没有发现的地方还可以再改进。
大多数用户体验的心理学原理其实都在人们的潜意识中，所以难以让人注意到。
但是每种颜色，字体，线条和按钮都有其用途。
日常的小规模设计可能不如十亿美元的营销活动那么引人注目。但小设计也需要花心思。而且，研究令人愉悦的设计背后的心理学机制很有意思，成本也不高。
以下是一些关键的心理原则，这些原则构成了设计优良的表格的坚实基础。
我们做出的每一个决定，从倒垃圾到订婚，都要经过我们头脑中的自动成本收益分析。一项任务的成本是否值得完成后的收益？
设计师的工作是确保用户在感知上收益是大于成本的。
当然，成本与收益是主观的，填表通常源于义务，而不是受访者希望从中获益的行为。除非给受访者奖励，否则无法确保收益。但是我们可以把成本降到。
降低受访者成本的一些关键策略:
+1-919-555-2743 vs 19195552743.
哪个电话号码会留在你的脑海里？当然是第一个。那是因为它被分块了。
组块是一种方便的记忆技术：我们把它用于银行个人识别码、社会安全号码和储物柜代码。它指的是将信息排列成「块」的过程，使内容更容易保留、处理和回忆。
研究声称数字 3 是帮助人们吸收和回忆信息的神奇数字。所以尽可能使用它：针对段落，列表，关键步骤等等。
如果可能，避免任意格式化规则。但如果是必要的规则，用红色记号笔拼写出来。填表单时，没人愿意猜。密码要求、语法规则、编号间距等等，如果一个字段需要特定的输入，告诉用户。
席克定律
如果我要举办一个晚宴，我总是选择从当地一家小杂货店购买我的配料，而不是从一个杂乱无章的超市购买。那是因为有太多的选择往往会让人感到麻木。这就是席克定律：它指出，随着选项增加，做出决定的时间也在增加。
应用到用户体验领域，席克定律简直就是去繁求简的一剂良方：限制导航选择，给用户明确但受限的选项。因为随着设计灵活性的增加，它的可用性会降低。少即是多。
这个链接有什么用？还是右上角的按钮？如果并没有增效，那就是减效。每一个字，每一张图片，铃铛图标或者口哨图标都不是100% 必需的，这些都会降低你表单的转换率。
尼尔·帕特尔称只需删除一个字段，他的联系人表单提交率就可以提高 26%。
正如杜鲁门·卡波特曾经说过的，「我更相信剪刀，而不是铅笔。」
打字是在线表单中最耗时、最密集的部分，而且经常会导致错误——尤其是在手机上。用按钮、滑块替换文本框并使用自动完成功能，将减少工作量并提高转化率。
根据 Marketing Insider Group 的调查，有 78％ 的互联网用户表示来自品牌的个人相关内容会增加他们的购买意愿。而当体验与用户无关时，营销活动的效果将降低 83％。
因此，感谢条件逻辑！
条件逻辑（或「分支逻辑」）通过允许基于特定响应的附加指令——类似：「如果这样，那么」，简化了复杂的流程。
使用条件逻辑将不会显示与用户无关的问题，从而减少完成表单的时间，从而使他们不太可能放弃前面的任务。
是的，这听起来像是常识，但是大多数表单都会向每个用户（无论他们是谁）提出相同的问题。使用条件逻辑是双赢的，因为通过明确定义用户细分，可以捕获更干净，更有用的数据。
双重编码理论
我说树时。您就会想到树干、绿叶、树枝。
我们的大脑就像这样聪明：它把图像和文字联系在一起。
这是双重编码理论背后的关键原则，该理论指出记忆有两个不同但相互关联的系统，一个用于文字信息(「树」)，另一个用于视觉信息(「树干、绿叶、树枝」)。
当某样东西以两种方式(图像和文字)被「编码」时，它被理解和记住的几率比仅仅以一种方式(图像或文字)被编码的几率要高。
换句话说，将单词和图像配对会使它们更容易记忆。儿童书籍充分利用了这一点。在设计表单时，有两种方法可以将双重编码理论付诸实践。
我们的大脑处理图像比处理文本快得多。使用图标、照片、形状等线索——无论什么有助于说明你的观点——都会让用户体验更加直观。
表单设计应该是一致的，但这并不是说就不能加入一些小惊喜。通过使用非标准的界面元素——如可点击的图像和切换的滑块——可以使表单填写更加愉快和直观。
你知道吗：用户最初对产品的判断有 90% 仅仅基于颜色？
实际上，根据营销大师尼尔·帕特尔（Neil Patel）的说法，色彩是「购买特定产品的原因的 85％。」正确的组合可以使读者人数提高 40％，理解力提高 73％，学习能力提高 78％。
你不需要成为一名设计师来找出哪种配色方案和对比效果最好。像 Adobe Color CC 和 Paletton 这样方便的程序可以帮助你选择一个能反映你公司形象的调色板。
我们是肤浅的生物，习惯于相信有吸引力的设计在其他方面也更好：更快、更智能、更易用。这被称为「审美可用性效应」，漂亮的界面增加了我们的耐心和忠诚度，甚至让我们更有同理心。
如果内容或布局不吸引人，38% 的人会停止使用页面。换句话说，如果线上表单看起来不漂亮(也不容易填写)，那就是浪费时间。
当然，一百个人心里有一百个汉姆雷特。但是一个简单的界面、干净的字体和时尚的造型绝对会赢得用户欢心。
进度条效应
如果我们知道我们已经取得的进展，我们就更有动力去完成一项任务。特别是已经领先进度的时候，感知上的工作量会相应减少，最终达到超预期效果。美国教授约瑟夫·努内斯和泽维尔·德雷泽将这种现象总结为「进度条效应」——「当人们能看到已付出的努力时，会更有动力完成任务。」
问题排列从易到难
如果表单里的问题按照从简单到困难的顺序排列(而且保持逻辑顺序)，用户将快速完成表单的初始阶段。这反过来会触发连胜效应：快速进步和动力感带来的满足感，让用户不愿意打破连胜。这意味着，当表单变得更加苛刻时，用户会继续坚持下去。
画出进度条
随时反映用户的进度。用户越接近目标，就越有可能完成。如果表单是多页的，请指出还有多少页要完成。
一份来自 Clutch 的研究表明 90% 的用户希望在线表单能有进度条来管控他们的花费时间。
所有的表单的关键都是题目。特别是在头脑风暴讨论题目的时候，最好的就是从目标出发，倒推回来。
所以你的第一个问题就是：你的表单的目的是什么？入职表？反馈意见？研究表单？
尽可能地记下你希望从表格中获得的信息。把它表达为题目(以问号结尾)，而不是灵光一闪。一定留足时间反复推敲。
然后，写下一些可能的答案，这些答案可能会给你一些灵感。
最后，头脑风暴讨论这些题目，这些题目就会解答刚才提到的第一个问题。
作为调查后的回顾，写下每个问题的回答百分比。将这些猜测与你的实际结果进行比较，会发现下一轮要注意的盲点。
这种回顾过程还有助于您的设计并节省您的时间。
关于板块的科学
根据表单转换率报告，表单类型直接影响表单的板块数量。仔细考虑每一个板块的每个问题。
现在，问问自己：你真的、确定、必须要问哪些问题？
多数情况下都不是必要的。但是，即便我们明白少即是多原则，但是真的有机会去用户的脑子里一探究竟的时候，我们还是希望问题越多越好。
当然，这些问题的答案是很重要。但真的重要到失去用户都在所不惜么？
你需要用户的配合。但是每加一个板块，他们的耐心就会失去一点。所以，在你把所有的题目和答案全列出来以后，能删尽量删掉。考虑收集数据的其他方法，并考虑这个题目是否可以推导出来，或者以后再说甚至完全排除。
尽量避免可选问题。如果必须，请在表单最后列出来。
将线上表单结构化是成功的关键。
在你经过头脑风暴讨论，修剪精炼得出了最终的问题清单后，就该组织他们了。用一个「主题」标题将它们组织成组和子组，比如说联系方式，工作经验等。
这样一来，用户不用去读具体的问题就大概知道自己接下来要做什么。
现在要考虑问题的顺序了。按照经验来看，主题相似的问题，就应该放在一起。
每一个问题，每一个板块，都应该激励用户到下一步。大跨步似的前进会让用户困惑，所以要用一种一步一步引导用户往前的模式。
用户会通过调节对信息的流动有一种预判。比如说，「你叫什么名字？」应该在「你住在哪儿？」之前，而「介绍一下你的工作经验？」应该再往后。
最好的做法是把你的表单只限于必填的问题。选填问题将毫无必要地延长表单并激怒用户：「你从哪里听说我们的？」 「你想收到营销邮件吗？」
不过对那些非强制性的但是友好的问题，将它们放在表单的末尾，作为可选的后续内容。这样，他们会感觉不那么有侵略性，也不会影响你的转化率。
双管齐下的题目会让用户觉得模棱两可。而且——你已经猜到了——模糊的答案无法量化。
看看题目中有没有用「和」，「或」。找到了吗？如果有，把这个题目改成两个。
题目越清楚，答案就越清楚。答案越清楚，数据就越清晰。
优秀的表单描绘了一条清晰的路线，通过线索、提示等引导用户完成表单。路线越短，用户完成的可能性就越大，所以尽可能地给用户提供便利。
以下是比较有用的便利方法：
邮编索引
要求用户填写地址的时候，最好的方式是只让他们填写门牌号和邮编，然后使用邮编索引服务完成地址信息的其他内容。（译者注：此条比较适用于国外。）
默认提示
默认文本提示是出现在表单字段中描述其预期值的浅色文本。只有在存在潜在歧义的情况下，才应该使用它。
字段标签
字段标签是出现在字段上面，关于问题性的文本。它经常都会出现，并且不应该用占位符提示来替代。人们常常为使用默认提示同时作为字段标签，但却引发了可用性的问题。
换句话说，你可以使用字段标签，不用默认提示；但是不能在没有字段标签的情况下只有默认提示。
预设答案
大家都喜欢做选择题。它们可以节省读者的时间，并且易于评估。
你可以通过回答「是/否」、「单选」或「多选」来预定义答案。如果有一个你无法预测的答案，添加一个「其他」文本框让读者输入一个自定义的答案。
搜索预测
在要求用户选择他们的国家、职业或具有大量预定义选项的其他内容时，搜索预测会减少所需的打字量(和认知负荷)。
表单只完成了一般的工作。它是被动的，不是主动的。表单的效果依赖于填表者。它们需要从一开始就嵌入到框架中。
表单是交流的工具。需要两方来参与。
因此，在设计表单时，你还需要从用户的角度考虑……这从他们的目的和环境开始。
为什么要有人填写你的表格？他们的目的是什么？把它们写下来。
目的和环境息息相关，所以要让环境在你的头脑中具体化。他们在哪里以及如何填写表格？在家吗？在笔记本电脑上？在手机上？在地铁上？
环境不仅仅是场景。关键是用户能明白在他们的帮助下你的表单可以实现什么目的。
表单需要吸引目标受众的注意力——那么，这些受众由谁组成？
在泛泛人群中思考是没有意义的。要集中你的注意力，集中在一个人身上——或者说，一个「买家画像」比任何一个普通人群给你的信息都多。
试着描绘一个理想的用户画像，有工作、个性、家庭、希望和梦想。集中思考这个理想用户群体。他们在哪里生活和工作？他们的观点和价值观是什么？他们与你的业务有什么关系？
如果你发现对这些理想群体来说什么是有意义的，你就离最终给你带来高价值数据的那些问题又进了一步。
这些人就是你需要反复思考的人。这些人就是会给你答案的人。
表单视觉和结构
填表单肯定不会像过生日一样充满惊喜。
一致性是保持表单填写体验顺畅的关键。一致就是指颜色要一致、视觉感受要一致、主题调性要一致。
你的公司形象是什么？什么短语和单词能概括这一点？你的价值观是什么？在 JotForm，我们注重包容性、友好度和脚踏实地——我们的语言就在传达这些主旨。
当你定义了品牌调性后，在所有的表单中保持住——你的用户应该感觉到他们每一步都在和同一个友好的人互动。
视觉一致性同样重要。在整个表单中都应该用一种视觉风格(以后创建的其他表单同样如此)。
Google 的 UX 研究人员发现，将标签左上对齐会减少表单完成时间，因为它需要的「视觉注视」更少。
眼动研究表明，简单的单列布局比并排放置的多列布局要好。
该规则的唯一例外是要求输入日期（日，月，年）或时间（小时和分钟）时，其中多个字段应在一行上。
每页一件事是一种心理技巧，定义为：
「将一个复杂的过程分解成多个小步骤，并将这些小步骤单独用一页来呈现。」
本质上，用户只需要关注一件事。一条信息、一个决定、一个问题要回答。
整洁的页面鼓励用户继续执行任务。
把输入框的长度控制到正好能够包含所有的输入字符的长度（用户可以看到填入的完整内容）。
输入框的长度应该反映用户预期输入的文本量。邮政编码或门牌号等字段应该短于地址行。
贝马尔德研究所的可用性研究发现，如果一个字段太长或太短，用户开始怀疑他们是否正确理解了标签。这尤其适用于具有异常数据或技术标签的字段，如信用卡背面的 CVV 码。
表单设计中的错误和完成路径
就像生活中一样，填写表格时有可能出错就像生活中一样，关键问题是发出错误信号并允许快速纠正。
十分之一的男性有一定程度的色盲。
当显示验证错误或成功消息时，不要依赖使用绿色或红色文本(因为红绿色盲相对常见)。使用文本、图标或其他东西。JotForm Cards 用一个微动画警告用户，当出现错误时，该动画会说「错误」。
向用户显示错误发生的位置，并说明原因。
如果您必须使用验证，请确保它是内嵌的(在字段的右侧)，并提前报告错误。不要等到用户点击提交来报告验证错误。但是同样，内联验证不应该是实时的，因为这可能会在用户完成字段之前报告错误。
你需要一个电子邮件地址，你会收到一个没有@符号的回复。你要求一个电话号码，而你的回答中有一半位数不够。
打字错误不应该成为表单可用性的障碍。
使用「字段验证」来确保得到您需要的答案，例如，「答案必须包含__」
JotForm Cards 恢复错误输入域名的用户的电子邮件地址；约翰@ gnail . com 应该是 john@gmail.com。
如果用户回答的方式有很大差异(例如，用+12345678912、+44 12345678912、012345678912回答「电话号码」)，请将其转换为一致的格式。
什么是支付表单？
支付表单就是线上的收银台。它授权在线支付，验证用户的详细信息，检查资金是否可用，并确保你收到支付。
支付整合有很多优势。他们帮助你 ：
在设计支付形式时，遵循最佳实践是至关重要的。以下是一些关键规则。
1. 限制付款步骤
Baymard 研究所分析了支付表单，发现支付过程太长或太复杂是放弃支付的主要原因之一。所以一定要分块，分得越细越好。
2. 使用安全视觉提醒
当输入敏感的细节，如信用卡细节时，用户会对任何看起来可疑的东西保持高度警惕。最近的一项研究显示，出于安全考虑，17%的购物者没有付费就离开了页面。
专业的支付形式让用户感到轻松，而任何看起来「不舒服」的东西都会让他们感到紧张。这就是为什么你应该从头开始构建支付表单时就保持谨慎——即使是最小的错误或不一致也会吓跑用户。
它还有助于在表单上启用 SSL 来帮助保护数据。用户知道所有的互动都是加密的，因此可以安心。JotForm 是最安全的数据传输方式:我们符合支付卡行业数据安全标准 (PCI DSS) 1级，并启用了 SSL。
3. 清楚地解释你为什么要求敏感信息
人们越来越关注隐私和信息安全。如果你要求必须填写敏感信息，请确保使用字段下方的注释文本解释为什么需要这些信息。
4. 保存数据
让用户可以选择保存他们的地址和支付信息，可以使这个过程更快、更简单——尤其是在手机这样的设备上。这同时也会给回头用户一种奖励和忠诚的感觉。
5. JotForm添加支付集成的方式
一切就绪。现在你可以在网站、博客或社交媒体上轻松销售你的产品。当你完成表单后…万岁！完成了！但是……等一下。你的表单可能已经完成，但现在还不是发出去的时候…
还有最后一个步骤。
6. 发出前，测试您的表单
我们都有盲点。所以保持谨慎很重要，毕竟数据的质量决定了表单的成功。因此，需要事前检查一下调研题目，确保答案选项的完整可靠，没有任何遗漏。
把表单发送给家人/朋友，并要求他们记录填写表单需要多长时间，以及对这一连串的问题他们体验如何。这也将有助于你下次评估表单的设计。
文章来源：优设
画插画可以用哪些构图方式？他们的优缺点是什么？本文总结了9种常见的构图方式。
框式构图
对角线构图
向心式构图
对分式构图
三角构图
垂直线构图
紧凑式构图
S型构图
三分式构图
在涉及体验细节的小需求上，避免所有的不周到，方才是周到
其中，个人认为，最为核心的是第二点：多体验原型或产品，直到自己觉得周到为止。
文章来源：站酷
这个是视觉通路的说明图，是认知心理学的一个知识。外界信息从眼睛到LGN之后，会往两个方向走，一个形成腹侧通路另一个形成背侧通路。也就是一个形成“你看到是什么”，另一个形成“这个东西离你有多远”。
这是的研究，就是主视觉皮层那块区域并不像我们想象的一样，是一个简单的、从下往上的一个回馈。它真正来自LGN的信息输入只占到10%，LGN从眼睛获得信息也不超过10%。你可以想一下眼睛到LGN，到大脑皮层形成视觉的过程。大脑皮层中的视觉信息90%是它自己产生的，只有10%是来自LGN。LGN当中视觉信息的90%由大脑皮层自己产生的，只有10%来自眼睛。
做一下乘法，你就会发现，即使是眼睛看到的数据信息完全进入大脑皮层，它至多只能占到10%，如果他不是至多10%的话，有可能眼睛实际进入大脑皮层的数据信息只有1%。也就是说大脑主要是在生产信息，而不是在接受信息。所以你应该把你的精力用于研究那90%左右的信息是怎么产生的、它是什么样的规律。
本书的结构第一从设计实现角度来讲比例构图、构建页面的具体结构、栅格系统、组织原则等等。
第二部分是主要的部分，从第八章一直到十六章是从认知智能的角度，就是你怎么处理信息的角度去做这个交互设计。第十章这里头有一个叫模因论，模因论就是把模因类比成基因。
第十三章和第十六章写的就更抽象一些，第十三章主要是讲人工智能的基础，第十四章是讲应用，第十五章就是和今天话题有相关的地方，就是VR、5G这些，第十六章是我研究生毕业论文，我个人认为没写完，又写了一遍，是从心理学角度去阐述，为什么我们设计和国外的设计是不一样的。
我们先有一个感性认识，认知与UI设计有什么关系？这其中有两点。
第一个就是古腾堡定律与内隐记忆。古腾堡定律，大家都听过吧，（注：该法则描述了一个理论：人的眼球移动规律趋向于从上到下，从左到右，在视觉区域中，左上角通常为视觉起始点，右下角为视觉终点，而右上和左下是视觉落盲点。）也就是F形阅读。这是尼尔森·诺曼在2006年产出的一个结论，即人浏览页面的方式会形成一个F型的路径。
但是有个公司叫EyeQuant，他们是做一些眼动仪及其研究的。他们统计了大概是15万张前六秒人的注意力的热区图，它形成了大概这个结果。
EyeQuant就说尼尔森·诺曼的结论可能不太对，它不是F型的，他给出了很多结果。
你会发现这个图很多时候是居中或者是中间等等。于是EyeQuant公司的研究结论就是：有太多因素影响眼球运动，不用把F型法则当做金科玉律。他们在官网上发了一个帖子，这是他们这结论，底下是论文的网址，大家也可以自己看一下文章，判断一下EyeQuant说的对不对。
我们来了解一下古腾堡定律，如果大家不了解，我先来解释一下。古腾堡是一个德国人，他发明了独立印刷术，他认为人的阅览浏览页面的规律是从左上到右下的。左上是第一注意区，然后是右下，另外两个区域是最容易被人忽略掉的。
上方是热力图，大家可以看一下，这两个图其实是有关联的，热力图和古城堡定律大家注意看，最关键的点都是左边。比如当你做web导航的时候，你一般会把导航放到左上角，很少有人放在右上角。跟我们阅读习惯是相关的。读书写字都是从左开始的，所以热力图表现出来并不是彻底的居中或者是在右下，左边还是一个很重要的位置。第二点是2006年的互联网产品形态和现在互联网产品形态是不同的，过了十几年了，拿现在的数据说以前的事情，有效性是有限的。
另外，有几个反例它是没法解释的。大家有没有关注过阿拉伯语的网站，你会发现它的导航是倒过来的。我看了之后我以为是有个镜子，它其实是正确的，因为阿拉伯文是从右向左书写的。通过以上，我们可以认识到古腾堡定律其实还是起作用的，它是根据你的书写的方向形成的。
有关网页布局的规律，应该是：同时受到古腾堡定律以及产品自身因素的影响。那么EyeQuant公司做的那个研究有没有价值呢？是有价值的，它确实是往中间偏了，但是这是和产品的特性有关，因为06年之后越来越多电商的页面，包括纯展示的东西越来越多了，居中构图的情况也越来越多，很多吸引注意的图片放到中心位置了，所以它会影响整个观感。
古腾堡定律在认知心理学里实际就是内隐记忆。内隐记忆就是：无法通过有意识的过程而接触的知识。举个例子，骑自行车大家都会吧。如果我跟你说有本书教骑自行车，你看完了就能学会，这不可能对吧，你需要自己练习骑。你学会了之后，当你要教别人，你也没办法通过语言告诉他，你只能说你必须得练，这个就是内隐记忆。
生活当中有一个体验，我相信所有人都会有，就是不管是用是安卓还是iOS都会有一个问题，就是比如你把A左边的应用删了，iOS系统会让后面的应用自动补位，它会把A应用推到第一个位置，结果就是你每一次想要打开A应用时候很容易点错。这也是内隐记忆在起作用。
这是内隐记忆的分类，有四种。骑自行车与古腾堡定律和第一种程序性记忆比较相关。第二种是知觉表征系统，大家听说过无意识设计吧，这就和知觉启动是相关的。条件反射就不用说了，巴甫洛夫的狗玩摇铃它就流口水。非联想学习中的习惯化和敏感化是什么意思呢？就是比如说你家里有一个空气净化器，打开的时候你会感觉它发出的噪音很明显，但是过一段时间你又不太注意它的噪音了，就是习惯化。
敏感化是什么呢？烟尘和污染的空气非常刺激呼吸道，所以一旦雾霾 ，呼吸道不好的人就会非常敏感，非常难受。比如说北京的雾霾，一开始可能不太注意到它，但是在北京待十年的结果是只要看天，我就能估算出这个pm2.5是多少值，正负不超过50，非常精准。比如一看今天这个天气情况，我猜污染指数有150，一查手机大概130左右。这就是敏感化，你对这个刺激的信息处理会变得更快。
画表情的秘诀，这个是其中一个例子，它涉及到一块脑区叫梭状回面孔区。大家可以看一下，这些表情有一个什么样的共同点。
大多数的表情是没鼻子的，或者鼻子特别小。再看一下这两张图片，有什么明显差异么？
这两个照片差异非常明显，这个叫撒切尔效应。这时候你感觉还行，两个人可能眼睛不太一样，但是当把照片导过来的时候，反差就特别大，你就感觉右边那不是个人，对吧？
这叫面孔倒立效应，只有正立的时候，才能有效识别面孔。就是必须得形成倒三角你才能有效识别一张面孔。鼻子并不参与三角区的方向判定。
你会发现插座也会被当成表情，面孔倒立效应的基础是部分神经的特异化，部分神经元是专门用来处理面部信息的，识别人的情绪对人的认知是很有作用的。快速地判断一个人的情绪，对社会化动物来说非常关键。有一块脑区专门处理人脸识别，识别情绪。
以上大家可以形成一个大概印象，就是认知心理学可能会和你的设计相关联，也说明了认知科学对UI的指导性，这是我的一个观点。右边是它的逻辑事实，书中尽量去证明这个观点。
第一，广义的设计概念。想证明认知科学对UI设计的指导性，得先说清广义设计概念。我对它的定义是解决问题的目的与恰当方式的综合。
你想解决这个问题是吧？方式的综合前面还有一个恰当，我强调这个恰当。
第一个先说他目的性，比如说你设计一个汽车、设计一个界面、设计一个流程，是有目的的，不是无目的的。第二是设计是解决问题的恰当手段，设计是你要找一个恰当的解决方法。比如你累了怎么办，你可以造个沙发、设计个躺椅。还有各种各样的方式，哪一种方式是最恰当的方式，是设计出来的。这都是各种各样能解决你累了的一个手段，但是你一定要找到那个最合适的。
这个之后我们还要定义一下UI的概念，这也是我个人的观点和定义。就是解决虚拟界面信息传输问题的目的与恰当方式的综合。
我是交互设计师，我没有用比如说交互或者视觉这个概念，因为我认为这个概念有些窄，并不是说我区分不了视觉设计师和交互设计师。别人问你如何区分交互设计师和UI设计的时候，你就用一句话就能区分：你和界面之间有没有一次以上的信息互动？如果有，那就是交互要介入，如果没有一次就够了，基本就是视觉的活。
传统设计的目的、主题和体验公式。首先传统设计处在两个过程的中间，第一个是“人-自然“中间，也就是人造物，就是你要通过你设计的工具去改造自然。种个地、开个矿等，你设计这个东西是在告诉别人怎么用。比如说不能把门把手放到转轴的内侧，他一定放到转轴的外侧，这个门把手就是在提示我们怎么去操作这门，怎么推这个门。这是基于材料及其加工工艺的造型理论。
另一个就是设计处在“人-人造物-他人“的认知过程中间。它所具有的特性是示能性与自我定位。比如说我穿衣服，你会发现我没有一个红色和绿色的衣服，我喜欢穿蓝色，黑色等，这实际是对自己身份认识的一种构建，向别人传达出一种信息的设计物。传统设计都会包含这些信息，你住什么地方，穿什么衣服，看什么书，都会有这两个作用。
这是史上特别著名的穿丝袜的潮男叫路易十四。你会发现这个东西就是在两方面表达出传统设计的作用，第一个就是示能性。高跟鞋的形状一定是后边开口前面是收口的，因为你要把脚放进去。高跟提高你的身高。这个执杖宽头的地方是用来放手的，窄头的地方是用来杵地的。传统设计的主题是基于材料及其加工工艺的造型理论与设计实践，这是我的观点。我本科是学工业设计的，读研究生的时候也是学工业设计的，我发现我做的所有的事情都是围绕造型和工艺的造型理论。
举几个例子，轮胎演化过程、手机演化过程，你会发现材料的变化，造型的变化。
再来看一个深刻的例子。
这是一个著名的女设计师设计的，她为什么能做成这个东西？是因为她做这个东西的时候，出现了新的数学工具来帮助建筑造型，很多原有的建筑学派不愿意用这套东西，但是她非常激进，要用的数学工具来处理这个造型，才能做成这个建筑。
包括大家现在坐的车，你会发现曲面的车越来越多，车越来越漂亮，是因为数字化之后，加工的工艺更好了，能做出特别漂亮的曲面。原来为什么红旗特别贵？因为那是老师傅用锤子敲出来的，不是像现在数控技术就把它弄出来的。劳斯莱斯也都是敲出来的，所以很贵，想做很好看的曲面成本极高，但现在就成了很容易的一个事情。
传统设计的体验公式就是E=e*n，e是衰减的。e就是每一次使用的体验，比如说手机，你拿到手机的时候是一个体验，是一个e，用了多少次，n就是几。比如说我做一个椅子，用一次是e，用了多少回，它的乘积是整个体验。n是不会变的， e是唯一的关键，而且他每一次都一样。所以传统设计里对它的造型会非常看重，到底表现出什么东西，好不好用，会特别关键。
我再说一下UI设计的目的、主题和体验公式，UI设计的目的和传统设计不一样的地方是，它示能性更主要，自我定位更次要。我举一个例子，马云想用支付宝，不好意思，他也得跟我们用的一样。不管多有钱的人都好，还是只能用Facebook不太可能为这个人单独设计出一款来。也就是说UI设计是绝对平等的，只能说买个皮肤，你可以花钱，但大多数情况下，它的主体功能是不区分消费能力的，所有人用的支付宝都是一样。不管这个人多穷、多有钱。
所以UI设计更主要的是通过界面来告诉你这个东西怎么用，是比自我定位更重要的。所以我们主要考虑的是界面能不能告诉用户是干嘛用的，怎么用，这是最关键的。这和传统设计不一样，传统设计因为有材料成本的问题，一定会涉及到选择和自我定位的关系的问题。
UI的设计体验公式就是E=a*b*c*…*n。这里为什么用乘法而没用加法呢？大家知道有一个叫迷失度的一个概念，它是形容网页体验中，如果a是零的话，后面做再好也没有用。比如说用户找不到入口，到界面这卡在这了，这界面如果是0.1，那后边所有的转化率就全是0.1乘以这个系数。所以它并不要求每一个页面达到百分之百，但是它强调整体乘积一定是一个高值，比如说这个页面的转化率提高了，提高3%，下一页面降低5%，它是一个乘积的关系，每个页面都很重要，它是一个拉长的一个体验公式。最后乘以一个使用次数。
我们再回到认知心理学，我家有三本到四本心理学的书，来看看他们每个人是怎么定义认知心理学的。
斯腾伯格所著的是一本卖得比较好的书，大家可以看一下，认知心理学规定了研究范畴是什么，这是斯滕伯格写的，他认为认知心理学就是研究人如何觉知，学习、记忆和思考问题的。
下面这本书是三个人合著的，他们压根没有给认知心理学一个明确的定义，只是提到这是有关于思考者的心智的科学。但是他说的不是很具体，而是写了一堆研究对象，你把它抽象一下，会发现关键词实际和斯坦伯格的是一样，觉知、学习、思考、语言。
再来看第三个，艾森克和基恩干脆就没定义认知心理学是什么东西，他说现在这个东西是一个特别广泛的研究领域。
这三本书里头有两本书的第二章叫认知神经学，有一本是在第一章的第三部分叫认知神经学。我原本为我的书取名叫《认知与UI设计》，就是这个原因。很难把认知心理学和认知神经学切得特别开，它们的联系实际是很广泛的。
UI设计围绕觉知、注意、记忆与识别会有一些简单的例子。
视觉组织原则，这个是格式塔闭合原则，这是从神经学层面解释格式塔的闭合原则。就是有一个未封闭的图形，大家可以看到左边，你知道他是未封闭的，包括有那种特别的那种三角，有两个半圆，三个半圆，我们会把它脑补成一个闭合的图形，这个是有神经学基础的。
有个叫赫布定律，这个是什么意思呢？两个神经元如果彼此之间互相刺激，他的神经的突触就会变多，它表现在除了突触增多还有髓鞘增厚，都会使神经之间的联系变得更紧。
细胞集合的定义就是，人对信息整个识别过程是这样的，过去你接受过原始刺激，你会记住它，比如说右边这个完整的圆，你第一次看到这个圆，会形成刺激，再看这个圆又形成刺激，它会形成一个完整的赫布集合。等你再看到左边这个不完整的圆的时候，就是一个不完整的刺激，它会激活原来形成的赫布集合，让你产生错觉认为它是原来的完整的状态。识别和记忆是一体的。记得越少，识别越快。
意识和注意的模型与用户体验是相关联的。真正进入到意识的信息是少之又少的。因为人的视觉能看到的只是可见光。在一个很长的光谱中，视觉信息只占这么一点。人对视频信息的感知还有个体偏向，人对红黄蓝的敏感程度是不一样的，它只对部分色彩更敏感一些，更窄。
信息有一部分是无意识的，比如说心跳的声音，在环境特别安静的时候，你能听见心跳的声音，但是当你注意力在别的地方时，你会过滤掉它，心跳声就不进入你的意识了，但它实际是一直在发生的。
你要建立一个概念，就是用户能注意到的事情，是整个界面里头很小的一部分，大部分他什么都记不住，因为他没空。短时记忆的容量是非常少的，比如说让你记电话号码，一般大家都是以443或者344地记，会把它切割成几个块，这样会更容易记一些。
下面这是《艺术与视知觉》这本书里的一个实验。左上角的图案是他们用来做实验的图。你会发现这个图是一个特别拧巴的形状，首先它是不闭合的，不是完整对称的，设计师看到会非常不舒服。这个图是怎么做实验的呢？就是把这个图给你闪一下，就给你0.2秒或者0.3秒。看完之后让你回忆，回忆这个图是怎么构成的？右边这七种是大家回忆的，它有一个共同的特征，就是把它规律化。这个不是有意进行的，是你与生俱来的能力。把一个不规则的东西记成一个规则东西，是你本来的能力。
我们再看一下，我们把这个时间拉长，你会发现很有趣，第一个是字母A的演化。这原来是头牛，公元前1800年恐怖谷铭文里的文字，长得像左上角第一个。后边的人画牛很费劲，识别它、记忆它很费劲。就把它简化，简化，最后就变成拉丁字母。每一次他都在丢失视觉信息，每次都在不停的丢失识别，使它更规整。26个字母基本都是按照这种原理出现的，只不过它是一个特别长时间，跨度上千年，变成这种结果。
第二个是中国的鱼纹，这是李泽厚的书《美的历程》里的截图。你可以发现鱼纹的演化过程也这样，开始鱼纹真的是条鱼，后来这个鱼变成对称性了，上下对称的。到最后它已经不是鱼了，花了几百年时间变成这个样子。
谷歌的logo也是一样的规律。不停地进行简化，不停地进行识别。识别和记忆是一体的。每次记忆时一定会丢失信息，不管记什么东西一定会丢信息。记忆的东西比看的东西更少，当再识别的时候是拿剩下的东西来识别。这也是和人的认知相关的。
要想研究一个东西，得有一个合理的思维的过程，才能产生正确的思维的结果。思维能力和思维形式会决定思维产出。
我们看一下概念和命题，这是柏拉图的三段论。我举个例子，大前提是希腊人是勇敢的人。小前提是雅典人是希腊人，结论是雅典人是勇敢的人！这是一个特别标准的三段论推理，大前提小前提，不停地缩小集合的范围，得到这个结论。
但是问题是什么？这个语境里头我没有解释这几个概念：雅典人的概念是什么？如果你注意土耳其的地图，你会发现爱琴海那一块靠近土耳其大陆的很多岛是希腊的，特洛伊现在应该是更靠近土耳其一些。雅典人的概念就是伯罗奔尼撒半岛上一个地区的人叫雅典人，但整个希腊实际是一个特别宽泛的概念，它并不是原来的半岛，而是把周边很多岛屿，甚至靠近罗马的岛都扩到希腊地域里，所以这是一个问题。希腊人的概念又是什么？我也没说。我尽管做了推理，我没说勇敢的人的概念是啥。有个坏人在行凶，你用声音制止了还是用行动，能不能作为判断这个人是否勇敢的标准？在你说出一个推理命题的概念的一刹那，实际上已经把这个东西表达出来，但是在这个命题里是没有说的。
我说得有点绕，其实我想表达的意思是：做推理的时候，推理里的概念，你是不可能在这个推理里头说出来的。你想把这个概念进行规定的时候，还得通过其他语言和其他概念来说这个概念。比如说我们学的数学几何，是基于欧几里得的五大公理，五大公设。有了这个东西，才有推理和判断的基础，它是先于命题存在的。如果不对UI进行定义，如果不对设计进行定义的话，我写这本书就是一个很扯的一个事情，因为并没有形成自己的观点和基础。只有形成观点和基础了，才能围绕这个东西进行推理，哪些是合理的哪些是不合理的。先有概念和命题，才有后边理论和假说。
要判断一个理论靠不靠谱，需要符合逻辑三恰。
第一个要逻辑自洽，就是你不能自己打自己的脸，你需要自圆其说。事实与逻辑相符，就是一个观点在你的学说里是兼容的，不能出现逻辑矛盾。
逻辑它恰是什么呢？你提出这个理论和其他理论不能产生矛盾，除非你能证明理论错了，或者在某些条件不适用，这个理论才是靠谱的，你不能和原来既有的公理产生冲突。
逻辑续洽是什么？就是新的场景、新的案例用这个理论还能解释的通满足这三条才是好理论，缺一条都不行。
这一章是从逻辑的视角去看一看，这套理论对不对。从认知的角度考虑设计对不对。认知角度本身对不对。
第一个叫逻辑自洽，在认知理论内部没有矛盾。
我举一个案例。这里有两个图，大家第一眼看上去它是怎么构成的？我用等式表示出来。会有人第一眼看上去认为它是最上方的方式或者是最下方的方式构成的吗？没有人会说这个图形是用这两个更复杂的方式构成的。但是你想没想过，为什么你第一眼看上去就是按中间这两个等式的方式构成的。因为这样理解认知成本，如果把一个你没见过的东西或者一个复杂的东西展示给你看，一定是按照你的记忆，还原成你接触过的最简单的一个构成。它会降低你认知的成本，如果记成奇怪的形状，一定会使你记忆成本更高。
第二，认知一定是要符合演化论。
人们对演化论的误解之一，就是认为越快越强越好，其实不是，而是适应。可能你更强、更聪明、更快，但是适应不了环境。
比如说为什么色盲基因还存在？
男性里头大概有7%-10%，女的还少一点。按理来说我们应该认识更多色彩，为什么色盲还存在？外界信息变成视觉信息主要是靠视锥细胞，它比较密，是在中凹附近。眼动追踪的时候，也主要靠中凹移动来看东西。视感细胞对色彩并不敏感，但是对明暗敏感。色盲在夜间视力很好，比如说晚上要偷袭猎物，或者是偷袭敌人，有色盲的部落会派出这些人，这些人夜间视力更好，会给种群带来生存优势。所以色盲基因没有消失是有意义的。非洲有一种镰刀形红细胞贫血病也是一个案例，拥有这个基因的人不容易得疟疾。但是如果没有疟疾情况下，他容易贫血、容易患各种各样的病。
现实视角的逻辑续洽，第一个就是能预测新的设计趋势，第二是解释新的实验现象。
第一个是扁平化是趋势而不是潮流。这个用左上角的一个图一下就能解释清楚。鸡尾酒的杯子一定是透明的。我们做的界面很多时候就是那鸡尾酒的杯子，大家能理解扁平化是什么原因了吧？因为网速越来越快了，各种各样酷炫的东西越来越多，信息量越来越大，就相当于鸡尾酒里有颜色的酒，颜色越来越多。如果用一个不透明的杯子，或者透明度不够好的杯子，看不出里头的颜色。所以扁平化是一个趋势，不是潮流。
这是我前两天看到的一个帖， 2019年发的一个论文，叫图标样式对可用性的影响。大家可以自己去翻这个论文，很有意思。
测试结果是：最不易识别的是最右边这组。中间是识别度比较高的，这个解释特别简单：过度简化导致识别困难。意思是简化信息的时候，不是一减到底就是好。比如说前面的例子从牛到A的过程，你不能上来就给埃及人拿了一个A，他不认识。Instagram改版为什么受到热议？因为它突然之间扁平了，没有渐进过程，咣叽就变成一个特别扁平的图标，它的纹理和它的图形都发生了变化，所以识别上会特别不舒服。我举过一个例子，比如说你慈祥的老母亲整成了张柏芝或者是高圆圆，你一定不会认为这是一件好事，你会感觉很难接受。
第二个测试结果是这次识别度高的是右边的，中间的识别度是低的。测试结果是多数面型icon识别比线型icon更容易识别。这个是格式塔的描述方式，有阴影的图形只在内部成立，外部行成不了轮廓。线性图形则正好相反，是两向轮廓。
比如说我们看苹果图标，你不管它是从第一版还是到最后一版，他都是面性图标。
因为苹果是个球，它是个实体，这个轮廓在苹果内部成立，就类似于这种感觉。后边是有阴影的，有外部的，因为你要聚焦，后边东西会虚化掉。它只在内部成立。
面形图标普遍比线性图标识别要快，只有三个反例，只有三个反例需要解释。
第一个图，咱先不看虚拟的，你会发现这两个图标线性识别度高，原因是因为它表面有条纹，这两个图中圾桶和钥匙都有条纹，所以用线性来表达的时候，效果更好。其他图标的实体都是曲面，不是条纹。没有参差不齐的边缘，而是曲面，是单向轮廓形成的。因此线型图标更容易辨认。
感受野是人的视锥细胞和神经节细胞的一个联系，不管刺激中心区域、刺激整体、刺激边缘都会有反应。和感受野关联的是神经节细胞，人类眼睛有很多神经节细胞，但这些细胞不是完全均等的点，而是一组点围绕一个中心形成一个组合一样的结构，外边一圈组合，中间有几个组合。
下图的这个就类似视网膜上的结构，神经节也是类似这种结构。当环境同时变亮的时候，刺激比较弱。同时变黑的时候，刺激也比较弱。只有在交界点的时候，反应最强烈。想象一下，当我们看到一个物体的轮廓的时候，细胞对它的反应最大，就形成一条边。这个实际上就是卷积核，人工智能卷积核就是模拟感受野形成的一个原理。
内积就是矩阵内的数字一个一个互相乘，乘完之后形成一个结果。卷积核模拟感受野的原理是：数字矩阵就相当于一个卷积核从最左边一直扫到最后一排，会形成不同的数值。比如说这个是我们要看的图像，比如说黑的会计算成1，白的会计算成0。用卷积核扫一遍就相当于在模拟人眼睛看到的东西，黑白区域之间就会形成一条边，就是我们所看见的轮廓。
这就是我们眼睛看到东西的原理，比如说我们现在做视觉识别，也是用这种特别简单的技术。卷积核实际是模拟人的感受野。
关键点是神经学是怎么解释面形图标和线性图标的不同的。当你看到全亮的东西和全暗东西的时候是有差异的。卷积核扫一圈之后，计算机会认为这个里头的东西和外头东西是一样的。对它刺激是一样的。所以只对边缘有认识。但人的神经比较特殊，它自带一个数值，它能识别出暗和亮。所以当你看一个面形图标的时候，你对轮廓里面黑色部分的认知和对轮廓外白色认知是不一样的，这叫单侧型的轮廓，而不是双侧型的。当你看到线性图标的时候，类似于计算机的感觉，但是你看到面形图标的时候，是人的感觉。
文章来源：UXren
蓝蓝设计的小编 http://www.lanlanwork.com
