designer-review-color-orange-1

@飞屋睿UIdesign :昨天说了色彩系列的红色,今天继续聊聊橙色。这篇文章是在看了李正贤的《WOW!不一样的配色设计》一书的部分摘录和读书笔记,除了色彩基础知识科普,也会有对应的网页案例分析,非常适合新手学习。

2016年流行色:《2016流行色彩!如何在设计中运用潘通年度代表色?(附优秀案例)》

红色篇:《设计师的读书笔记!带你重新全面认识色彩系列之红色篇》

前言

与临近的红色和黄色相比,橙色看起来似乎不像它们那样特别。它经常被认为是一种介于红色和黄色之间的暧昧的色彩。

每种颜色都会有某种情感偏向,但是橙色的情感确是非常暧昧的,它游离在红色和黄色之间,作为暖色而存在。因此,一种暧昧的暖色的配色技巧必定有我们可以研究的地方。

简述

橙色的本身所具有的这种暧昧感使得它比红色更加温和,比黄色更加老练,即它有一种中性的魅力。换句话说,它可以弥补红色和黄色的缺陷。因此,在各种商业设计中,橙色比红色和黄色应用得更为广泛。特别是在关于餐饮和商城方面的设计中,橙色被大量运用。而现在也有很多代表着“新生代”的这类创意机构也选择运用橙色表现他们的年轻活力。

一、色彩名称

还是让我们先看看橙色色系的各种色彩的名称,由此大家可以无限代入自己的想象。

朱砂色(Vermilion)

朱砂是一种在水银中可以和硫磺发生反应的人工颜料,是一种泛红色的鲜明的橙色。

胡萝卜色(Carrot Orange)

因胡萝卜皮的颜色而得名,是一种泛赤色的明亮的橙色。

橙色(Orange)

橙子表皮的颜色,是一种泛黄色的橙色。

玉米色(Maize)

玉米的颜色,是一种泛黄色的浅橙色。

杏黄色(Apricot)

也被称为浅橙色。

鲑鱼粉(Salmon pink)

也被叫做橙红色,因为与鲑鱼的颜色类似,因此而得名。

贝壳粉(Shell Pink)

因为与贝壳内部的颜色相似而得名,是一种泛黄色的非常浅的粉色。

软木塞色(Cork)

与软木塞的颜色相似,是一种泛黄色的浅褐色。

琥珀色(Amber)

和琥珀的颜色相似的一种颜色,琥珀在亚洲和欧洲都非常地受欢迎,是一种泛黄的、有流动感的橙色。

肉桂色(Cinnamon)

与桂皮的颜色相似,是一种泛红色的浅褐色。

黄褐色(Bumt sienna)

这是一种氧化铁、黏土、沙子等混合在一起所形成的赭石色颜料,褐色中泛红色。

ifeiwutut57-12

咖啡棕(Coffee brown)

这是一种咖啡豆磨成粉的颜色,深褐色中泛黄色。

二、橙色的意象和表现方式

橙色的暧昧,让人觉得它比任何色彩都难以配色。它不如红色强烈,又不如黄色明亮,很容易被其他色彩抢了风头,最终导致整体配色的平淡乏味。

如果要用橙色作为点睛色,那么就要避免使用比橙色更抢眼的色彩。灰色常常用于与橙色进行搭配。但运用其他的颜色,适当降低透明度或饱和度,使之没有橙色抢眼,调节得当,也可以搭配出丰富生动的画面。例如相比橙色和红色的搭配,比红色色度更低的褐色和橙色的搭配更为协调。

源于自然的橙色意象

橙子:美味、食欲、爽口、维C、年轻、青少年、有趣……

树木(褐色):久远、自然、土地、年长、安静……

火:温暖、亲近、好动、友好……

源于社会的橙色意象

财富:吹嘘、奢侈、便宜货、空架子

万圣节:恶魔、喧嚣……

橙色洋溢着在红色中不易找到的积极能量可以让画面变得亲切,在表现活力的时候非常有用。但画面如果过多使用橙色,就会显得沉闷。

同属橙色系的色彩,实际上给人的印象是完全不同的。有富于年轻感的鲜明的橙色,也有具有复古感的偏褐色的橙色。

如果想要强调橙色的积极性的一面,可以选择泛黄色的橙色或者不太深的褐色,这些颜色比100%的橙色更能表现温暖亲切的感觉。

但是由于橙色本身很难找到偏冷的颜色(它的相邻色是红色和黄色,属于暖色系),因此为了使画面呈现出温暖的感觉,将所有配色都用暖色的话,容易使画面显得沉闷没有亮点。

所以,如果以泛黄的橙色作为主色,选择黑色或者灰色等冷色可以使整体画面更加协调。比如用深蓝代替黑色配色方法,可以给画面“降温”。

三、橙色的配色实例表现

一般来说,红色、蓝色是强烈厚重的色彩,黄色、淡绿色具有明亮的感觉,相比之下,橙色的感觉非常暧昧。因此,如果用橙色作为主色,至少需要一种强烈厚重的色彩和一种明亮的色彩与之搭配。

如下图中,用橙色作为主色,搭配黑白灰的无彩色的配色。一暗一亮,运用纯黑和纯白作为辅色,很好展示出了橙色的鲜明个性。

需要注意的是,如果以暧昧的橙色作为主色,就要和既不别扭又明亮强烈的色彩进行搭配。

如果你运用了橙色作为主色,与此同时运用也运用红色系和黄色系的色彩作为配色,由于这些色彩的温度都比较高,因此画面中应该有一定的冷色来“降温”,从而实现画面的平衡。如下图中大量运用了橙色和红色,因此有蓝色作为冷色进行平衡。

绿色系、蓝色系、紫色系是相对偏冷的色彩,在与橙色搭配的时候会使橙色更为显眼。比起橙色作为主色的选择,以冷色调作为主色、橙色作为点睛色的选择可以使橙色更抢眼,画面更有活力。

例如在这张宣传品的配色选择上,绿色元素铺满视线的时候,出现星点的橙色元素,让人联系到大自然里的果树和农场,这种对自然的取色和本身配色的规律也是不约而同。

有时候画面中会出现除橙色以外的其他颜色也作为点睛色,这样的安排会让画面更有活力,但这时需要注意的是点睛色之间的颜色协调。

如下图所示,橙色作为点睛色的同时,也会有黄色和蓝色也作为点睛色的运用,而整个画面在冷暖两种点睛色之间确实非常平衡的关系。而橙色和蓝色的对比色搭配带来的活泼感正是画面所需要的。

从这里我们可以看到,如果要选择和橙色搭配的黄色尽量不要使用太深的黄色,而应该运用比较淡的黄色。而如果是搭配红色,也应该尽量选择偏暗的红色。

例如下面的这幅GUCCI的香水海报,虽然颜色五彩缤纷,看起来却不显得凌乱。总体来说,其实也就是三种色系在相互搭配,蓝色系、红色系和黄色系。而橙色系的色彩就有朱红和贝壳粉。与此搭配的黄色的明度较高而纯度较低,显得比较淡,而为了对比,也有少量深红。这里的深红和蓝绿色系的出现给画面降温,而黄色和橙色又给画面升温,整个色温适中,因此整个搭配感觉非常协调。

后记

配色总的来说并没有定论,因为色彩包含的个人情感的层次太丰富,而这也是配色总是让人深究又始终没有定论。但总的来说,我们应该可以在众多优秀作品中找到一点关于色彩的蛛丝马迹。这还需要大家继续探索。

本系列相关文章:

《读书笔记:给你的色彩重命名——红色篇》

需要注意的是,如果以暧昧的橙色作为主色,就要和既不别扭又明亮强烈的色彩进行搭配。

如果你运用了橙色作为主色,与此同时运用也运用红色系和黄色系的色彩作为配色,由于这些色彩的温度都比较高,因此画面中应该有一定的冷色来“降温”,从而实现画面的平衡。如下图中大量运用了橙色和红色,因此有蓝色作为冷色进行平衡。

绿色系、蓝色系、紫色系是相对偏冷的色彩,在与橙色搭配的时候会使橙色更为显眼。比起橙色作为主色的选择,以冷色调作为主色、橙色作为点睛色的选择可以使橙色更抢眼,画面更有活力。

例如在这张宣传品的配色选择上,绿色元素铺满视线的时候,出现星点的橙色元素,让人联系到大自然里的果树和农场,这种对自然的取色和本身配色的规律也是不约而同。

有时候画面中会出现除橙色以外的其他颜色也作为点睛色,这样的安排会让画面更有活力,但这时需要注意的是点睛色之间的颜色协调。

如下图所示,橙色作为点睛色的同时,也会有黄色和蓝色也作为点睛色的运用,而整个画面在冷暖两种点睛色之间确实非常平衡的关系。而橙色和蓝色的对比色搭配带来的活泼感正是画面所需要的。

从这里我们可以看到,如果要选择和橙色搭配的黄色尽量不要使用太深的黄色,而应该运用比较淡的黄色。而如果是搭配红色,也应该尽量选择偏暗的红色。

例如下面的这幅GUCCI的香水海报,虽然颜色五彩缤纷,看起来却不显得凌乱。总体来说,其实也就是三种色系在相互搭配,蓝色系、红色系和黄色系。而橙色系的色彩就有朱红和贝壳粉。与此搭配的黄色的明度较高而纯度较低,显得比较淡,而为了对比,也有少量深红。这里的深红和蓝绿色系的出现给画面降温,而黄色和橙色又给画面升温,整个色温适中,因此整个搭配感觉非常协调。

后记

配色总的来说并没有定论,因为色彩包含的个人情感的层次太丰富,而这也是配色总是让人深究又始终没有定论。但总的来说,我们应该可以在众多优秀作品中找到一点关于色彩的蛛丝马迹。这还需要大家继续探索。

【技多不压身的设计师工资更高!】

  1. 平面设计:《超赞!设计师完全自学指南》
  2. 交互设计:《交互设计师修炼指南!教你从零开始成为优秀交互设计师》
  3. UI设计:《超实用新手指南!零基础如何自学UI设计?》
  4. 前端开发:《天猫高手来教你!零基础如何系统地学习前端开发?》
  5. 抠图技巧:《从菜鸟到高手!PHOTOSHOP抠图全方位攻略》
  6. 配色方案:《色彩搭配速成!3个实用方法帮你全面搞定配色》
  7. DPI指南:《基础知识学起来!为设计师量身打造的DPI指南》
  8. 交互设计自学路径图:《零基础入门!给非科班生的自学路径图之交互设计篇》

原文地址:ifeiwu
作者:@飞屋睿UIdesign

uisdc-ad-wechat

【优设网 原创文章 投稿邮箱:2650232288@qq.com】

================关于优设网================
“优设网uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量108万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com

点赞
收藏 34

发表评论 快来秀出你的观点

还可以输入 800 个字
 
 
载入中....
相关推荐
评论 收藏