加载中......
首页 /动态/艾易知识库

设计师必须学会的图标技巧

2019-03-19

一:图标的定义


一说到图标,我觉得大部分的人都会觉得特别的熟悉。图标,也叫icon或者是picto,是有明确含义的图形的视觉的语言。当我们一提起图标的设计的时候,不知道你的脑海里会呈现出哪个图标呢?可能你会想起微信APP,或者我们每天使用的APP中的那些返回、关闭等系统的图标,也可能是商场里面的卫生间的图标的等。图标的形式有很多种,它可以应用在很多的场景中,并且表现的方式也是非常的丰富的。有有线的、有面的、也有拟物的等等。图标的历史我们还可以追述到象形的文字中,我们祖先在最开始的时候,是使用图标来记录一天的生活的。听着感觉有没有不可思议呢?在平面设计的领域商标也是一种图标,平面设计里的视觉导视也是有图标的应用的,所以说图标在我们的生活中应用的非常的广泛。

随着计算机时代的到来,我们从80年代的施乐公司界面中的单色图标开始,图标就出现在屏幕之中了,图标能被大众所理解。其实拟物时代的盛行也带来了一些麻烦:拟物图标的质感、光影等会吸引走用户的注意力,我们称之为【视觉噪音】。


设计师必须学会的图标技巧


所以设计师开始探索更多新的表现形式来设计界面中的图标。其实扁平的图标在历史上也有过很多次的尝试,但是都由于太过抽象、缺乏情感的传递,然后没有获得用户的喜爱。我们在现有的界面设计中的图标是一种【轻拟物】或者是【微扁平】的风格。扁平的图标以及线型的图标适合在面积比较小的区域中使用,在面积比较大的区域中我们在使用的时候会加入渐变甚至是轻质感的图标。

现如今我们看到的图标称之为特别的丰富了,如果我们根据分类对图标进行分类的话,在UI 设计中的图标可以分为带有品牌的属性以及特性的产品图标、有功能的指示作用的图标。


二:产品的图标


产品图标能够在我们设计界面的时候体现品牌的调性和特性的图标。我们可以通过产品的图标,用户就可以大概的感知到这个产品主要是做什么的。我们常用的微信,微信的图标是两个对话气泡,这就暗示了是一种社交类的APP,再例如ofo,是一辆自行车,这也暗示了是一种共享单车的APP。

设计师必须学会的图标技巧

有些时候产品也是依靠着自身已经在用户的内心中产生的品牌来直接设计产品的图标。支付宝就是一个支字,淘宝就是一个淘字。所以优秀的产品图标会在我们心中烙下印记,当我们看到这个标识的时候,我们就会想起是哪个产品。其实产品的图标就像企业的LOGO一样,需要让用户一眼就能看出是哪个产品。所以说,一个优秀的产品图标是非常重要的。


1.风格


产品的图标有着各种各样的风格,并且这些风格有可能是拟物,也有可能是扁平的,也许是抽象的,也可能是很具象的。我们可以通过不同的设计风格可以更加的标新立异,从而被用户所记住。所以说要让用户记住我们的图标是一件多么重要的事情。在这众多的产品里面,我们的产品只是万众功能的一个,所以用户不可能及得自己手机里面的App都有什么,能在第一时间取得好感和记忆的是非常重要的。产品图标的主要风格有以下几种。


文字的风格


文字是最直白的东西,并且不容易被曲解。在国内很多商家都会用文字来作为自己产品的图标。例如:支付宝、淘宝、爱奇艺、OFO等。其实这样做也有不足之处,就是文字没有图形有一种美的感受,文字是需要阅读的并不是观察的。如果想给自己的产品使用文字作为图标的话,最好用1-2个字,不能是产品的全称。当然啦,不管是中文还是英文都是需要有符合气质的字体并且做出一定的变化。

淘宝:淘宝采用淘字作为产品的icon图标,且背景的颜色是一种令人兴奋的以及刺激的橘黄色,凸显出电商的属性。并且这个字使用了很久,用户对此也有一定的品牌的认知。

爱奇艺:爱奇艺采用的是英文字母iQIYI以及上下边框组合的形式。这个边框整体看起来像一个电视机,强调了品牌的属性以及功能,也用了在视频非常有识别性的绿色,让人们一看便知道是爱奇艺了。

Facebook:同样也是一款社交的产品,Facebook的产品图标也是采用了一个字母代表着较长的英文单词。

设计师必须学会的图标技巧

正负形以及隐喻风格


图标的设计可以使用正负形和隐喻,来让图标更加有耐人寻味的点。

抖音:抖音的产品图标是一个音符,大家有没有注意到,下面的圆形负空间也是一个音符,所以会显得非常的巧妙。

Keep:Keep的产品图标是一个k,但是同时也是一个人站着抬腿锻炼。


LOWPOLY风格


这种风格应用在产品的图标上是非常的抢眼,因为用户手机可能有很多种APP,第一眼扫过去一定会注意到最亮眼的图标。LOWPOLY是因为你本身的造型是非常吸引眼球的。所以很多产品的图标都是使用LOWPOLY作为图形的背景。

潮自拍:潮自拍使用暖色邻近色渐变的LOWPOLY作为背景,并且使用了一个很潮的S。

人人:人人的产品图标使用了不同的矩形斜度45°,并且增加了设计的速度感。


总结:


图标设计是UI设计中非常重要的一环,是因为除了文字和图片的排版以外,在扁平的时代我们能够传递给用户情绪和设计感的通道就是页面中的各种图形和图标了,如果我们做不好图标,用户就将在使用界面时失去乐趣。所以,设计师都需要在平时做大量的图标练习。在不同的图标风格中,学会使用各式各样的武器。

相关阅读

免费获取网站建设报价

请认真填写需求信息,我们会在1小时内与您取得联系。

长春微信小程序 ×