第三方帐号登录

第三方帐号登录

使用邮箱登录

找回密码

全站搜索 传播新资讯,发掘源创意!

色彩色彩配置教程之绿色的设计!

2018-08-13  4311

前言

色彩学,或者说是配色技能,是我们设计师最需要的技能之一,普通人来说,谈论一个物体外在,经常用到的2个纬度,那就是形色,形是指轮廓,色当然就是指它表现出来的颜色,色彩。

色彩的原理是什么?

我们看到的任何颜色的物体,其实都是没有颜色的,是包含了各种颜色的光线,照射到物体的表面,例如青瓜之所以绿色,是因为它把太阳光里面的其他颜色都吸收了,就是绿色无法吸收,就反射到你的眼睛里,让你看到是绿色。

对色彩的认知和配色的技巧,对于大部分人来说,都是靠天生的色彩感知和后天的环境影响,天生的感知来自眼球对色彩的敏锐度,大部分人都非常接近,甚至是一模一样,但是后天环境的影响就大不同了。

例如,黄袍,是中国历代皇朝,只有皇帝才可以穿的衣服,普通老百姓是不可以穿黄色衣服的,不然就是一死!

但是谁想得到,在遥远的叙利亚,黄色居然是代表着死亡,这就很尴尬!

不知道古代的中国有没有和那么遥远的国度有所邦交,如果有,估计有点文化冲突的尴尬了。

开始今天的内容,

绿色!

这几年,我们听得到最多的绿色在哪儿?

如果经常看视频,我们应该知道,就是关于古天乐。

绿了绿了,古天乐绿了。。。。

不知道这个游戏厂商什么目的,但是为了眼球,的确无所不用其极,可怜的天乐哥哥被黑了一道。

但是无论怎么黑,绿色始终使我们最喜欢的颜色之一,而且每天一定都会大量看到(起早贪黑的同学们就看得少一些)

看图,先了解一下我们对绿色的认知!

我把色彩分成2个纬度,一个是大自然中的,一个是社会意识中的。

为什么这样分?

由于这个星球上的大部分植物都是绿色,所以我们长年累月总结出来绿色就是代表着生命,生生不息。这里可能你要抬杠一下,动物也是生命啊,但是为什么它们不是绿色,这位同学,工地就缺你这种人才。

动物什么颜色的都有,它们是无法形成统一印象的,所以为什么做设计的时候,我们要善于总结规律才可以更好地去利用它们呢?

也是因为植被绿色的这个大自然共识,所以经常都会被人类社会用来表达一些比较舒适的感念,例如安全,同意等等。。

在社会认知的层面,我们举一个经典的案例。

大陆的股票上涨是红色的,下跌是绿色的。

但是香港和国际接轨,红色是下跌,绿色才是涨。

所以这个是严重的认知对立,所以说你的股票绿了,可能是恭喜你呢!

看看上面的那些词,基本上都是正面的,积极的意义。

绿色在黄色与蓝色(冷暖)之间,它是一种中性色,可寒可暖,因此绿色的性格最为平和、安稳、大度。

绿色具有自然属性,因此常常被用在健康、自然的相关行业。绿色可以让食物看起来新鲜和环保,而工业设备如果涂上绿色,则会让人感觉安全。

当一想到绿色,大多数人会想到户外和植物,因此它能让人感到放松。在阅读的时候,由于绿色的平和性,它能有效降低视觉疲劳度。

正是基于这些特性,绿色被设计师们广泛应用在各种设计中。

接下来,不说废话,

说下怎么用好绿色来做设计!

而它们的大致属性,是这样的。

01.浅绿色

属于高明度+低纯度的绿色。

浅绿色的表现和属性:

顺便告诉一下你,这个色彩在哪儿取。

正面情绪:

浅绿色在视觉上显现柔和舒适的感受,非常的小清新,很容易让人联想到雨后的嫩芽,充满希望与生命力。

负面情绪:

脆弱,无力。

美食

浅绿色的清新与自然属性,能让食物看起来非常的新鲜与可口。

但是,绿色也是不成熟的感觉,比如表达酸味,也可以用绿色,所以你看到很多酸笋的包装都是绿色。

美妆

浅绿色与柠檬黄会让画面显得清新自然。这让图中的化妆品显现出中性化,男女皆宜。

而且绿色的香水包装,基本上都是很清新的味道,不会是浓香型的。

环保

绿色的产品与设备,能给人传递出材料上的原生态,与功能上低碳环保的理念。

尽量不要做出这种来。。。

家居

低饱合度的浅绿色是家居产品设计中最常用到的颜色之一,它会让人感受到家所带来的平静与舒适。

户外

绿色与天蓝色是大自然中最多的颜色,它们象征着生机与活力,很适合户外相关主题。

海报

绿色虽然是蓝和黄的中间色,但它却是存在感很强的颜色。不同的配色方案能使它呈现出清新淡雅,也可以变得浓妆艳抹。完全不同担心它无法引起关注。

注意!

浅绿色系有优雅、休息、安全、和睦、宁静、柔和的感觉。添加微小的渐变效果更能加深这种印象。但页面配色上浅色过多时,整个网页容易呈现发"灰"的感受,这就需要适量的添加纯度稍高的颜色来辅助色绿色块,适当的鲜艳的点睛都能很好的解决这一问题。

说那么多

咱们来操。。。。作一个。

就做一个香水的官网吧!

香奈儿的这个香水。放心啦,不贵的!

step1:

构建网站的主框架,

根据产品的特性,

选择了小巧精致的网站框架。

step2:

增加画面种的产品和环境的光影效果,

简单的排版文字,

词是网站是单色调的,

略显苍白。

需要再增加点细节来衬托它。

step3:

duang~

增加点和属性匹配的鲜花绿色,

整个画面马上生机勃勃了!

香水的味道估计你都可以闻到了。

增加点娇花,果然很不一样对吧!

完善一下下面部分,

要注意风格的统一,

无论是色调,

还是元素,

还是排版,

字体等等,

都必须一致。

完整版本看一看!

不要因为我是阿门而吝啬对我的赞美,

老铁,赶紧双击666好吗?

好了,这一部分完整,我们讲下一part!

02.纯绿色

属于高明度+高纯度的绿色。

纯绿色的表现和属性:

正面情绪:

纯绿色给人朝气蓬勃的感觉,它象征一种生命力,这是其它所有颜色所不能比拟的。

负面情绪:

邪恶,诡异。

美食

纯绿色能很好表现出食物原本的质感,展现出食物清爽、

原生态的一面。加入暖色对比,会大大增加食物的美味感。

运动

绿色不像红色那样充满激情与力量,绿色很容易让人联想到草地、户外,是给人去野、去嗨的感觉。

从上图1,你可以知道,单纯的一个颜色,无论层次多么丰富,都是无法让画面有强大的力量感的,所以图1加入了一个紫红色的按钮,另外导航的黑色也会让画面增加力量的。

广告

绿色虽然是中性色,但是它的存在感却是十分强,很抢眼球。适当加入蓝色或黄色点缀,可让画面生动而强烈,用在海报和广告上非常合适。

海报

很正的纯绿色其实是一种让人不适的颜色,单独使用来表现食物会让人很没食欲,但是放在一些特定的主题上,反而能给人深刻的印象,个性十足。

注意!

虽说绿色是一种让人感到舒适的颜色,但是100%的高饱合度纯绿色的使用却需要谨慎,它会让人产生一些负面情绪,除非是特定主题。

在实际的设计中我们可以适当降低饱合度,在纯绿色中加入蓝色或者黄色,都能有不错的效果。

我知道大家一定对红配绿很感兴趣,所以这里说一下,红配绿本身是不难看的,但是一定要注意配色的技巧。

灾难式的红绿配色结果。

同学们啊!红配绿一定要讲规矩!

规矩一,红色配绿色,一定要加入无感情的中性色!!!

也就是黑白灰,不然就是灾难。

规矩二,一定要控制好比例!!!!!!!

(不要穿太绿的绿色啊,纯度降低少许会舒服很多)

就是我刚刚说到的,不要使用过于色相过于窄的配色方案,不然画面很单调和无力。

又到了案例时间!

来做一个啤酒广告!

step1:

先给它定一个色调。

也寻找一下版式的可能性。

step2:

好,决定做一个左右排版的版式。

为了体现啤酒的细节,

使用裁剪和局部特写的手法。

step3:

背景如何是单色,

那就太单调了。

所以在左上角给它添加点颜色,

这个渐变色可以让画面的前后感出来。

step4:

因为画面体现的是背部来光,

那么产品就要做匹配的光影调整了。

增加一些边缘高光。

step5:

基调什么都OK了,

那么就是排版上的细节的事了。

要正对产品属性去选择字体等。

step6:

duang~~~

增加点细节,

完事了!

回顾一下,各位老铁要记得,要让画面丰富,不一定是增加很多颜色进去,而是利用微小的色彩调整,让它整体和谐中带有点可意会不可言传的变化。

走,下一波。

03.深绿色

属于高明度+低纯度的绿色。

浅绿色的表现和属性:

正面情绪:

深绿色看起来茂盛,具有很强的生命力。

负面情绪:

沉闷,压抑。

美食

深绿色看起来很成熟,用在美食上会让人感觉食材的选取非常讲究,口感细腻而丰富。

美妆

深绿色适合用在那些高档、偏成熟用户群的化妆品产品上,细腻的色彩层次能很好的突出产品质地。

运动

深绿色有点点邪恶感,这点比较契合竞技体育中运动员那种不顾一切的求胜欲。

中国风

偏灰的深绿色有着浓浓的中国风,这种青色是古人常用的颜色之一,并且有着美好的寓意,比如说“平步青云”。

游戏

有些游戏中,会设置一些偏向邪恶的角色设定,为什么?多玩几款游戏你就会明白。

海报

深绿色刚刚说了容易邪恶,那么需要加入一些搞怪的元素,才可以削弱它的邪恶感。

注意!

深绿色是一种比较厚重的颜色,过高的饱合度会让它显得很不自然,当把它设定为主色调时,最好是降低一些饱合度,这样可以呈现出原本的细腻与典雅。

继续做一个吃的!

素材,就是2个不同的抹茶。

step1:

老规矩,

先大致定一下版式。

step2:

添加一下纹理,

这样画面才会又更好的质感。

下面那个竹席,可以理解为纹理,

也可以理解为画面素材,

是2者的结合体,

作用也是2者皆有。

step3:

画面合成的最重要一步,

那就是光影的统一。

增加光影之后,

画面的立体感马上出来了。

step4:

增加文字上和细节上的排版。

因为是日式的产品,

所以我采用了竖排版,

呼应主题。

step5:

增加点细节,让画面丰富。

但是注意,不可以因此而乱掉了画面。

step6:

最后一步,

把刚刚增加的细节,

暗化处理,

这样它们就不会抢了主角的戏份了!

duang~~~~



诚邀设计同行分享干货、文章、报告等
投稿请发邮件 leo@gewuer.com
新闻报道及人物专访 13153262
0   2742

文章评论(0)

发 表