美文网首页冷知识
色彩原理-Joio的“色彩”攻略

色彩原理-Joio的“色彩”攻略

作者: 谢民民 | 来源:发表于2019-12-20 21:31 被阅读0次

Joio的“色彩”攻略(2)

Step 2 学习搭配协调的配色


配色的“品味”

来自插画家 Juliette Oberndorfer  绘画作品

            所谓配色的协调,目的就是让使用者或者观看者,产生一种心安的感觉。对于图像设计来说,内容易于理解并且能够有效的传递信息才是首要任务,像艺术品那种曲高和寡,只凭个人意愿而坚持色彩的使用是不符合设计的初衷的。

            在设计领域中有品味好的配色,和品味差的配色,这里说的“品味”,指的是能否将颜色整体协调呈现的状态。就像服装搭配,你会说那人的服装品味很好,那人穿的衣服好俗气,除了款式设计和用料材质,色彩搭配也占了很大一部分,这就是为什么你会说红配绿丑到哭,因为整体配色出现混乱,显得很不协调。

            那怎么才能使颜色搭配显得协调呢?借助色相、明度、纯度以及隔色的使用要素和技巧,从中总结出一些使用配色达到协调的诀窍。

            这里需要提出一个新的概念,何为“色调”:色调是从色彩的三属性(色相、明度和纯度)三个方面通过处理和加工得到变化统一。后面会详细讲解。


“色相”变化的配色

            我在第一章介绍过,所谓“色相”,指的就是红色、黄色这些色调的称呼。如果使用红色时,使用各种各样的红色,就会给人一种明快且一致性的配色,所以使用同样色相的配色,可在其中加上明度和纯度的变化。

            利用同一色相,做明度和纯度的变化,这样的色调调和方式叫做“单一色相变化调和”。这种方法,可以把幻想式的微妙变化体现出来,比如森林的翠绿色随光线的强弱变化,以及湖水的表面随光线的深浅变化。军队里面的士兵所身着的迷彩服,也是利用这种变化,使其能够融入环境中,不被人注意。总而言之,利用好这种变化的配色方案,风格朴素且不引人注目。另外,色相一致的配色,当颜色面积缩小时,明度和纯度的变化就会变得难以辨别,所以想要有所变化,就需要调整颜色的面积大小。

湖水的表面随光线的深浅变化,可以用不同纯度明度的蓝色表现出来。

                  利用不同色相,在色相上增加一些微妙的变化,比如使用色相环上,取用相近色相的配色,有色彩上的变化,但是统一感却没有消失。这种方法也称作“邻近色调和”。

由色相轮中接近颜色的配合形成总体色调。

                  色调一致的配色,因为颜色上的变化很细微,无论怎样都会给人一种单调的感觉,因此在设计中,避免从头到尾完全使用相同的色相,最好辅以其他色相的颜色作为“强调色”,将色调一致的配色当作“基底色”。

                  由于色相统一而在明度和纯度上作微妙变化的表现力显得贫乏单调,所以不适用于广告设计,往往适用于包装设计和形象图像设计,能够将整体基调确定下来,能够使消费者容易识别,同时将品牌的形象彰显出来。


“明度”变化的配色

          使用明度一致的配色,能够把多种颜色的丰富感增加一种整体上的均衡感,不管使用什么样的色调,色彩的明度相合就能带来一种统一感。 但是明度一致的配色,不会出现强弱和对比变化,因此不太适用于引人注目的广告设计,而且在文字和标记方面,辨识度也偏低。比如说水彩画和彩色铅笔画,细致温和给人一种宁静致远的感觉,但用于标记就显得难以辨认。

明度一致的配色,会使图像辨识度偏低

            明度是让眼睛更容易感受到色彩的变化,统一明度,意味着不在设计上做特别突显或醒目的效果,然而红色和蓝色本身明度偏低,黄色本身明度偏高,所以色彩本身带有明度差异的特性,让整合明度工作显得格外困难。想要是明度统一,有效方法就是把色彩替换成灰色,比如把彩色打印替换成黑白打印,打印出来的全部以灰色为主,其显现的灰色色差和明度差与原来色彩相等。反复调整明度,当打印出来相同的灰色时,那便是色彩明度呈现出完全一致的效果了。   

           同样的设计,同样的色相,加强色彩明度的变化之后,将会呈现出富有强弱呼应的效果,想要引起他人注意或者要使文字变得容易阅读,加强明度差异是个不错的方法。

明度变化效果

“纯度”变化的配色 

          色相和明度一致的配色,无论选用什么颜色,不会改变人们的印象,然而纯度一致的配色发生统一程度的变化,就会给人带来一种印象上的改变。纯度会影响人的心理状况。  

         纯度越高,人就会感到刺激富有精神;纯度越低,就会给人一种沉稳的感觉。统一使用纯度高的配色,色彩张力变得很强烈,色彩间的冲突会让人感受到强烈的对比,一旦颜色数量增加,便会产生热闹愉悦的印象;一旦颜色的数量减少,便会带来一种强而有力的感觉。用纯度低的颜色来配色,可以带来整体昏暗、宁静和沉稳的感觉。纯度低时,色相变化感觉变小了,也会产生一种当颜色数量不够多时,给人一种冷冷清清之感。

其中,纯度越高,越是让人感到鲜艳刺激(左1);纯度越低,越是让人感觉平静沉稳(中);而高低纯度混合的配色是难以统合的(右1)。  

          用中间调的纯度统一色彩,给人带来欢快愉悦之感外,还有做出具有一致性的统一感。比如室内装修,即便颜色数量偏多,给人一种华丽的感觉,但是通过纯度的统一获得沉稳端庄的效果。         


色相搭配方式

          配色的含义,就是将一种以上的色彩进行互相搭配。配色时应该选什么样的颜色比较好,当然要与设计或作品的目的相符合。色相环上的色彩变化,色彩之间的差异都是“平均”的,无论是按照三角形、正方形选择颜色组合,选出的颜色彼此间差异都是均等的,整体设计呈现出一种自然协调的感觉。

三角形搭配 粉、绿、蓝、黄

          从色相环中,按照正三角形选择三种颜色考虑配色,即便只使用了三种颜色,因为色彩与色彩之间的间隔相当远,所以彼此间的差异很大,色相的对比度提高,给人一种华丽的感觉。比如女性流行杂志中的专栏配色案例,主要使用的色相有三种,是色相环上以正三角形作为色彩搭配的准则,整体明度纯度都在控制范围内,内容显示清楚,文字易于阅读,整体清晰易懂。

        按五角星形选出来的色彩搭配,色相间的对比度较小,是一种均衡的色彩搭配方式。

        选择位于对角线上的互补色,色相对比最强烈,选择左右邻近的色彩,也会有类似的情况。活用彩色对比的海报设计,大胆前卫。

蓝与红的色彩对比

从大自然中取得协调的配色

          协调配色的例子在日常生活中比比皆是,我们可以从大自然中获取色彩,山川湖泊、草木花卉,大自然的色彩给人一种安稳亲近的感觉。

从天空获取的颜色

          如果有图片,我们可以从图片中获得颜色,如果没有,拍摄自然景观,利用软件对照片进行马赛克处理,从而获取颜色。

          使用“大地色“配色,让人联想到树木与土地的色彩,强化人与自然的和谐感。

“大地色“配色

由色调而生的配色

        协调的配色,指的是统一色彩的多项要素,在此之前,已经介绍过如何以色相、明度和纯度各项要素的统一,来达到设计协调的方法。

        只要是明度和纯度的混乱,且未经整合的配色,看起来都会是“没有秩序”的配色。然而色彩数量再多,不管是使用上面色相的色彩,明度纯度统一的情况下,都会看起来依旧“井然有序”。这就是“色调”的基本原则。

        所谓色调,就是归纳了依据色彩的整体统一的明度和纯度位置,分别以色相环的形式表现。例如纯度最高,明度中等的配色,会给人一种鲜明生机的感觉,纯度和明度最高,就会带给人一种清淡可爱的感觉。色调分类:淡粉色调、粉色调、浅灰色调、浅色调、明亮色调、高亮色调、鲜艳色调、浊色调、灰色调、深色调、深灰色调、暗色调。

色调

        明亮色调做出的配色,给人一种神清气爽的感觉。

 明亮色调

        暗色调做出的颜色,给人一种沉稳的成人气息。

暗色调

        选定相同的色彩,不仅在整体风格上让人感到统一,也不会让某种颜色特别突出,每一种颜色看起来都是那么均等。


渐变色

          色彩与色彩相连接的时候,渐变色能够使设计看起来更加协调,渐变色的唯一宗旨就是遵循一定规则作阶段性变化的配色。

颜色渐变和形状渐变

        渐变色尽量扮演着连接色彩之间桥梁的角色,当明度差异很大的两个颜色相邻时,会产生很大的色彩冲突,用其渐变色连接,就能缓和其冲突效果。

        渐变色可以设定在色相相异、明度相异或者纯度相异的色彩中,也可以将这些复合组合后,互为相异的色彩之间。

        渐变色的配色,不但给人一种空间宽阔的感觉,也演绎出一种梦幻感,物体的远近效应,也可以用渐变色来体现。

明度纯度高的色彩,组合而成的渐变色,给人带来一种孩子气的梦幻色彩 。 度纯度低的色彩,组合成的渐变色就展现出一种成熟感、诡异感的异域风情。

间隔色

          色彩与色彩之间相互冲突的场合,可以在其中插入灰色或者同系列颜色使之协调。比如当整体风格已经确定,但是色彩之间无法相互协调,又或者色彩彼此融合在一起,图像效果无法凸显出来,为了避免这些情况,我们使用了“间隔色”的技巧。

间隔色:在色环中不相邻的颜色,并且产生强烈对比的颜色。  

        间隔色的功能很多,首先用于主体的色彩和其他颜色相邻时,因为冲突关系产生的晕光或者残像(实际并不存在的黑线),插入两个颜色之间的中间色,便可以避免色彩的冲突。

接着背景色使得想用的颜色无法看清的时候,在其间插入白色,便可以达到颜色突显的效果。

        最后整体配色使用相近的颜色时,图像便融进背景中,只要加入与图像同色系但明度较低的颜色,便可以有效挖掘出想要强调的图像。

橙蓝间隔配色方案

邻近色

           近邻色配色方法比较常见,搭配比同色系稍微丰富,色相柔和过渡看起来也很和谐。

品牌色为青色时,以绿色作为辅导

          纯度高的色彩,基本用于组控件和文本标题颜色,各控件采用邻近色使页面不那么单调,再把色彩饱和度降低用于不同背景色和模块划分。


无彩色的应用

          所谓无彩色,就是完全没有颜色的色彩。

黑白灰三色就是无彩色。

        无彩色具有统一整体设计的多种功能,例如将许多纯度和明度参差不齐的色彩用于设计场合,会有配色缺乏一贯性,容易给人没有整体感,然而只要将背景采用白色或者黑色,把每种色彩进行区隔后,色彩看起来就是独立的个体,整体却自然呈现统一感。

          白色作为背景色,消除颜色过多产生的压迫感。纯度高的色彩加入其他颜色背景,会使原本色彩的鲜艳度降低,难以理解设计师的表达目的是什么,使用白色为底,虽然统一性上有所限制,但是能够产生一种自然的协调感。

白色作为背景色,会给人带来一种畅爽舒畅的感觉,一股清新感。  

          然而色相、纯度、明度没有任何共通性的配色,整体会有一种无法取得统一的感觉。将背景色改为黑色时,整体会变得有统一感,黑色具有收敛的设计感效果。

和黑色搭配的色彩,会显得比原色更加鲜艳。

色彩数量与协调

          过多的色彩会造成杂乱的印象,所以设计时应该注意色彩的数量。以时装为例,假使从头到脚所有服饰都选用没有统一的颜色,配色就会显得没有整体感和品味。没有计划的增加颜色的数量,不仅会使颜色不统一,设计主旨也难以传达。

          考虑丰富的色彩,会使画面变得华丽,但是设计上使用的色彩越少,越能够衬托出个别的颜色,大胆使用单色,或者单色和无彩色配合,用少量的色彩,反而将色彩的力量发挥到极致。

          单一色彩,或者在单色中添加少许强调色的设计,其主体色彩的选择非常重要,想要体现强有力的单色印象,选用明度低的颜色是个要点,明度过高的颜色,人们不能容易地感受到色彩的冲击力。

色彩数量需要协调

        选择色彩的时候,色块太小,存在感就显得薄弱,色块越大,色彩传达的冲击力就越大,尺寸越大的图像,一般认为适用于单色的配色。


重复用色

            实际上,可以即使不遵循色相、纯度、明度的配色规则,也可以留给别人统一印象的方法,那就是“重复用色”的方法。将配色中的某一颜色的纯度提高,让其在配色中脱颖而出,在其他地方又加以与其相近的色彩,设定它的纯度,在突显的色彩纯度和其他色彩纯度之间。

相关文章

  • Joio的“色彩”攻略(1)

    Joio的“色彩”攻略 Step 1掌握有关色彩的基础知识 色彩原理(Color Rules)介绍 色...

  • 色彩原理-Joio的“色彩”攻略

    Joio的“色彩”攻略(3) Step 3强调设计的配色 对比 在考虑设计时,我们常常相,怎么才能使某些地...

  • 色彩原理-Joio的“色彩”攻略

    Joio的“色彩”攻略(2) Step 2 学习搭配协调的配色 配色的“品味” 所谓配色的协调,目的就...

  • Joio的“色彩”攻略(5)

    色彩原理 Step 5 配色的实践 在实际设计时经常遇到的情况,在“印象相符的配色”中,就以...

  • 设计入门-色彩原理

    色彩原理 Step 1掌握有关色彩的基础知识 色彩原理(Color Rules)介绍 色彩是融入日常生...

  • 色彩搭配师培训班

    主讲:韩俪 色彩认知 色彩基本原理 色彩语言 色彩能量 配色训练 色彩搭配...

  • 色彩原理

    01.色彩的基本原理 “远看山有色,近看水无声”,古人的诗里把这个色诠释的很好,无论什么事物第一眼看到的都...

  • 色彩原理

    1.RGB颜色模式屏幕上显示的基于自发光的颜色模型,被称为叠加型原色。 三原色两两混合产生的颜色,叫作二次色。红色...

  • 思维导图与色彩应用

    色彩与知识原理。光和眼睛,光源分类,色彩分类,色彩三要素。 色彩的感官特征。色彩分为冷暖两大色系,色彩的重量,色彩...

  • 色彩学习——色彩形成三要素(光,物体,眼睛)

    色彩构成的基本原理。色彩构成是艺术设计专业的基础也是认知色彩,设计原理的必要环节。 色彩构成,平面构成,立体构...

网友评论

    本文标题:色彩原理-Joio的“色彩”攻略

    本文链接:https://www.haomeiwen.com/subject/qwxwnctx.html