版面太单调？试试把它加入到版面当中

大家好，我是雅客。

在制作幻灯片的时候，我们时常会遇到因为文字比较多，而图片又比较少，导致整个版面看起来就非常单调的场合。

那在交互设计当中，也会遇到这样的问题。于是设计师们就引入了图标的设计，为整个版面增添一些亮点，同时也让信息的传递更直观。

如今，你很难再去想象如果你的手机上没有图标，只剩下文字，你要在几个屏幕当中快速找到一个APP是要费多大的劲。

那今天，我就和大家一起来聊聊图标在版面设计当中所承载的作用，以及在PPT制作中如何去运用。

一、图标的作用

图标在设计当中，主要承载着三个作用，分别是：划分内容层次、信息传达以及增添美感。

划分内容层次

人人都喜欢看图，而不喜欢看文字。图标作为一种视觉元素，也是图像的一种，它对人的吸引力仅次于图片之后。

在密密麻麻的文字信息当中，插入一些与文本内容信息相关的图标，就能吸引读者的注意力，增加阅读的兴趣。

上图是截取自某个网站中的一张图片，通过最直观的图标，我们可以很轻松地知道这个版面分为了几个内容，划分内容层次的目的也就达到了。

信息传达

正所谓：一图胜千言，一张图所承载的信息，往往比单纯的文字来的丰富和直观。图标作为图像中的一种，同样也承载着信息传递的作用。

且看上面的这张图。这是我从手机ICON设计当中截取下来的一张图，大家可以思考一下，每个图标分别代表了什么？

聪明的你应该直接扫一眼，甚至不用看底下的文字，就能分辨出每个图标所代表的含义。

左边第一个图是唱片碟，那与唱片碟相关便是「音乐」。接着第二个是一个镜头，那与镜头相关的，便是「相机」。

在我们的大脑内存储了大量这样的信息，以至于我们可以直接跳过文字，从图标就能获得画面当中想要传递的信息。

苹果公司深谙此道，所以每次的手机发布会，在幻灯片上永远少不了的一个元素就是「图标」。

增添美感

图标本身就是有专业的设计师进行设计的，因此它无论从结构亦或者色彩方面，都比较突出。使用它来装饰版面，自然能提升版面的美感。

这一张幻灯片由于使用了图标，版面的美观度提升了不少，让人看了就很有兴趣想去阅读它的内容。

而如果我把图标都删掉，那么画面的吸引力就下降了不少，同时版面也显得过于单调。

二、图标的运用

图标在幻灯片当中，主要有三种运用的方法，第一种是作为文案的修饰，第二种是作为响应式菜单，第三种是划分版面。

文案的修饰

所谓对文案的修饰，就是从每个段落当中，找出几个能概括这个段落的核心词汇出来，然后再根据这些词去找相应的图标。

上面这张幻灯片所用到的图标，就是根据每个段落的核心词汇找出来的，通过图标，我们对每个段落所表达的意思会更加直观和清晰。

同时，有了图标的修饰，也就能让画面丰富一些，不至于全都是文字给人的感觉那么单调。

响应式菜单

在网页设计中，有一条很重要的原则就是：让每个人都能轻松并快速地在网页上找到他想要的东西，同时让整个界面保持美观。

所以，图标作为一种识别性较强的视觉元素，自然而然也被广泛地应用到网页设计当中。

在上面这张网页的截图当中，左边的导航栏和顶部的菜单，都使用到了图标元素。通过这些图标，我们就能尽快地找到我们想进行的操作。

在幻灯片当中，虽然我们没必要像网页当中，按一下图标，网页就能作出相应的反应，但我们同样可以采用图标，作为我们的菜单目录。

上面这张幻灯片就是采用到图标菜单栏的设计，通过图标，观众可以知道现在讲到的是哪一部分，进度如何，接下来还有那些内容。

同时，如果你在切换的时候配合上平滑移动的效果，就能实现页面之间的平滑过渡了。

划分版面

平时我们看到的图标都是比较小的，如果把图表进行放大，那我们就可以把它作为一种图像，起到划分版面的作用。

如上图所示，画面中左边的购物车，就是图标的放大版。由于它的存在，画面很自然地就被划分成左右两半，也就不会显得页面太空。

三、图标怎么下载

提供图标下载的网站也有不少，在这里介绍几个个人认为特别不错网站。

ICONFONT

http://www.iconfont.cn/

首推的第一个网站，依旧是推荐过很多次的ICONFONT，里面的图标数量众多，而且支持格式和颜色的替换，简直不能再人性化！

Easyicon

http://www.easyicon.net/

如果你觉得ICONFONT的图标比较单调，可以尝试下这个网站，这个网站的图标同样也有很多，而且风格也非常丰富。

Iconfinder

https://www.iconfinder.com/

这个网站提供了全套风格的图标，分类十分清晰，而且图标的质量都非常不错，部分还需要收费。

iOS Icon Gallery

http://iosicongallery.com/