图标设计的原则
最近想到要写一篇关于图标设计的原则,理由如下:
图标设计在GUI中所占的比重越来越大,很多GUI设计师都是从图标设计开始的的;
同时由于软件界面设计的未来方向是简洁、易用、高效,精美的图标设计往往起到画龙点睛的作用,
从而提升软件的视觉效果;
但现实中很多设计师往往过度追求图标的视觉效果而忽视了其他几个方面,舍本逐末;
客户片面的要求图标要震撼,要立体,要发光,要高对比度,而忽视了图标所处的环境;
我们的团队经常做一些大量的图标设计工作,需要一些规范和原则;
谈到原则,我要先说图标设计的目的:
先说优点:
1:代替文字,比文字要直观,提高软件可用性;
2:代替文字,比文字更漂亮,提升视觉效果;
缺点:不如文字表达的准确。
因此,图标设计的核心思想,就是要尽可能的发挥图标的优点:比文字直观,比文字漂亮,减少图标的缺点:
不如文字表达的准确
以下是我总结的几条原则:
第一:可识别性原则
可识别性原则,意思是说,图标的图形,要能准确表达相应的操作。
换言之,就是我看到一个图标,就要明白他所代表的含义,这是图标设计的灵魂。
可以当之无愧称之为图标设计的第一原则。
我们看一下高速公路上的路标设计,我只能说,这是最好的图标设计,可识别性强,简单,直观,
即使是不认识字的人,也能立即理解图标的含义。见图(1):
公路路标的特点,注定图标的设计要简单明了,要具有非常直观的可识别性,司机只需要瞄上一眼,就能准确
理解路标的含义,这样便于他继续驾驶,如果图标设计的不够直观,不具有可识别性,那么司机在开车的时候
会一直盯着路标看,一直在想这是什么含义,你可以想象他面临的危险会有多大,另外在高速上,如果路标设
计不够直观,也有可能在司机还没有明白什么意思呢,就错过了路标。
图(2)是我设计的一些常用
工具类的图标,你是否一眼就能看出每个图标的区别和含义呢?
这套图标虽然很简单,但是很实用,因为通常的界面不需要精度很高、尺寸很大的图标,并且这套图标符
合差异性,可识别性,风格统一性的原则。
图(3)为我们的设计师Veronica为6301项目进行的图标设计,符合可识别性原则。
第二:差异性原则
差异性原则,什么意思呢?意思是如果一个界面上有六个图标,我一眼看上去,要能第一时间感觉到他们之
间的差异性,否则我怎么辨认呢?
这是图标设计中很重要的一条原则,但也是在设计中最容易被忽略的一条,图标和文字相比,它的优越性在于
它更直观一些,但是如果图标设计失去了这一点,我认为图标设计就失去了意义。我们看一些现实中的例子
见图(4),这是我平时最常用的一套软件:用友致远办公管理系统,我只能说从差异性和可识别性来讲,这里
的图标设计非常失败。“新建事项”“待发事项”“已发事项”“待办/已办”“超期督办”“流程管理”这六
个图标一眼望上去,几乎是一样的,其中五个图标采用了相同的元素“淡蓝色文档”,这里图标的设计,已经
失去了存在的价值,因为图标设计的目标是提高效率,用户一眼望上去他们都一样,如果不看文字,用户真的
很难区分它们,这实际上是降低了工作效率。
图(5)这套图标很漂亮,但是从差异性上来讲,这套图标也是失败的,黄色的文件夹部分的六个图标,一眼望
去几乎又是一样的,差异极小,在具体应用过程中会很吃力,用户需要仔细观察才能区分出他们的差别