1、1界面设计中界面设计中色色彩彩的运用的运用 2色色彩彩的作用的作用 色彩给人视觉上造成的冲击力是最为直接与迅速的。作为第一视觉语言,色彩在界面设计中的作用是字体与图像等其他要素所无法替代的。由于对色彩的爱好是人类一种最本能、最普遍的美感,它对观看者的影响便是最为直接的。 界面设计者要考虑读者最初一瞬间的色彩感觉,牢牢地捉住他们的眼光,以达到引起关注的目的。3色色彩彩的作用的作用 当我们看到不同的颜色时,心理会受到不同颜色的影响而发生变化。色彩本身是没有灵魂的,它只是一种物理现象。 我们长期生活在一个色彩的世界里,积累了许多视觉经验,一旦知觉经验与外来色彩刺激发生一定的呼应,就会在人的心理上引出
2、某种情绪。这种变化虽然因人而异,但大多会有下列心理反应。 4色色彩彩的作用的作用 红色给人的感受是强烈,热情、喜悦,也使人表现急躁与愤怒 。 黄色是明亮、年轻、光明、开朗,充满活力 。 绿色给人以清新 、清爽、年轻的印象感,像春天般充满活力。 蓝色具有理智的、寂静的印象感,令人觉得清凉和整洁 。5色色彩彩的作用的作用6一、 整体色7一、 整体色8一、 整体色9一、 整体色 Windows XP的蓝色看起来很舒服。原因在于蓝色的亮度最低,不刺眼,同时,在蓝色上显示白字的对比度最高。而如果换成绿色的风格,则白色的文字不容易识别。10一、 整体色11一、 整体色12一、 整体色13一、 整体色 黑色
3、代表严肃、庄重,权威,以及恐怖、严酷 灰色具有枯淡的平静感和稳定性 14一、 整体色15二、 重点色 在同调的色中,局部加上不同调的色,形成视觉美点。色彩的点缀在界面中产生一种紧张感,成为整体的一个着力点。点缀的色应该采用小的面积,并与其他色形成强烈反差,以加强吸引力,形成视觉中心。 16二、 重点色17二、 重点色18二、 重点色19三、 对比色 画面上冷暖色对比,同时占有相同面积及地位。界面上两色不分主次,对比强烈,色彩华丽,装饰性很浓。 20三、 对比色21三、 对比色22多页面间风格的统一 前面展示的WEB页面,多个页面之间是不同,却很明显可以感觉到是同一个站点,这就是因为它们保持着相
4、同的色彩、布局风格。23IBM站点分析 在众多商业网站中,IBM始终以稳重、大方、低调的形象示众。 看一下首页的整体效果 布局 - 平稳而不单调24IBM站点分析25IBM站点分析 首页的布局是横向的四行,为了打破四行过于单调的特性,特别在中间分开了几个不同的栏目,这样就使得页并不那么单调乏味了。26IBM站点分析 色彩 - 低调而不低沉 页面的整体视觉感觉偏重,色彩并不张扬。27IBM站点分析28IBM站点分析 在页面之中的色彩全部变成了黑白灰了,看看这里的“黑”、“白”、“灰”三者之间的关系: 页头与页脚都是黑色,中间分布着不同层次的灰度,而面积最大的还是白色。这样色彩就行成了一个梯度。大约是45%的白,35%的灰,20%的黑。一般情况下黑色较多就会很沉重,灰色较就会没精神,软绵绵,白色较多就会显得很苍白。29 网站中的WEB页面大体只有一种色彩蓝色,但是由于不同的明度与饱和度又分了几个不同的蓝色,这样就有一色彩的层次。不会觉得色彩单调,也不会觉得色彩过多。并且在后期加入一些图片时,由于整站的色彩不是很多,所以图片可发挥的空间就加大了!30IBM站点分析31总结 WEB站点设计中,色彩的运用是UI设计的关键部分。色彩运用成功与否很大程度上决定了网站设计的成功与否。