网易设计师：做好企业服务设计，需要重点关注的 3 个要素

@研习设K先生 ：我们都知道在设计中，图像语言比文字语言更容易传播。表格和图表也是设计语言之一，利用视觉化的方式，可以很直观的表现出数据、比例等一些文字资料，让人能一目了然，轻易的理解传达的内容，相对于图片照片来说，在这方面图表还是更胜一筹的。当然，图表的设计还是要注重美观与使用环境，不然只会阻碍信息的传播。怎样将数据资料、文字信息等难以视觉化的内容，变成能轻易理解的视觉结果。这节课就带大家来了解图表在设计中的应用。

前方学校，减速慢行，这在川流不息，飞快的街道上，是很难再零点几秒钟之内传递给司机的，所以我们就可以用国际通用的图形语言 ——图形代替。

包括导视的标识，都是以图形替代文字，也让我们更快速找到地点，它也属于象形图。

象形图的应用还有很多，都是常见的，比如手机app的天气预报。

汉字与图形相比，肯定是图形传播的更快，禁止左转弯的标识已经深入人心。

数据文字同样以图表的形式展现，更易于传播。

图表从何而来？可能在大家记忆中，最早接触的图表就是九九乘法表了吧，那个时候在文具盒的盒盖上都有一个乘法表格，一打开就能看到，让我们记忆深刻（暴露年龄了），那图表的发展到底是怎样的呢？我们一起来看下。

信息图形化早在史前时代，人类的洞穴壁画中出现，当时的人类把信息图形用作记录，比如说，记录牲畜的数量。有几头牛，就画几头牛 。

1786年，一个叫威廉的政治经济学家，出版的第一个经济学书籍，他为了表示18世纪英国的经济状况，就使用了统计图表，当中就包括棒形图、线形图、面积图和直方图。

1920年 德国设计师，格尔德·安茨，将资料信息，比如人口，耗油量等，综合整理为图形符号，然后给它们群组，并赋予数值意义，让复杂的资料视觉化，便于阅读。

1936年，奥地利科学家奥图出版过国际图像印刷教育系统，提倡以图形符号作为国际视觉语言，减少对不同语言的依赖。他曾试图用这种图画文字来取代沟通，虽然最后失败了，但是这种理念在后来的ICON、标示等设计领域有着很深远的影响。

统计学家，爱德华·图夫特，出版一系列有关信息图形的书籍，他认为好的数据可视化，就意味着，每一个数据准确地使观众，看到趋势和模式，他的书现在还是一些国外大学的教材。

信息图表定义

信息图表是将信息转化为易于理解的可视化的传播形式，庞大的数据看起来不仅费时费力，还会因为阅读疲劳而影响信息的传递，图表就是整合这些数据和信息，使他们一目了然 。

图表应用领域

1. 包装

配料表，成分表是最常见的了。

2. 海报

关于数据，时间，地图出现在海报中，都可以用图表形式设计。

3. 网页

网页中也很常见图表的应用。

4. APP

相信大家在网购的时候经常能看到图形化的文字。

5. DM/折页

数据图形化，流程图形化等。

6. 画册

画册里面应用图表还是很多的，比如说大多在甲方公司的设计师，就接触过企业画册，里面有很多信息是可以用图表来展现的。

7. 地图

名片或者订餐卡里的地图是很常见的，还有地铁站的地图，景区的地图，这些都属于图表的范畴。

8. PPT提案

提案中文字用图表来表现，不止能让枯燥的提案耳目一新，更能让你的提案具有说服力。

9. 展示设计

展示设计，比如：会对企业的发展历程，或者企业的产值，都会用图表形式展现。

10. 导视设计

图表的分类

通过上方对应用领域的介绍，大家也能看到图表的应用是非常广泛的，其实通俗来讲，图表就是方便我们理解大量数据，以及数据之间的关系，让我们能通过视觉化的符号更快速的读取信息，那图表都有哪些类型呢？首先我们从形式上来看：

△ 直方图

直方图：二维统计表，由一组块形，组成，每一个块形的面积表示，在相应的小组区间中事例的百分数。比较适合统计人数，时间等数据，也是最常用的图表之一。

△ 长条图

长条图：也称为条状图，棒形图，柱状图等，是一种以长方形的长度为变量的统计图表。长条图用来比较两个或以上的价值（不同时间或者不同条件），只有一个变量，通常利用于较小的数据集分析。直方图与长条图的区别在于，直方图是用面积而非高度来表示数量。

△ 圆饼图

圆饼图：又称为饼状图，是一个划分为几个扇形的圆形统计图表，用于描述量、频率或百分比之间的相对关系。圆饼图用面积取代了长度，加大了对各个数据进行比较的难度。

△ 折线图

折线图：又称为趋势图，链图、走势图，是一类在时间序列中表达数据变量的统计图表，比如时间前后的对比，前面这四个是最常用的图表，下面还有 ：

△ 雷达图

雷达图：这个大家比较熟悉了吧，在我们的订阅号课程中经常使用的一图表形式，就像一个雷达一样，适用于多维数据的排序比较 。

△ 山形图

山型图：顾名思义像山一样的展示数据，以面积的多少和高度的对比展示数据变量 。

△ 瀑布图

瀑布图：采用绝对值与相对值结合的方式，适用于表达多个特定数值之间的数量变化关系，最终展示一个累计值。

△ 量化波形图

量化波形图：听起来好高级的样子，比较常用在表现时间概念的数据。

△ 落差图

落差图： 像电脑的数据线一样，它表示数据之间的联系与比较。

△ 组织图

组织图：也是一个具有关联性的图表。

△ 树状图

树状图：是一个有指向的图；这个图必然存在且只存在一条从大到小的路径。换句话说，树状图是一个有向的，有根的树，并且所有的边都指离根的方向。

△ 家谱图

家谱图：或称祖谱、族谱等，是家族里记载本族世系和相关重要事迹的书。现在很多人的家里还有族谱的，每逢过节都会祭拜。

△ 鱼骨图

鱼骨图：又称因果图，是用图解展示一定事件的各种原因的方法，它常用于产品设计，或是生产质量管理或失效预防，以识别造成问题的所有潜在因素。鱼骨图中会将问题（鱼头）放在图的右边，潜在因素分为几大类，再由各大类中去细分小分类，都在图的左边。

△ 文氏图

文氏图：是在不太严格的意义下用以表示集合的一种草图。它们用于展示在不同的事物群组（集合）之间的数学或逻辑联系，尤其适合用来表示集合（或）类之间的「大致关系」。

除了上面介绍的这些图表形式，还有哪些图表呢？这些年兴起了扁平化的图像形式，以图像的矢量图形来展示数据，不仅让信息一目了然，更增加了阅读的趣味性。我们来看下这类图表都有哪些吧

△ 扁平化图表

扁平化图表，将事物数据矢量化，扁平化的风格展现，还原事物的样貌，这类图表使用时候要注意色彩上的搭配。

△ 手绘图表

手绘图表，一种是草图的形式，然后在其基础上细化图像，这个是考验手绘的能力。

一种是卡通的形式，最常见的就是手绘地图了。

△ 3D图表

3D图表，需要用3D类型的软件来完成 。

△ 2.5D图表

2.5D图表和3D图表类似，只是透视没有消失点。

△ 合成图表

合成类的图表，这种就比较难了，需要花费较多的时间，并且这类图表都会成为画面中的主体。

从内容上分

刚才，我们从形式上分了那么多的类型，接下来，从内容上划分，这里我给大家介绍最常用的几个类型：

△ 表格

△ 流程图

△ 路线图

△ 成分表

△ 图解

△ 统计图

△ 时间表

使用图表的优势有哪些：

制作图表的流程与方法

1. 提取关键的文字信息（比如数字、日期、价格等）

先说流程，第一步其实就是帮助信息瘦身，提取关键性的文字信息。

如果甲方给出这样一段文案，我们第一步肯定是要简化它，做一个简单的提取，提取文案中的关键信息，比如说，这里的时间信息。

2. 整理信息（扔掉不需要的内容）

这一步也是关键的一部，为了让繁杂的语言变为图形，这一步就要精简文字。

3. 绘制草图（手绘/软件）

第三步根据文字绘制出草图，可以手绘在本上，也可以用色块的形式，在软件中，大致摆放出来。

4. 选择软件制作（可以做图表的软件/网站）

这里给大家推荐一些可以做图表的网站，有的网站可以直接输入数值，它就会帮你挑选合适的图表类型，一键生成，非常方便。

• https://datahero.com/
• https://online.visual-paradigm.com/cn/
• https://observablehq.com/
• https://observablehq.com/
• https://infogram.com/
• https://slemma.com/
• https://www.onlinecharttool.com/
• https://zoomcharts.com/
• https://online.visual-paradigm.com/cn
• https://www.tubiaoxiu.com/
• https://www.canva.com/zh_cn/graphs/

还有两个软件也是专门用来做图表的，当然，除此之外，还可以用AI，PS，这类我们常用的软件也可以。

可以用AI软件当中的图表来设计，当然，这些都是简单一些图表形式，也很好操作。

先来看底下这部分内容，我们可以用图表代替文字，然后搭配说明性文字就可以了

把这一部分图形化之后可以置入画面中。

按照草图，我们选择一款合适的字体，把文字信息和图表编排到版面中，就OK了。

案例演示

这是文案内容，看不出重点 ，我们接着往下做。

提取每一段重要的文字信息，先看红色这段文字。

根据这段文字，我们可以选择什么图表类型呢？它表现了一个时间的先后顺序，那我就用流程图，右边是我们找的参考画面。

然后根据文案内容我们也提取一个元素——野猪，用这个图形来作为辅助，设计流程图。

文案里有很多数据，我们之前讲过，这类百分比的数据，适合用长条图或者圆饼图来做。

最后我们选择长条图来设计，因为这样数据会更加直观。

像这个图表一样，我们可以把品类图形化。

然后画出草图，规划版面。

按照草图把标题置入进到画面里，还有刚才设计好的流程图。

画面元素如果用矢量图形表现，那主形象也尽可能选择矢量图形，这样不仅能统一视觉，还能避免图像之间的矛盾所带来的一系列调整难题。

刚才的流程图放进来，根据这个方式，我们可以将其他文字也图形化。

有的矢量图形可以从素材网站上下载。

最后这样就完成了，我们可以看到，整体画面文字的所占的比例很低，所有视觉的语言都用图形图表代替了，让画面更丰富，有趣。

这节课到这里就结束了，我们讲了图表的发展、图表应用领域，图表的分类，图表的表现形式，以及图表的制作方法，图表是可以让我们跨越语言的障碍，进行沟通的桥梁，甚至是跨越行业的语言符号，大家应用时要根据文案信息，选择适合的图表形式。

欢迎关注研习社的微信公众号：「Yanxishe2017」