图标设计的创意方法

上一篇《如何确定一套APP图标的风格》在文末关于图标创意的部分,简单地提了两种思路,后来想想其实还有很多方式。也许很多人都经历过在网上不断刷图片找参考期待灵感闪现,所以这篇从图标的造型、色彩、质感等维度去归纳图标的创意方法,从其中一个点切入寻求创新,也许能更快地找到好的表达。

01.从品牌LOGO延伸设计

这是最为推荐的思路,因为从Logo设计特征延展出来的图标设计,其实是把品牌基因融进UI设计,能让用户自然地产生与品牌间的联想,加深品牌印象

马蜂窝:提取了Logo底部的弧线设计,在系统图标中多处都应用了弧线,成为其标志性的设计元素,app logo和系统图标形成一套统一的视觉系统。

图标设计的创意方法_第1张图片

链家、Quark:都采用断线(或称为开口)的设计,由于品牌Logo本身具有这种特点,因此让人感觉非常自然、一体化。

图标设计的创意方法_第2张图片

02.从品牌IP延伸设计

和从品牌logo延伸的设计一样,从IP延展也能让用户自然地联想到品牌,并且拟人化的形象能让图标富有情感和活力,更好地将情绪传递给用户

图标设计的创意方法_第3张图片


03.造型创意

断线法:

断线(开口)的设计让图标更有造型感。需注意的是,开口通常选择在线条交界的地方,让图标有透气的感觉。

图标设计的创意方法_第4张图片

几何法:

运用基础的几何图形如圆、方、线条、点等做设计,这种设计语言最终呈现的风格往往会有较强的设计感;

由于这种设计造型简洁,所以通常会结合稍粗的线条增加图标视觉重量。

图标设计的创意方法_第5张图片


04.色彩创意

1) 色块(自如):描边的图标造型结合几何形状的色块,是现在较为流行的一种设计;

2)微渐变(大众点评):流行了一整年的设计,在很多app的金刚区图标上会采用这种设计来强调入口,吸引用户视觉注意力;

3)邻近色的碰撞(enjoy):比较少见,如果应用不当容易导致图标过于花哨,失去视觉焦点。

图标设计的创意方法_第6张图片


4)同色相的不同透明度或不同明度组合:能够丰富图标的色彩层次,同时又不至于让图标太复杂。

图标设计的创意方法_第7张图片


05.质感创意

具有质感的设计会让图标视觉非常突出,因此通常适合应用在界面本身内容较多,需要特别强调的图标类型上(如金刚区图标)

常用的表现手法:

1)渐变:应用渐变色让图标具有厚度或形成前后关系;

2) 投影:应用投影提高图标的视觉层级,使具有重量感;

3)轻拟物:比起以前追求逼真细节的拟物,通过色彩变化形成的轻微拟物质感能让图标更具现代感。

图标设计的创意方法_第8张图片


06.动效创意

在图标上应用动效的例子越来越多了,但多数是在切换tab时有一个缩放效果的动效。以下这两个例子是图标在选中状态时有很轻的动画效果,让人感觉很舒服:

氧气app:商店Tab在选中时,盒子上方的气泡在轻盈地晃动碰撞,创意也符合产品“氧气”的主题。并且这种微动效很轻,不会过于分散用户注意力,在图标动起来的瞬间,能给用户眼前一亮的惊喜;

饿了么:分类图标的“水果”图标,是会轻微弹跳的(嗯截图的时候橙子正跳着所以拉长了);

VSCO:DSCO icon有渐变色彩变化的动效,可能是出于推广的需求,需要吸引用户的注意,对于第一次看到的用户来说,出于好奇点击的可能性应该比较大。

图标设计的创意方法_第9张图片


只需要一点点的创新就能让图标形成差异化,深化品牌风格。以上每种创意方法都有各自的特点,在我们确定好风格方向后,需要结合项目特点选择合适的创意方法

你可能感兴趣的:(图标设计的创意方法)