Photoshop CC移动UI图标设计实用教程
上QQ阅读APP看书,第一时间看更新

1.4 图标设计色彩学

与很多设计相同,在图标设计中也十分注重色彩的搭配,想要为图标搭配出专业的色彩,给人一种高端、上档次的感受就需要对色彩学基础知识有所了解。下面就为大家讲解了关于色彩学的基础知识,通过这些知识的了解与学习可以为图标设计之路添砖加瓦。

1.4.1 颜色的概念

树叶为什么是绿色的?树叶中的叶绿素大量吸收红光和蓝光,而对绿光吸收最少,大部分绿光被反射出来了,进入人眼,人就看到绿色。

“绿色物体”反射绿光,吸收其他色光,因此看上去是绿色的。“白色物体”反射所有色光,因此看上去是白色的。

颜色其实是一个非常主观的概念,不同动物的视觉系统不同,看到的颜色就会不一样。例如,蛇眼不但能察觉可见光,而且还能感应红外线,因此蛇眼看到的颜色就跟人眼不同。图标颜色效果如图1.16所示。

图1.16 图标颜色效果

1.4.2 色彩三要素

色彩三要素分为色相、饱和度和明度。

1.色相

色相,是指各类色彩的相貌称谓,是区别色彩种类的名称。如红、黄、绿、蓝、青等都代表一种具体的色相。色相又称色调,色相是一种颜色区别于另外一种颜色的特征,日常生活中所接触到的“红”“绿”“蓝”就是指色彩的色相。色相两端分别是暖色、冷色,中间为中间色或中型色。在0°~360°的标准色环上,按位置度量色相,如图1.17所示。色相体现着色彩外向的性格,是色彩的灵魂。

图1.17 色相及色相环

2.饱和度

饱和度是指色彩的强度或纯净程度,也称彩度、纯度、艳度或色度。对色彩的饱和度进行调整也就是调整图像的彩度。饱和度表示色相中灰色分量所占的比例,它使用从0%(灰色)至100%的百分比来度量,当饱和度降低为0时,则会变成一个灰色图像,增加饱和度会增加其彩度。在标准色轮上,饱和度从中心到边缘递增。饱和度受到屏幕亮度和对比度的双重影响,一般亮度好、对比度高的屏幕可以得到很好的色饱和度,如图1.18所示。

图1.18 不同饱和度效果

3.明度

明度指的是色彩的明暗程度。有时也可称为亮度或深浅度。在无彩色中,最高明度为白色,最低明度为黑色。在有彩色中,任何一种色相中都有着一个明度特征。不同色相的明度也不同,黄色为明度最高的色,紫色为明度最低的色。任何一种色相如加入白色,都会提高明度,白色成分越多,明度也就越高;任何一种色相如加入黑色,明度相对降低,黑色越多,明度越低,如图1.19所示。

图1.19 明度效果

明度是全部色彩都有的属性,明度关系可以说是搭配色彩的基础。在设计中,明度最适宜于表现物体的立体感与空间感。