相信每一个UI设计师，在工作中都会遇到做图标设计的需求，而作为设计师的我们，经常会因为时间紧迫而“随意”设计一下。这时如果要求高一点的Leader问：“你这个图标为什么这么设计？”，我们就很难回答。那到底如何做才能在保证速度的情况下，又让图标有理有据呢？其实我们只需要多用点心，将“品牌元素”融入设计就能让图标变得大不一样。
1. 形
做图标，我们首先考虑的是图标的外形。还记得自己刚做UI时，自问“首页”为什么是小房子？，“我的”为什么是一个小人？其实这都是大家将意形化之后的结果。
现在有很多的icon平台，能帮助设计师快速的制作图标。只是这些图标大都样式雷同，形到而意难达，直接用就会显得过于泛泛。这时，我们可以先借助这些平台来了解大众眼光中的此类图标是什么样子。而当你的脑海中对你要做的图标有一个大致的形状了解后，你就可以思考“品牌元素”的提取了。
一般来说，我会先去研究品牌的logo，因为它是品牌形象的核心部分。然后通过logo或品牌定位提取出特定的形状，而这个形状是品牌固有的、是具象的，例如圆形、线面、甚至是logo本身等等。
那提取出“品牌元素”后，如何融入图标设计中呢？
（1）直接使用logo外形
现在很多app的首页图标，不再像过去一样拘泥于“小房子”的样式，很多产品开始直接使用自己的logo来代表首页。这样的设计看上去好像比用“小房子”更加“随意”，但却潜移默化的加深了用户对于产品品牌的印象，达到了图意与品宣的双重作用，如下图：
（2）提取图形作为外轮廓
将提取的形状作为整套图标的外轮廓制作成系列图标，这种设计方式多体现在app的功能区。例如淘宝，从logo的“淘”字中提取出圆形后，功能区的整套图标都是以圆形作为外形，如下图：
“画地为牢”，将原本复杂且关联性较低的功能整合在相同的区域里，也不失为一个好的解决办法。
（3）产品特性与图标相融合
相信大家的手机中都会有一款音乐类的app，可能是网易云音乐，也可能是qq音乐，而在这次我要说一下“虾米音乐”的图标设计，先来看图：
可以看出，设计师在制作每一个图标时，都没有忘了这是一款音乐App。四个图标在本身的寓意基础上巧妙的融合了音乐光碟的外形特性，使图标在复杂寓意的情况下高度的保持了统一性。当然，也有人会说，除了“AI电台”和“新歌新碟”，另两个图标的音乐光碟样式并不明显啊！在这必须要强调的一点是，很多时候我们很难将一个特定的形状融入到所有的图标当中，如果强行融合，会让人觉得死板生硬，甚至多余复杂，因此一定要有所取舍。
那为什么案例中有些图标没有很好的融入音乐光碟的外形，却也不影响整套图标的和谐统一呢？
那是因为它们融入了另外一个品牌元素——品牌色。
2. 色
选用品牌色做图标设计的基色，是一个最简单直接的方法。我们在做一个系统时，不可能将所有的精力都放在图标设计中，对于一些相对较弱的功能icon，为了节约时间，我们可以采取这种直接抽取品牌色的设计方式。
举两个例子，下图是虾米音乐和虎课网的个人中心页面。可以看出，设计师在图标制作的用色上，都使用了品牌色。这些功能icon，没有再过多的加入logo或产品特性的元素，只是用简单的线条进行了图形设计，却仍然让人觉得具有统一性、品牌性。
3.整合
综合前文说的形、色两个方面，我们在图标制作的过程中，还需要注意几个问题：
（1）确定风格。选择用线还是面或其他某种形式来表现图标，注意整体性和统一性。比如用线，就要保证整个图标的线是粗细相等的；如果用线面结合，就要确保每个图标都有线和面的体现。
（2）避免生硬的融合。当有些图标与提取出来的品牌元素或产品特性很难完全融合时，宁可舍弃这种方法也不要强行融合。 就像很多时候，一个钱袋的图标，我们很难说明它是钱包，还是余额，或者是赚钱工具？这时候，我们就不要过于强求了。
（3）切忌属性过多。当设计一套图标时，属性保持在2个左右就可以了。如果样式属性采取的过多，反而让图标设计过于复 杂，失去了简易替代的意义。
其实说那么多，关键是对品牌元素的提取，之后便是对其灵活运用。色易而形难，让我们一起在实践中锻炼吧~
网友评论