- 4766
-
-
-
-
-
自从扁平化还有极简设计开始流行之后，图标的设计越来越重要，经常有设计师问，到底软件程序里面的这个图标怎么设计?
另外网页设计的设计师也会问，我们这平台有vip会员，那vip会员的图标要怎么设计?
还有一个app的设计，这聊天里面的群组图标，要怎么设计?
图标的设计，我认为是对于ui/ux设计师来说；是最难的工作之一。
图标的用意是什么
我们会使用图标就是用它来在使用者界面上传达有意义的东西；而这个有意义的东西，有可能是你的对象、想法、动作，然后设计师把这些有意义东西视觉化。
图标的优点
1. 它是一个全世界共通的语言，不会受到你文化与语言的影响，举个例子，大家都知道手机对吧，手机的样式很多种，但是看下这个图标你是不是马上就可理解到这个是手机的图标？
手机图标
2. 可以快速让使用者识别，尤其是在快速移动的时候，你可以马上轻易的找到你要的功能与东西。
手机在移动的中图标的形象会是这样子，比起文字，更容易在移动的时候识别
3. 增加设计的美感。
4. 节省空间，尤其对于喜欢极简设计或者扁化的设计。
5. 图标是一个非常好的点击目标。
以上说了那么多的优点，但是这个优点有个前提，那就是你的图标要设计得非常好，并且可以让使用者马上看的出来你要表达的意思，如果不是，那么你会让使用者产生困惑，导致使用者想要完成某项任务或者事情，使用者会操作失败或者错误点击。
比如：
看下一下gmail，我红色圈起来的部分
gmail信件内的图标
你可以只看图标就知道这个是什么意思吗?
设计师通常犯的错误
说了那么多来看很多设计师曾经犯的那些错，导致使用者抱怨最多，并且造成使用者困扰。
1.经常发明图标，导致使用者对于图标不是很了解导致使用者常常错误点击。
2.常常抱怨只要一改版就不知道哪一个功能跑到哪里去了。
3.图标画得太细节，太会发挥创意导致使用者与内容搞混，说白点就是图标抢了内容的风采，让使用者注意的点放在图标上不是内容上，然后在小尺寸上那么细节的图标根本没有必要；使用者大多也看不是很清楚。
4.使用一些通用图标但是没有考虑到多平台的问题，实际上同样是垃圾桶，ios与android本身就有很大的不同。
5.使用意义不是很明确的东西却要用图标表达，自己太会发挥创意导致使用者认知上的困难，例如app的里面的特殊图标要怎么画，结果往往是自己在爽，没有考虑使用者能否领会。
6.为了省下空间而省下空间，没有考虑使用者对于学习新图标的学习成本。
设计与选择图标遵循的五个原则
所以你应该这样子做：
一. 能不能在五秒内判断出你的图标的意义
如果不行请重新设计。
二. 选择通用性高的图标
例如下面这些，你一看就知道什么意思
如果你是自己定义这些图标，ios与android的虽然外型差不多，但有明显的风格差异，有些图标的差异性非常大，要找出适合该平台的设计的图标，对于ios与android平台优化，而不是设计一个共用图标全部平台通用。
比如：
这两个差异很大的图标，却是分享，上面是android下面是ios
三. 保持一致性
通用性图标选择有些要很注意，如果你选择的图标在通用上常常代表两种意思以上，那你在使用上要特别小心，这边建议作法是保持一致性，例如爱心代表加入我的最爱，那整个平台的爱心都是加入我的最爱。
几个通用性高但却代表很多意义图标如下
四. 用文字说明抽象的图标
如果空间允许，请你一定要使用文字说明；假设你今天要设计一个图标这个图标是很特殊的，例如群组、vip、天气、快乐….etc；你所设计的这类型抽象的图标，最好加上文字说明。
如果空间不允许，那怎么办，那你应该不要用图标而使用标签来代替图标。
空间真的不够，改用标签
还有设计抽象类型的图标，一定要在真实世界中找到相关联性，尽量不要完全无关；不然你的图标就算用文字说明，也很难让人明白的意思或者快速记住这个图标的意思。
因为抽象的标签很复杂；你这个图标可以用许多的词来表达它的意思，但往往使用者并不知道这个图标的意思。
例如：
图标加上标签
五. 清楚的特征外观
你在设计图标的时候不论是抽象还是共用的；你不应该花太多时间在细节上，因为太小的图标细节是很难被看出来，你应该要花更多时间问自己，使用这类图标的意义在哪里。
所以在特征外型上要有真实的物理特征或者视觉效果。
例如下面这个图标就是用来表示测试手机网速的。
测试网速
经典的抽象图标：设置。
设置的图标
我想大家都看过，设置大部分会使用的图标都是齿轮来表示，那为什么呢?
传统上，机械的操作调整就是利用用齿轮位置/类型/尺寸来决定，讲白一点大家看过机械时钟表吗，那要怎么调整速度…etc，它是怎么跑的是不是要调整齿轮就可以了？
因此，使用齿轮进行设置是一种隐喻，如果你想改变运作方式，你需要改变系统的内部运作，这通常都是齿轮的图标。
全站高品质素材免费下载！
