移动支付|配色、布局、交互设计，大牌设计师的良心分享( 二 ) 随行付|第三方支付

当我们在拿到一张可视化大屏的时候，会快速扫一眼寻找有没有有趣的东西。而且人眼在看东西时总是趋向于识别引人注目的东西，比如明亮的颜色，较大的物体等突出的有特点的事物。利用这点，我们可以用醒目的颜色突出显示数据，而淡化周围的辅助元素，拉开背景和数据的层次。也可以用线条或者线性元素构建一个视觉路径，把人的视线逐渐引向一个兴趣点。这样就可以建立一个视觉层次，帮助读者快速关注到主数据。反之，读者就会盲目搜索而找不到重点了。

如上图我们做的一个简单的案例，左侧的图弱化了背景元素，明显比右侧的数据可读性更强，视觉感受更加舒适。

上图来源于 HistoryShots InfoArt，以上两张图是政党史的演变图，描述了乔治·华盛顿总统到唐纳德·特朗普的迷人视觉历史。 HistoryShots InfoArt 汇集了很多人文，历史的进程，把复杂凌乱的内容通过艺术性的可视化设计，变得有趣且有逻辑性。他们很擅长运用以上所说的建立视觉路径的层次建立方法，一步步引导读者跟随着引导了解到历史进程，十分抓人眼球。再分享两例 HistoryShots InfoArt 其他的可视化设计，以便更深层次的感受下建立视觉层次的不同方法与数据可视化的艺术魅力。

第一张是流行/摇滚音乐谱系图，该图表记录了流行/摇滚音乐及其最畅销的艺术家的成长和发展。记录了从1955年到1978年，由左到右的潮流映射了700多位艺术家和30种音乐风格。提供了每个音乐家成为主要流行制作者的时间长度。重叠的视觉流动线条使读者可以比较多个艺术家在同一时间段的寿命和影响力。并且列出了每个文体类别的起源和家谱，以及其在总唱片销售中所占份额的估计值。
第二张是美国陆军战役地图，此图显示了某军团的路线以及其分配的和附属的单位。第二十军于1944年7月作为乔治·帕顿中将的第三军的一部分登陆法国，并在法国和德国进行了战斗。
如上图这些案例，视觉层次可以用来研究数据的过程。假设在以上确立指标分析维度时生成了大量的图表，可以用几张图来诠释全景，在其中标注出具体的细节另做二级图表单独显示，这样会使数据更清晰。此点也说明切勿为了追求艺术效果而使视觉效果变得凌乱，设计的目的是使数据变得更加清晰易懂，分清层次，能把读者引向关注焦点。相反，层次不分明的图则缺少流动感，读者很难理解，更难进行细致研究。
3.适宜的色彩情感
在数据可视化设计中，色彩是最重要的元素之一。合理利用色彩的情感可以增强可视化设计的感知效果，调动观赏者的情绪。
不同的色彩给人不同心理感受，如：红色代表着喜庆、热情、欢乐、爱情、活力等。但是，很多时候红色也与灾难、战争、愤怒等消极情绪联系在一起；蓝色会给人带来友好、和谐、信任、宁静、希望等积极的情感体验，也会给人以冷酷、无情的心理感受。不同的色彩搭配可以表现不同的情感，用来表达与之匹配的可视化设计主题风格，调动观赏者的情感。
>科技/科幻感、未来感、前卫感：紫外光色、蓝色等
>青春、活力：红、黄、绿等
>高端感、质感：黑色、灰色+渐变/光照等；在色彩搭配上可以选择同色系配色，画面显得更丰富；也可以选择非同色系配色，画面会更加多彩。
色彩搭配不仅是整体风格色调把控，还有与场景融合的面板颜色搭配，如何让整个画面和谐，比较考验设计师的艺术基础功底，色彩设计在可视化应用中最重要的是要做到整体思考，不能只顾局部的颜色搭配。在搭配的时候也要注意不要使用纯色互补色进行搭配，在遇到补色，对比色时可以尝试降低其中一种颜色的纯度。画面要注意不灰，不粉，不色频，与行业相符不会让人觉得奇怪。色彩面积的应用也十分重要，在搭配颜色时要注意主色和辅色的色彩面积比例，是决定色调的重要因素。