“跟着扁平风气的呈现……” 那些虚的丝路就不说了。在本身起头做图标操练之前,我对图标的概念仅仅是都雅、简单,只要略微练几下就能够学会了,而起头接触之后才晓得,本来图标设想那么有讲究。
在操练的过程中,我看了良多国外设想师写的关于图标设想的一些文章,从根本的视觉元素到人的系统感知,也毕竟理解为什么现在的界面设想中,图标会占据如斯大比例的原因了。
有人说:“人们关于笼统概念或艺术性强的图像的理解才能其实不差。” 每小我的视觉感知才能都能随便的理解一些图像所包罗的意义,因而成熟的视觉感知是更有效的信息传递路子。
所以我总结了以下三个原则来谈谈图标设想需要重视的事项:
可识别性
视觉同一
不同性
可识别性
最新的 IOS 设想原则被人们归纳综合为:大、黑、简。我也往看了些相关数据,在视觉的设想中,更受欢迎的颜色也确实是黑色,其次是白色。所以沿用到图标设想中,黑白图标也是在界面中最普遍被利用的。(除了那些概念设想)
为了让图标提拔界面中信息的被理解性,良多设想师也会用黑白色往设想图标,原因有两个:
一个是颜色会骚乱花户的理解力;
界面中颜色多了,会消耗用户觅觅图标的时间;
因而颜色是识别性中需要重视的一点,为了进步用户的可识别性,我们的设想更应该遵照用户习惯。有一部门设想师的想象力十分丰富,那是设想师的一大优势,但是切忌将图标设想的过于个性,让用户难以理解。
Instagram 的设想就是就是比力典型的新风气界面,图标易于理解,且用黑色做为基调,识别性高,用户也易于理解,那也是为什么那些图标没有文字做阐明的一个原因。
不外丝路定见在图标的设想中加进一点点本身的创意更能增加产物的兴趣性,所以不要太压造本身的本性。上面的阐明是为了让各人在设想图标时要重视的一些细节。当然,假设是一些个性化图标,颜色也要凸起。好比某些图标的颜色尽可能连结实体物量的附近色,如许也不会让用户在理解上有误差。
在设想完那些图标后,设想师要做两个测试:一个是无布景测试,另一个是基于布景的图标测试。第一个意思是,把图标零丁放在一个画布上,看看同事能不克不及晓得那个图标的意思。另一个是将图标放在界面中,看同事(项目外的同事)能否能理解图标的含义。
视觉同一
差别类型的图标有差别的特征,略微一点改变,城市毁坏整套图标的同一性。包罗冗杂度、外形、线条粗细等等。
我在摹仿整套图标的过程中,很明显能看出原做者关于图标的把控性有多强,每处细节都调整的十分到位,以致于我在造造的过程中碰着很多费事。不外处理之后,本身在创企图标的时候就发现轻松很多。好比:
整体风气的同一
图标的大小掌握
因为在设想的过程中发现那两个问题比力多,所以在那里零丁拿出来说。
整体风气的同一:silucg.com?bp此次设想是一套杯子的图标,为了同一风气我将所有线条的粗细都设置为 2 px,然后做了偏 MBE 风气的设想。为了能让所有杯子同一,我在杯子里加进了酒,所以整套图标也就成了拆酒的各类瓶子和杯子。而点小气泡就是为了增加了一种兴趣性且更同一。
图标大小的掌握:前期在设想的过程中,我发现我的图标大小有颠簸,十分不同一,以至是一个大一个小,所以我加了个限造,一来能够约束图标的尺寸尽量同一,二来能够显得愈加标准。
还有个问题要点一下各人:就是在设想图标的过程中,我全程都是用矢量东西绘造,然后做布尔运算,再用锚点往调整。假设用钢笔往勾能够是能够,但是假设程度不敷高,曲线就会不协调。
不同性
设想一套图标时,要尽量放大图标之间的不同性,削弱图标之间的类似性,那是最随便被设想师漠视的一项原则,往往为了连结视觉风气的同一性、利用统一元素而舍弃了各图标的不同性。
假设一套图标,长得都差不多,那用户在界面中找某个功用要破费的时间会比想象中的长良多。他们会往摸索图标的功用感化,看跳转的页面能否是本身想往的界面,然后再返回。你能够将设想完的一套图标展现出来:然后你说出一个名词,让同事往抉择是哪个,如许能够很好的检测图标的不同性和识别性。
有人可能会曲解同一性和不同性的概念,同一是图标款式及风气同一,而不同是图标与图标之间的含义要明白。
还有一点,在设想的过程中必然要区分被抉择和未抉择的形态,让用户晓得我们的图标赐与了他反应。
总结
最初来说说为什么我们要设想图标:
提拔用户对信息的感知速度;
通过视觉的感知,进步用户的界面记忆;
愈加节约空间,制止了长文的利用;
加强界面设想感,让界面愈加协调。
做为一个互联网行业的设想师,丝路认为我们更应该在图标以外往觅觅灵感,包罗建筑、字体、工业设想、心理学、天然或其他范畴。如今的图标之间,风气和设想款式看起来越来越像,所以每小我都应该进步本身的程度,设想出区别于他们的图标,让本身处于一个领先的位置。