不止于美：浅析信息图形设计

人在喝完可乐一小时内会有什么反应？高速发展的中国互联网在一分钟内会发生些什么事情？美国大选，川普和希拉里的支持率到底有多大差距？信息图带你一分钟搞懂这些事！随着经济技术的发展，信息化科技化速度越来越快，信息量的不断增加，使我们对于信息的整理与识别要求也越来越高。繁忙的工作生活下，如何使信息更为直观的提供给用户，信息图形设计在这种环境下应运而生。

一. 什么是信息图形

信息图形设计就是针对内容复杂、难以描述的信息进行充分的理解、提炼、整理、分类，并通过设计将其视觉化，通过图形简单清晰地向用户以更为直观的形式展示，这种图就叫做信息图形。

信息图形由信息和图形两个词语组成，它被称之为“信息图形”（Infographics或Information Graphics）。信息图形最初是用在报纸、杂志、新闻等媒体刊登的一般图解。图解这个词在国内外使用了多年，它只是为了充分利用信息，而将这些信息进行功能性的整理。有时候，信息图形也会运用符合各种文化习惯的比喻等手法，以不同的形式来表达。这种信息图形能使用户有惊喜感，也更容易理解、印象深刻。信息图形设计不仅从功能上满足人们对于信息的直观了解，同时从感官上带给人们更多的视觉享受。

二. 为什么要进行信息图形设计

1. 简化复杂的概念

面对复杂的事物，如何快速了解它到底是什么，有什么用？利用图形能使你快速理解信息，专注于信息结论，获得更轻松、更聚焦的阅读体验。

2. 让用户记得更多更牢

相比于文字，人们能够在同等时间内记住更多信息图的内容。如下图中，禁止游泳的图形和两行文字，很明显，图形获取信息的速度快于文字。而且，图形的颜色很直观的传达了危险的信号。

3. 易传播

一张信息图相当于一张创意海报，收藏、转发都是分分钟的事情，在手机、电脑、易拉宝什么地方都能清晰展示。

4. 对比更清晰

这个事物和那个事物有多大区别？一条条的文字说明看起来太麻烦，来张图吧，简单明了的多。

三. 信息图形的分类

根据木村博之的定义，从视觉表现形式的角度，将“信息图形”的呈现方式分为六大类：图解（Diagram）、图表（Chart）、表格（Table）、统计图（Graph)、地图（Map)、图形符号（Pictogram）。

1. 图解（Diagrams）：主要运用插图会事物进行说明

有些东西仅靠语言是无法有效传递的，但是通过图解就能很好的传达你所想要表达得信息。下图是一张健身动作图解，48 种健身动作，图解是每个健身动作。少去繁杂的文字解释，直接用图解表示，直观明了。

2. 图表（Charts）：运用图形、线条、及插图等，阐述事物的相互关系

图表是将复杂的信息进行整理，使之一目了然的表现形式。它运用线条连接或区分事物，利用箭头指示方向，将事物之间的关系表达得足够清楚明晰。流程图就是典型的图表。

下图是一张胎儿成形的发育图，巧妙的运用了图形变化和线条的顺时针转动向我们展示了整个过程。

3. 表格（Table）：根据特定信息标准进行区分，设置纵轴和横轴

表格是指按照一定的标准、规则设置纵轴与横轴，将数据进行罗的表现形式。

4. 统计图（Graph)  —  通过数值来表现变化趋势或者进行比较

常用的统计图有三种，根据主要功能，可以将其分为两大类。第一类是为了体现变化或比较关系的柱状图及折线图；第二类是用于体现某种要素在整体中所占比例的饼图。

上图，是某活动页面的信息图形展示，通过这些柱状图和折线图，我们能很清晰地看到通过这个活动页，用户从参与、领取优惠券、下单到成功支付的比例是怎样的，以及订单的金额和新用户的参与情况。

5. 地图（Map) ：描述在特定区域和空间里的位置关系

将真实的世界转换为平面，在此过程中必然要将一些东西略去。实际上，要说“省略”是地图上最关键的词也不为过。无论是哪种信息地图，最重要的是让用户找到想要看到的信息。信息地图也可分为两大类：第一类：将整个区域的布局或结构完整呈现的地图；第二类：将特定对象突出显示的地图。看看以下美国大选中的美国地图吧！

6. 图形符号（Pictogram）：不使用文字，直接运用图画传达信息

所谓图形符号，基本就是利用图形，通过易于理解、与人直觉相符的形式传达信息的一种形式。我们在街上、商场里、机场、医院，经常会看到图形符号，有些是指示方向的标记，有些是安全出口之类的标记。图形符号的设计原则是尽可能不使用文字，避免语言不通造成困扰，图形要易懂。

小结：信息图形的设计，基本是运用这些元素设计的，有的可能用了其中一个元素，有的可能用了几个元素，有的信息图形可能涵盖了这六大元素。一个好的信息图，不是为了做一个好看的图表，而是讲好了一个故事。归根究底，还是那句话：形式跟随内容。

四. 什么才算好的信息图形设计？

2009年2月，由国际新闻媒体视觉设计协会（SND）主办的新闻视觉设计大赛在美国纽约州Syracuse举行， 评审结束后，图文设计组的专家们总结了他们认为的在制作理想的信息图时应该考虑的五大要素：

1. 吸引眼球，令人心动

庞大的信息量充斥我们的生活，一张信息图的设计如果没有特色很快就会被淹没。因此，不论是从结构出发，还是趣味性，抑或是色彩冲击力，一定要有足够吸引人的地方，首先让用户产生兴趣。不管是展示什么样的信息内容，都要加入一些让人耳目一新的元素。

注：但需要注意的是，刻意的追求不同也是不可取的。

这是一张facebook社交图，美国的facebook friendships（脸谱好友）度是最高的，而非洲是最低的。南极洲和俄罗斯基本上看不到，其他地区相对比较明显。

2. 准确传达，清晰明了

想要传达给用户的内容，还没有在大脑里面好好思考就急于去设计，其结果就像一个人说话文不对题一样。用户遇到这种设计的时候，很难从你的设计中提取到有效信息。设计重心不明确，设计就会显得摇摆不定，注定做不出好的图形。所以在信息图形设计中，要学会取舍，要给用户传达一个最想要传达的主题，然后将这个主题巧妙的表现出来。

Kantar Media CIC，在上海发布了「60 秒看中国社会化媒体表现」信息图（上图）。该信息图提供直观全面的中国社会化媒体表现，帮助客户更好地了解中国社会化媒体平台每天产生的数以亿万计的数据 。

3. 去粗取精，简单易懂

根据概念去推敲创意时，其要点在于要从庞大的信息量中将真正必要的信息甄选出来。所谓“真正必要的信息”指的是那些能使用最少的信息使效果最大化的内容。好的设计，读者只需扫一眼就能知道其主旨是什么。因此，我们要有快速从信息中抓取最有价值的元素。

简化也不单单只是对信息内容进行简化，表现手法也可简化。如下图，关于咖啡种类的说明，通过一杯咖啡的图形样式，不但直观的表现出不同种类咖啡的成分组成，而且各成分之间的比例关系也一目了然。

4. 依据视线，眼动规律

这一点要求我们注意视线的移动规律。比如横向排版的信息，人们一般会首先注意左上角。因此，标题一般出现在这个位置。看过左上角之后，用户的视线会往右下方移动。我们在排版布局的时候，应该遵循视线的移动规律，人眼在观察物体的时候，目光不会只聚焦在一点上，而是会覆盖焦点周边的一片区域。把时间的流逝感和视线的移动相结合，就能产生更好的效果。

5. 少用文字，用图释义

一幅信息图很少或没有没有文字信息，其内涵也能被用户充分理解，这才不失为最理想的信息图，这张图在全世界范围内使用，也不会有什么问题。因此，我们在信息图形的设计过程中，不采用大篇幅的文字，而是尽量使用图形。在信息设计中，确保在语言不通的情况下也能让读者无误的理解信息内容，这是信息图形设计所要追求的目标。

图中通过箭头的方向表示非洲出口的目标国，并且通过箭头的大小对比来表现不同的出口增长率。文字信息很少，却能很清楚的传达信息。

总结

在信息图的制作过程中，设计只是其中的一个环节而已，清晰明了地传达主题才是我们设计的核心内容，掌握这些技巧是为了实现这个最终目的。信息图形的设计也并不是随意而为，它是一个循序渐进的过程，主导设计全程的并非只是美感和创意，而恰恰应该是理性思维。因为对设计而言，是要为信息服务，确保信息更为明确、有效地为人们所接受，在这个基础上，再去追求美感和创意。

参考文献：木村博之《图解力》

作者：许琴，UEDC视觉设计师，现从事网易帐号中心视觉设计，做过手机ROM、IM产品、云端存储产品等；热爱设计，相信设计可以改变生活，且在此过程中贡献自己的力量。

本文来源于人人都是产品经理合作媒体@网易UEDC，作者@许琴