这是一篇绘制图标的简易攻略。

如果你是一名个人开发者,想要为自己的产品制定合适的图标;或是一名创意设计师,想要创造一款属于自己的图标,那么这篇文章会对你有所帮助。

风格化

图标有很多种风格。你可以同时创作多种风格,以便在不同场景下灵活应用。

目前,流行的风格主要有两大类:「扁平风」,以及渐渐兴起的「轻拟物风」,而相同的原型根据不同的需求可细分出许多不同的风格。你需要做的,就是选择一款适合产品的图标风格。

以「少数派」的图标为例,我在尽量不改变原图风味的前提下,绘制了下面两款图标:

你可以很快看出不同风格产生的强烈视觉反响

• 原图的风格便是「扁平风」。扁平风几乎广泛适用于几乎所有特性的产品,但强大的适用也使其无法在众多图标中成为最亮眼的那一个。要突出特性,请在「扁平」的基础上加上一些其他点缀,如渐变色,光晕等。

• 第二个图标的风格便是「轻拟物风」。层次丰富而又简洁明了的特性使其成为2020年的新宠。如果你想让产品的给人的印象是「稳重」而又「鲜活」,请使用轻拟物风。

• 第三个图标是我在「轻拟物风」的基础上延伸的创作。很显然,这款多彩图标影射的产品理念便是「活力四射」与「不拘一格」,很适合与充满创造力,标新立异的产品相搭配。

相信你对选择图标风格已经心中有数,好,让我们开始下一步吧。

侧重点

「风格化」图标能使我们的图标符合产品特性,同时在众多图标中脱颖而出。那,如果我们还想要这个图标「便于记忆」呢?想让用户看一眼便记住,我们要为图标设置「侧重点」。

通常我们使用品牌色作为底色,品牌LOGO作为侧重点将它居中放置,而不是各个元素东分西散,不便记忆:

主要的的东西一目了然,次要的东西靠边站

然后,不妨再试着在侧重点上做文章。这其中大有乾坤。你既不想侧重点过于简洁(以至于失去辨识度),也不想侧重点过于复杂(不便记忆)。下面是一个直观的例子:

中间的图标既凸显了品牌的个性,又便于记忆

再比如:

是不是感觉右边的图标少了点什么?

这就是为什么这些图标能被一眼记住的原因:都具有易于识别的侧重点。

不过,我们不推荐直接将「文字」作为侧重点印成图标。大厂的图标经常这么做,如淘宝,咸鱼等,这是由于不同的需求导致的。可以理解为:这些品牌对「实用」的需求大于「美观」。

你可以说这些图标毫无美感,但这并不妨碍品牌达到目标「实用」或是「便于记忆」。只是作为创意工作者,我们通常不这么做。

层次感

好了,风格确定了,侧重点也有了。让我们再来给图标加一些「点缀」。以App Store图标为例:观察下面两个图标,你是否看出了区别?

App Store的图标,并非简单的三条横杠

「简约而不简单」,是我们在设计任何其他产品时都要考虑的。为图标添加适量的「层次感」,既能使图标更细腻,又能保持简约。

「层次感」并不局限于拟物风,扁平风也能做出「层次感」。巧妙地使用渐变,蒙板与高斯模糊,能为你的扁平图标赋予生命力,甚至能比拟物风更加精美。以下图为例:

我对Luminar AI 图标的练习:扁平化并不意味着设计师更懒了

结语

创作一枚图标并不难,唯一需要的只是你的耐心。多加观察身边中的设计,并对其剖析和练习,你也能创造出优秀的设计。