图标的辅助图形如何设计？我总结了这5条实用经验

最近发现我们在做图标操练的时分，常常会在一些辅佐图形上遇到问题。今日彩云想共享一些自己的经历，希望对我们有些协助。

什么是图标辅佐图形？

许多人知道品牌规划中有辅佐图形的概念，辅佐图形关于品牌辨认系统非常重要，但其实在图标规划时，也会常常用到辅佐图形。图标中的辅佐图形，简略理解便是图标的装修元素，它能让图标规划有更多的细节和特色，强化图标辨认性，同时还能让图标更具视觉表现力。

举个例子，像下面这套图标中的淡色部分和噪点便是图标中的辅佐图形，去掉这些辅佐图形不大会影响图标的辨认性，但添加这些辅佐图形后，图标变得更有特色，更容易被记住。

△ https://dribbble.com/shots/14490441-Feature-Icons

怎么用好图标辅佐图形？

善用辅佐图形为图标增强表现力是图标规划中的一个秘密武器，彩云在工作中总结了一些经历，大概有以下 5 点：

1. 尽量让辅佐图形有含义

《简约至上》这本书中提到过一个删去准则：删去是将不必要的元素都剔除去，直到不能再删去为止。那么在图标规划中，这一点尤为重要，由于图标本身就浓缩了许多的信息，所以要让用到的辅佐图形有它存在的价值，不加剩余的元素。

比方下面这个事例，容易看出其间的辅佐图形是绿色部分。在图标中它们代表的是举动或许结果，作为事物主体的弥补，能够理解为主语和宾语的关系。由于有了这样的辅佐图形存在，强化了图标的辨认性，这就能让图标增色不少。

△ https://dribbble.com/shots/14374503-Covid-19-Back-to-Work

下面这个事例是一位同学的操练，全体来说还是不错的，但就辅佐图形的运用上看就有些小问题了。淡黄色的辅佐图形圆形跟主体图形没有太大的相关，也没有太多实际含义，能够理解为强行为了共同而共同。图标主体已经做了双色规划，添加这些圆形后让图标变得比较复杂且删去对图标含义的表达也没影响，所以这儿的辅佐图形的运用稍显剩余。

2. 结合品牌色

在配色上，辅佐图形还能够结合品牌色彩。用品牌色的主色作为主体色彩，辅佐色作为辅佐图形的色彩，或许直接用品牌主色调作为辅佐图形的配色都能够作为图标规划的亮点。

品牌色的参加，能够让图标配色的运用找到立足的理由，马上就能加分。

比方我们常常在画图标的时分，图标主体通常以单色为主，但此刻能够测验参加以品牌色装修元素作为装点，立马就能提高图标细节。下面这个事例是爱奇艺的主页图标规划，能看出来它的辅佐图形规划配色上是按品牌绿色来规划的。

3. 避免太过共同

在运用辅佐图形的时分，尤其是关于多图标系统来说，完全共同的辅佐图形就显得比较呆板，缺乏细节。再拿上面那个同学的操练来看，不看辅佐图形的具体含义和复杂度，在全体上看起来也缺乏改变，圆形都在同一个位置，保持着同一个巨细和色彩。

辅佐图形的运用想要有更好的作用，尽量在必定的规模能多一些改变。

比方下面这个例子，尽管图形的位置和巨细都相同，但在色彩上做了不同的改变，全体看来细节度还是不错的。

△ https://dribbble.com/shots/14728145-Project-icon

再比方下面这个事例，辅佐图形的运用有丰富的改变，使得图标的细节满满。

△ https://dribbble.com/shots/3861669-Australia-Post-Iconography

别的值得注意的是，改变应该在必定的规模，不能够改变太大。

比方另一位同学的操练，她在图标的底部用了淡色的蓝色填充作为辅佐图形，但这 3 个之间的辅佐图形差异太大，前面 2 个还能理解是一套，但关于第三个图标来说，辅佐图形的比例明显大于前 2 个图标，显得不够共同。

而关于下面这组图标来说，蓝色的辅佐图形的面积改变相对共同，显得更为共同。

△ https://dribbble.com/shots/3817782-Gretchen-Rubin-Icons

4. 不要喧宾夺主

尽管运用图标辅佐图形会让图标显得愈加有特色，但也要分清主次，不应该超过图标本身的核心含义，不能太抢用户的注意力而影响辨认性。

比方下面的事例，图标主体特征一眼就能辨认出来，辅佐图形的参加并不会影响主次关系。

△ https://dribbble.com/shots/3235311-Clearly-Eyewear-Iconography

一位同学做的操练，这儿的辅佐图形有些太过于抢眼，且盖在图标上面影响了必定的图标辨认性。修正方向是假如能把辅佐图形的玻璃质感做一个强化，添加一些透明度，把主体元素凸显出来就会好许多。

这是另一位同学的操练，也是相同的问题，辅佐图形抢了主体元素的风头。修正方向是把辅佐图形改小一些就会好许多。

她画这个图标是描摹了原作的作用，能看到原作中的星星辅佐图形小一些会好许多。

5. 风格保持共同

图标辅佐图形也是图标的一部分，从全体上也需要遵循图标本身的风格系统。

这是一位同学的操练，辅佐图形用星星是没问题的，但这儿星星的尖角相关于主图形的圆角来说就显得风格不够共同，把星星的尖角改为圆角就会好许多。

这位同学的著作也是描摹了原作的作用，能看到在原作中辅佐图形都是以相同的圆润图形为主的，这儿就表现了风格的共同性。

比方对照看看 MBE 的图标风格，他的辅佐图形跟主图形相同，都是比较圆润心爱的，这样看起来全体的风格愈加共同和谐。

△ https://dribbble.com/shots/2636752-Rocket

总结

以上这 5 点便是彩云关于图标辅佐图形的一些个人经历总结，不必定适用于一切场景，仅供参考。

关于图标来说，辅佐图形常常不被重视，以为仅仅为了让图标看起来不单调就加一些作用堆上去，其实这儿面也有许多规律和要注意的细节。希望我们能够合理善用辅佐图形，关注细节，让自己规划的图标更具亮点。

欢迎关注作者的微信公众号：「彩云译规划」