色彩学基础幻灯片.ppt

色彩学基础第1页，共14页，编辑于2022年，星期二在实用美术中，常有远看色彩近看花，先看颜色后看花，七分颜色三分花的说法。这也就说明，在任何设计中，色彩对视觉的刺激起到第一信息传达的作用。因此，对色彩的基础知识的良好掌控，在网页设计中才能做到游刃有余。今天我们介绍常用配色的基本概念和相关实例剖析。色环是色彩按红、黄、绿、蓝、红依次过度渐变呈现出来的不同颜色，就可以得到一个色彩环。色环通常包括12种不同的颜色。第2页，共14页，编辑于2022年，星期二原色：也叫三原色。即红、黄、蓝三种基本颜色。自然界中的色彩种类繁多，变化丰富，但这三种颜色却是最基本的原色，原色是其他颜色调配不出来的。除白色外，把三原色相互混合，可以调和出其他种颜色。根据三原色的特性做出相应的色彩搭配，有最迅速最有力最强烈的传达视觉信息效果。第3页，共14页，编辑于2022年，星期二黄色分析：选取了主色调黄色为示例。我们看到RGB数值中RG呈现最高值255时，HSB数值中的SB也呈现最高值100%，页面呈现最高纯度亮度纯黄色。因此黄色在三原色中也是亮度最高的颜色。结论：HSB中SB呈现的数值越高，饱和度明度越高，页面色彩强烈艳丽，由于黄色是亮度最高的颜色这一特性，也给人视觉产生强烈刺激的状态，对视觉刺激是迅速的、警戒、醒目的效果，但不易于长时间观看。第4页，共14页，编辑于2022年，星期二红色分析：我们看到RGB中R的数值是227，混合了G30、B40，因此红色的纯度轻微降低，颜色稍偏深红。HSB数值中S显示的饱和度为87%，B为89%，因此颜色还是较为饱和明亮。结论：主色R227数值较高的时候，由于混合了G30、B40少许颜色，饱和度明度稍微降低，视觉刺激减弱，红色特性显得较沉稳。但由于红色是最温暖最有视觉冲击力的颜色特性，该网页整体看来仍然厚重而热烈的表达了主题。第5页，共14页，编辑于2022年，星期二蓝色分析：RGB数值中B蓝色的数值是131与R2、G83相混合，蓝色的纯度降低。结合HSB中数值H色相目前显示的是203，而三原色的纯蓝为240来看，蓝色的色相偏离较大，加上B为51%的明度，颜色偏暗，因此视觉冲击力较弱。页面沉稳、凝重。结论：当蓝色色相偏离于三原色的纯蓝时，视觉冲击力削弱。页面呈沉稳、平静的感受。蓝色在三原色里是视觉传递速度最慢的颜色特性，适合用于表达成熟、稳重、安静的网页设计主题。蓝色在网页设计里也是使用得较频繁的颜色。第6页，共14页，编辑于2022年，星期二间色：又叫二次色。它是由三原色调配出来的颜色，是由2种原色调配出来的。红与黄调配出橙色；黄与蓝调配出绿色；红与蓝调配出紫色，橙、绿、紫三种颜色又叫三间色。在调配时，由于原色在份量多少上有所不同，所以能产生丰富的间色变化。间色是由三原色中的两原色调配而成的，因此在视觉刺激的强度相对三原色来说缓和不少。属于较易搭配之色。间色尽管是二次色，但仍有很强的视觉冲击力，容易带来轻松、明快、愉悦的气氛。第7页，共14页，编辑于2022年，星期二复色：也叫复合色。复色是由原色与间色相调或由间色与间色相调而成的三次色，复色是的纯度最低，含灰色成份。复色包括了除原色和间色以外的所有颜色。复色是由两种间色或原色与间色混合而成，因此色相倾向较微妙、不明显，视觉刺激度缓和，如果搭配不当，页面便呈现易脏或易灰朦朦的效果，沉闷、压抑之感，属于不好搭配之色。但有时复色加深色搭配能很好的表达神秘感、纵深感空间感；明度高的多复色（参看明度的网页例图）多用来表示宁静柔和、细腻的情感，易于长时间的浏览。第8页，共14页，编辑于2022年，星期二补色：是广义上的对比色。在色环上划直径，正好相对（即距离最远）的两种色彩互为补色。如：红色是绿色的补色；橙色是蓝色的补色；黄色是紫色的补色。补色的运用可以造成最强烈的对比。补色最能传达强烈、个性的情感。纯度稍低的绿色为背景的大面积使用，对比并突出了前景纯度明度较高的面积较小红色的图形，形成了视觉中心重点突出，达到主次分明的主题效果。红绿、橙蓝、黄紫这三组补色中，前两种使用得最频繁。这三组补色搭配出的最终效果和目的，可以用两个字来概括强烈！第9页，共14页，编辑于2022年，星期二邻近色：是在色环上任一颜色同其毗邻之色。邻近色也是类似色关系，只是范围缩小了一点。例如红色和黄色，绿色和蓝色，互为邻近色。由于是相邻色系，视觉反差不大，统一、调和，形成协调的视觉韵律美，相较显得安定、稳重的同时不失活力，是一种恰到好处的配色类型。第10页，共14页，编辑于2022年，星期二同类色：比邻近色更加接近的颜色，它主要指在同一色相中不同的颜色变化。例如，红颜色中有紫红、深红、玫瑰红、大红、朱红、桔红等等种类，黄颜色中又有深黄、土黄、中黄、桔黄、淡黄、柠檬黄等等区别。它起到色彩调和统一，又有微妙变化的作用。第一眼看上去给人温柔、雅致、安宁的心理感受，便可知该组同类色系非常调和统一。只运用同类色系配色，是十分谨慎稳妥的做法，但是有时会有单调感。添加少许相邻或对比色系，可以体现出页面的活跃感和强度。第11页，共14页，编辑于2022年，星期二暖色：指的是红、橙、黄、这类颜色。暖色系的饱和度越高，其温暖特性越明显。可以刺激人的兴奋性，使体温有所升高。高明度高纯度的色彩搭配，把页面表达得鲜艳炫目，有非常强烈刺激的视觉表现力。充分体现了暖色系的饱和度越高，其温暖特性越明显的性格。第12页，共14页，编辑于2022年，星期二冷色：指的是绿、青、蓝、紫等颜色，冷色系亮度越高，其特性越明显。能够使人的心情平静，清爽，恬雅。冷色系的亮度越高，其特性越明显。单纯冷色系搭配视觉感比暖色系舒适，不易造成视觉疲劳。蓝色、绿色是冷色系的主要系，是设计中较常用的颜色，也是大自然之色，带来一股清新、祥和安宁的空气。第13页，共14页，编辑于2022年，星期二本部分小结：从以上例子可看出三原色视觉冲击力最强，也最是刺目的，容易制造冲突、烦燥、不舒适的心情，所以是较难掌握的配色，大面积大范围使用要慎重。间色是由三原色中的两色调配二次，间于原色和复色之间，属于中性色，视觉冲击力次之，颜色的刺激缓和不少，给人舒适、愉悦的心情，是较容易掌握的配色，也是在设计中使用得比较多的颜色。复色是由两种间色或原色与间色相混合而产生的颜色，呈灰色阶，视觉冲击力更弱，柔和但是使人沉闷压抑。复色调配好了，能体现出高层次高素养的成熟特性魅力，也称为高级灰，是很经看的颜色。由上可知，颜色相互混合的越多，饱和度越低，视觉冲击力越弱。色彩运用到一定程度后，应该逐渐认识到在一个环境、区域范围里，色彩的属性、性能特性是相对的。例如黄色在蓝色、绿色这两个区域环境下，黄色可以说这个时候是呈暖色，而出现在桔红、朱红、深红这几个区域环境下，黄色可以说在这个时候是呈冷色。同样的，蓝色相对绿色是冷色，紫色相对蓝色是暖色等等。可根据网页设计主题的目的要求，环境协调度的需要等等做相应的搭配调整。RGB三者的数值越接近，色阶较趋于直线平稳，呈灰阶，网页对视觉的刺激性越缓慢、柔和；RGB三者的数值相互间差距越大，色阶曲线波动就大，网页对视觉的刺激性越迅速、强烈。HSB数值中SB相应数值越高，视觉刺激度越强烈。抓住以上这些规律及色彩特性，在以后的网页设计配色中，根据不同的需要配置不同的颜色，来达到某些不同的目的和效果。通过RGB数值和HSB数值的计算，能帮助更科学理性的分析判断，为的是更准确的研究分析网页设计配色的协调性、合理性、掌握其规律性。有经验的设计师通常仅仅凭目测、直觉，就能随心所欲的掌控色彩的配置了。但如遇到困惑，不防也使用一下模式计算法。第14页，共14页，编辑于2022年，星期二