人机界面设计之色彩设计

人机界面设计Human-MachineInterfaceDesign上上设计人机界面设计第五章色彩设计一、色彩基础二、色彩感觉三、色调和色彩搭配四、计算机色彩五、网页色彩搭配的原则六、搭配技巧上上设计人机界面设计在人机界面设计中，色彩较之形往往具有先声夺人的魅力，同一种界面设计由于色彩的差异可以给人截然不同的感受和印象。如何才能最大限度地发挥色彩的美学功能和视觉效益，创造良好的界面效果，仍是人机界面色彩设计的关键问题。♣界面♣网页上上设计人机界面设计（1）颜色的产生唤起我们对色彩感觉的关键在于光，光是属于一定波长范围内的一种电磁辐射，色彩感觉是由于光照射到物体后，物体的反光而使人的视觉和大脑产生作用的结果，是一种视知觉。有光照射在物体的表面，一部分光被吸收，另一部分被反射回来，被反射回的光反应出你看到的物体的颜色。太阳光照在白纸上，光线基本完全被反射，所以你看到的是白色，黑色物体则完全吸收光线，所以看到的是黑色。绿叶吸收白光中其他光波的色光，只反射绿色光波的光，因此树叶呈绿色。如图，在三棱镜下，可以看到太阳光有紫、靛、蓝、绿、黄、橙、红七种颜色，正如雨后的彩虹会呈现此七种色一样。一、色彩基础上上设计人机界面设计上上设计人机界面设计自然界中的颜色可以分为非彩色和彩色两大类。非彩色指黑色、白色和各种深浅不一的灰色，而其他所有颜色均属于彩色。任何一种彩色具有三个属性，明度、色相、饱和度。（2）色彩的属性上上设计人机界面设计色相(Hue)：也叫色泽，是颜色的基本特征，反映颜色的基本面貌。可以理解成颜色的名字。比如，“红”。上上设计人机界面设计饱和度(Saturation)：色彩的鲜浊称为饱和度或饱和度，鲜艳的色彩饱和度一般都比较高，这样的颜色比较刺眼，所以饱和度比较高的色彩一般都不用在背景上。上上设计人机界面设计明度(Brightness或Lightness或Luminousity)：也叫亮度，体现颜色的明暗度。如白色明度高，黑色明度低，黄色是明度最高的色彩，紫色是明度最低的色彩。上上设计人机界面设计非彩色只有明度特征，没有色相和饱和度的区别。人眼对于黄色和绿色的光是最敏感的，因为这些光比可见光两端的光（蓝色和红色）看起来更明亮些，可在一些特别需要提醒用户注意的地方使用。上上设计人机界面设计三原色：大多数色彩可以用其它色彩混合而成，不能用其它色彩混合而成的色彩叫原色。原色有两个系统，光的三原色：红，绿，蓝是光的三原色，三色混合成为白光；色素或颜料的三原色：红，黄，蓝是颜料的三原色，三色混合成为黑灰色。（3）色彩的三原色和色环上上设计人机界面设计色环：我们将色彩按红-黄-绿-蓝-红依次过度渐变，就可以得到一个色彩环。上上设计人机界面设计在24色色环中，根据位置的不同，颜色间可构成四种关系同类色邻近色对比色互补色上上设计人机界面设计互补色色环中相隔180度的两个色相，均为互补色关系，如红与绿，橙与蓝，黄与紫等。互补色组成的色组，是对比最强的色组，富于刺激性，不安定，有极强的视觉冲击力和热烈感。如果搭配不当，容易产生生硬、浮夸、急躁等效果，使用时要注意处理面积的大小和分散形态的方法来调节、缓和过于激烈的效果。如橙色面积大而且加入红色，起到了主导色调的作用，与蓝色对比效果既艳丽、辉煌又恰到好处。上上设计人机界面设计对比色色环中相隔135度的两个色相，为对比色关系，属中强对比效果。邻近色色环中相隔90度的两个色相，为邻近色关系，色彩倾向近似，冷色组或暖色组较明显，色调统一和谐，感情特征一致。上上设计人机界面设计同类色色环中相隔45度的两个色相，为同类色关系，属较弱对比效果，主调十分明确，是极为协调、单纯的色调。上上设计人机界面设计二、色彩感觉（1）心理感受面对色彩时，看者的心理会受到颜色的影响而起变化，这种变化虽然有个人差异，但大多数会有下列心理反应效果，冷暖、轻重、软硬、华丽朴素、积极消极等几方面。其实色彩本身是不带任何含义的,是人的心理感觉把它们分成不同的类别。例如在夏天,如果你在家里家把所有的灯关掉,把窗帘换成深绿色,不见一丝阳光,这时你在心理上会感到非常凉快!这些并非是真实的的温度,它只是色彩影响人的心理所产生的感觉。上上设计人机界面设计冷暖：能使人感受到温暖之类的色彩称为暖色，反而称为冷色，红色能使人联想到太阳或火，有热量感，所以属于或靠近于红色之类的色彩都称为暖色。蓝色能使人联想到海洋、天空，有爽快之感，浅蓝色能产生寂寞、冷淡之感，所以属于或靠近于蓝色之类的色彩都称为冷色。暖色给人热烈、热情、刺激、膨胀、前进、喜庆等感觉，冷色给人寒冷、清爽、收缩、后退等感觉。色彩的冷暖对比在运用中极其重要。上上设计人机界面设计轻重：黑色和白色属于中性色，它们不易分出冷暖，但有明显的轻重之分，黑色能给人很有重量的感觉，白色能给人有轻于鸿毛的感觉，所以有着明显的轻重之分，一般来说明度不强的色彩都属于重色彩，明度强的色彩都属于轻色彩。上上设计人机界面设计软硬：饱和度不高的亮色会使人觉得柔和,饱和度高的颜色会使人觉得强硬。华丽朴素：饱和度高的色彩给人的感觉华丽，而饱和度低的色彩给人的感觉朴素。积极消极：暖色给人的感觉兴奋而积极，冷色给人的感觉沉静而消极。上上设计人机界面设计色彩的联想作用虽是属于心理学的问题，然而它的适用性在设计上是很重要的，若不能预测人是如何感觉色彩，如何发生作用，就无法有效地活用色彩。由于色彩与人的情绪有着微妙的联系，利用不同的色调设计网页会给浏览者不同的心理感受，凭着感觉和经验，人们一般这样认为：（2）颜色的联想上上设计人机界面设计红色是一种激奋的色彩。代表热情、奔放、喜悦、庆典,有刺激效果，能使人产生冲动，有愤怒、热情、活力的感觉。绿色介于冷暖两中色彩的中间，代表植物、生命、生机,有和睦、宁静、健康、安全的感觉。它和金黄、淡白搭配，可以产生优雅、舒适的气氛。上上设计人机界面设计橙色也是一种激奋的色彩，具有轻快、欢欣、热烈、温馨、时尚的效果。黄色代表高贵、富有,具有快乐、希望、智慧和轻快的个性，它的明度最高。蓝色代表天空、清爽，是最具凉爽、清新、专业的色彩。它和白色混合，能体现柔顺、淡雅、浪漫的气氛(象天空的色彩)。上上设计人机界面设计棕色代表土地。白色代表纯洁、简单，具有洁白、明快、纯真、清洁的感受。黑色代表严肃、夜晚、沉着，具有深沉、神秘、寂静、悲哀、压抑的感受。灰色代表阴暗、消极，具有中庸、平凡、温和、谦让、中立和高雅的感觉。上上设计人机界面设计有些色彩给人的感觉是双重的，比如黑色有时给人沉默、虚空的感觉，但有时也给人一种庄严、肃穆的感觉。白色也是同样有时给人无尽的希望，但有时也给人一种恐惧和悲哀的感受。每种色彩在饱和度，透明度上略微变化，就会产生不同的感觉。上上设计人机界面设计不同的国家、民族、年龄层次的人往往对色彩有不同的理解。比如白色，对西方人来讲代表纯洁，对中国人来讲是不吉利；红色对于孩子来讲是喜庆，但老年人看来或许会感到烦躁。因此设计者必须根据使用对象的特点来选择色彩，以尽量符合人们普遍接受的色彩意义。如彩图，奥迪公司的网站以灰色调为主，高雅大方，与奥迪公司的精品气质非常吻合，是运用色彩联想的典范。上上设计人机界面设计（1）色调在颜色的属性中，色相比较容易区别，但是明度和饱和度有时则不易区别，所以把明度和饱和度放在一起，做为颜色的调子，即色调。色调是色彩作品的总倾向、总特征，是直接传达设计意念的关键，就象论文的中心论点一样，论据、论证均是围绕中心论点展开的，统一在一个调子里。三、色调和色彩搭配上上设计人机界面设计色彩的主色调分为以色相关系为主的调子，如冷调、暖调、红调、绿调等，也分为以鲜灰、明暗关系为主的调子，如明灰调、暗色调等。在色彩关系不变的前提下，只改变作品中色块的面积、形状、位置、数量等形象关系，主色调会发生变化，并可以从中获取完全不同意想的色彩效果。上上设计人机界面设计（2）配色组合两种以上的颜色称为配色。单是一种颜色无所谓美不美，必须两种以上的颜色排在一起才知道美的效果。下面我们就来分析一下。上上设计人机界面设计色相搭配分为类似色相配色、补色配色。两种颜色放在一起，会产生相互反衬的对比效应，各自走向自已的极端，例如红色与绿色对比，红的更红，绿的更绿，黑色与白色对比，黑的更黑，白的更白。这是因为人的眼睛存在残像现象，当你凝视一红色块稍久，然后突然把目光转向一张白纸，眼前就会出现青绿色的虚影。当你要产生鲜明、强烈的对比效果时，利用补色残像原理，使色彩双方得以互增互补。比如在绿色底上的红紫色、红橙色，红色的感觉就更强、更鲜艳。当要寻求安定、平静的色调时，可以在每种颜色中混入少许其补色，以降低对比的强度。另外，还可以利用近似明度、色相、关系，排除残像效应，同化融合成一组和谐和色彩。上上设计人机界面设计明度搭配分为高明度、中明度、低明度及明暗对比。暗色和高亮色，会给人清晰、强烈的刺激，如深黄和亮黄色。暗色中含高纯色，会给人沉着、稳重、深沉的感觉，如深红和大红。中性色与低明度的对比，给人模糊、朦胧、深奥的感觉，如草绿和浅灰。纯色与高亮度色，给人跳跃舞动的感觉，如黄色与白色。纯色与低亮度色，给人轻柔、欢快的感快，如浅蓝色与白色。纯色与暗色的对比，给人强硬，不可改变的感觉。如彩图5-13所示51go网站中的橙色和黑色的明度配色，体现了个性十足的网站特色。上上设计人机界面设计饱和度搭配分为高饱和度、中饱和度、低饱和度的搭配。纯色之间的对比给人的视觉刺激最强烈，使色彩的效果更明确肯定。例如红、黄、蓝三种就是最极端的色彩，这三种之间对比,哪一种色也无法影响对方.而非纯色对比出来的效果就显得很柔和。黄色是夺目的色，但是加入灰色会失去其夺目的光彩，通常可以混入黑,白,灰色来降低饱和度。上上设计人机界面设计整体色调设计作品给观者的感受是由全体配色效果决定的，作品是充满活力或是稳定的，还是寂寞的温暖的，都得看整体的色调而定，取决于配色的色相、明度、饱和度的关系和色彩面积大小的关系。首先确定配色中占具最大面积的色彩，它决定主调。上上设计人机界面设计在色彩的面积对比关系中，如果两种色块同样大小，那么这两种色块之间的对比强烈，但是大小变得不一样时，小的一种色块就会成为大的色块的补充，其实人不会注意到小块的色彩，而只会感觉到大的色块的存在。色彩的大小对比会令色彩有一种生动效果，试在一大片绿色中加入一小点红色，你会注意到红色在绿色的衬托底下很抢眼，这就是色彩的大小对比效果的影响，在大面积的色彩陪衬底下，小面积的纯色会特别突出，但是如果用较淡的色彩，则会让人感觉不到这种色彩的存在，例如在黄色中加入淡灰色，你就根本不会注意到淡灰色。上上设计人机界面设计四、计算机色彩网页设计还需要对颜色在计算机显示器上的显示原理有一个基本的了解。显示器的色彩是由RGB（红、绿、蓝）三种色光所合成的，我们可通过调整这三个基色调校出其它的颜色，网页html语言中的色彩表达即是用这三种颜色的数值表示。例如：红色是color(255,0,0)，十六进制的表示方法为(FF0000)，白色为(FFFFFF)。十六进制颜色值为6位数字，前面两位定义红色，中间两位定义绿色，后两位定义蓝色。颜色在不同的显示器上的效果有很大不同，这取决于用户的偏好设置及显示器的种类。上上设计人机界面设计五、硬件界面的色彩设计1.满足产品的功能要求例如，现在的消防车都采用红色为主体色调，这是根据消防车的功能特点和色彩的功能作用与联想作用相结合而进行选择的。上上设计人机界面设计2.满足人机相适应的要求例如，一般机床设备的底座、床身、立柱等大件，宜用沉重、坚实的色，使人感到机床稳定可靠，而工作台、溜板箱、滑块等零件，往往处在人经常工作的部位，这些零件宜采用浅色，以解除人的沉闷感。上上设计人机界面设计3.满足作业环境的要求4.符合造型设计的美学法5.符合时代的审美要求上上设计人机界面设计六、软件设计的色彩搭配色彩设计的一些原则（1）在一帧屏幕上的色彩种类数目，在非真实感图形显示时，应加以限制，一般少于7种。因为人们在观察屏幕时很难同时分辨多种色彩。（2）根据对象的重要性来选择颜色，对于