色彩對于空間而言不僅是裝飾,
還能產(chǎn)生效應(yīng);
有情緒、溫度、尺度等變化,
合理選擇色彩搭配,
能讓設(shè)計(jì)效果事半功倍。
關(guān)于色彩今天我們一起來了解一下吧!
色彩由光引起,
而光又有其物理屬性。
三原色(紅、黃、藍(lán))是色彩構(gòu)成的基本要素,
將三原色以適當(dāng)比例混合,
可以得到各種不同的色彩。
色相、明度、純度稱為色彩三要素。
色彩三要素是色彩最基本的屬性,
是研究色彩的基礎(chǔ),
也是最重要的概念。
它們是研究色彩的基礎(chǔ)。
色彩構(gòu)成
先講一下關(guān)于色彩的最基本概念。
色相、明度、純度。
色相:
色彩的相貌,
有無彩色和有彩色之分,
無彩色包括黑、白、灰、金、銀。
有彩色是這5種之外的能夠比較確切地表示某種顏色色別的名稱,
比如紅,橙,黃,綠,藍(lán),紫為基本色相。
明度-色彩明暗變化。
色彩的明度是指色彩的明暗變化程度。
色環(huán)上最明亮的是黃色,
最暗的是紫色。
明暗的兩極是黑白,
那如何改變某種顏色的明度呢?
如果想要更亮可以加白,
白色越多會(huì)越亮,
同理,
想要變暗可以加黑色。
黑色越多越暗。
純度-色彩鮮艷程度,
也稱彩度、飽和度、鮮明度。
一般日常所見顏色種都會(huì)含有一定的灰度。
含灰色越多色彩純度比較低。
簡單來理解純度就是顏色的鮮艷程度。
如下面的兩張圖:
色彩效應(yīng)
情緒感:
色彩是有情緒的,
不同的色彩給人的感受是不一樣的,
冷色調(diào)/低明度/低純度的色彩帶來的是:
安靜、平靜的情緒。
(案例來自:天津_梅蘭工作室)
而暖色調(diào)/高明度/高純度帶來的是:
溫馨、愉悅、振奮的情緒,
所以可以根據(jù)空間的用途,
和想要表達(dá)的情緒來選擇顏色。
(案例來自:Biblioteca da Escola Umbrella)
溫度感,
色彩也是有溫度的,
常說的暖色,
冷色就來自色彩帶給人的溫度感。
溫暖的感覺,
暖色調(diào)大于冷色調(diào)。
(冷色調(diào)案例來自:Framestudio)
(暖色調(diào)案例來自:ARENAL_ARQ)
尺度感:
指的是大小的差別,
物理尺寸相同的物體,
不同的顏色給人的尺度感不一樣。
大家先感受一下,
下面兩張圖,
同款沙發(fā),
不同顏色的面料帶來的尺度感。
發(fā)現(xiàn)了嗎?
似乎白色的沙發(fā)更大哦。
這就是大家常說的穿黑色衣服顯瘦的原因。
關(guān)于尺度感,
高明度/高純度/暖色調(diào)>低明度/低純度/冷色調(diào)。
重量感:
顏色深顯重,
顏色淺顯輕。
看色彩會(huì)迷惑、欺騙我們的大腦的。
下圖相同大小,
相同材質(zhì)的兩把椅子,
是不是左邊的看起來更重一些呢?
其實(shí)只是顏色深一些而已。
這種重量,
我們也叫視覺重量。
離感:
在同一個(gè)畫面當(dāng)中,
低純度/冷色調(diào)的物體往后退;
高純度/暖色調(diào)的物體往前跳。
因此,
如果空間比較小,
想要空間變大,
可以選擇低純度冷色調(diào)為主。
空間本身就比較大的,
可以選顏色鮮艷一點(diǎn),
花紋豐富一點(diǎn),
顯得飽滿一點(diǎn),
不至于太空。
(案例來自:UPPER EAST SIDE RESIDENCE)
空間感:
低純度/高明度/冷色調(diào)/弱對比空間感強(qiáng);
高純度/低明度/暖色調(diào)/強(qiáng)對比空間感弱。
根據(jù)需求選擇就好。
(案例來自:Nicolas Schuybroek Architects)
(對比弱空間感強(qiáng))
(案例來自:aquazzurra)
(對比強(qiáng)空間感弱)
室內(nèi)配色方法
講配色方法,
先講一下空間中的色彩比例。
可以把整個(gè)空間想象成一幅畫;
墻、頂、地,
這些區(qū)域就是畫布的背景;
重點(diǎn)墻面造型,
和大型家具,
就是畫面的主體。
裝飾擺件、花卉、綠植等就是畫面中點(diǎn)綴部分。
(案例來自:IQOSA)
比例是:
背景占整體的60%,
采用低純度,
高明度的色彩。
主題占比30%,
采用中等純度,
中等明度的色彩。
點(diǎn)綴部分占10%,
采用高明度,高純度的色彩搭配。
這樣的配色比例基本不會(huì)出錯(cuò),
出來的效果也比較好。
當(dāng)然,
如果你的業(yè)主非常個(gè)性,
反其道而行也不是不可以的。
室內(nèi)配色種類
同色系配色。
選擇某一種色相,
利用純度和明度的變化,
來搭配空間,
這種叫同色系配色,
也叫單色系配色。
這種配色方法,
色彩比較單一,
層次不夠分明。
可以搭配一些無彩色。
(案例來自:aquazzurra)
鄰近色配色:
是指色相環(huán)中相距60度,
或者相隔三個(gè)位置以內(nèi)的兩色,
為鄰近色關(guān)系,
由于這個(gè)范疇內(nèi)的色相彼此近似,
冷暖性質(zhì)一致,
色調(diào)統(tǒng)一和諧、感情特性一致。
所以這種配色手法搭配出來比較和諧,
同時(shí)比單一色配色對比較強(qiáng),
屬于種對比效果,比較好把握。
(案例來自:aquazzurra)
對比色配色:
色相環(huán)上相距120度的兩種顏色,
稱為對比色,
這種顏色一般反差比較大,
對比強(qiáng)烈,
用種配色方式容易造成畫面不和諧,
那怎么辦呢?
其實(shí)調(diào)整顏色的比例就好了,
不要用5:5,
用7:3,
或者8:2,
就好很多。
(案例來自:Moustache)
互補(bǔ)色配色:
色相環(huán)中成180°角的兩種顏色,
比如紅色與綠色互補(bǔ),
藍(lán)色與橙色互補(bǔ),
黃色與紫色互補(bǔ)。
互補(bǔ)色,
形成強(qiáng)烈的對比效果。
畫面的平衡更難了,
那改怎么處理你,
除了上面講到的色彩比例外,
還可以改變純度。
這張圖藍(lán)橙色對比,
但是藍(lán)色的純度和明度都有調(diào)整,
整體看上去以橙色為主,
就和諧多啦!
這些設(shè)計(jì)方法大家感受到了嗎?
趕緊來試試吧。
《色彩設(shè)計(jì)基礎(chǔ)知識(shí)整理》
基礎(chǔ)概念
色彩設(shè)計(jì)的使用場景:
產(chǎn)品設(shè)計(jì):工業(yè)設(shè)計(jì)、UI設(shè)計(jì)、書籍報(bào)刊設(shè)計(jì)等。重點(diǎn)在于品牌印象,清晰、舒適、耐看。誘目性低,可以長時(shí)間凝視而不會(huì)疲勞。
運(yùn)營/推廣設(shè)計(jì):海報(bào)、廣告、招貼等形式。重點(diǎn)在于氛圍營造,吸睛、具有較強(qiáng)的表現(xiàn)力。誘目性高,瞬間吸引人的注意力。
配色設(shè)計(jì)的目的:
區(qū)分層次;渲染氛圍;強(qiáng)化主題;關(guān)聯(lián)傳達(dá)品牌特性;
色彩的組成:
H(hues)色相:紅、黃、藍(lán)等色彩的種類;
○:心理四原色(赤?黃?緑?青)▲:色材の三原色(C?M?Y)△:色光の三原色(R?G?B)
色相會(huì)具有一定的偏向性,如偏藍(lán)色的綠色/偏黃色的綠色,在與其他顏色搭配師,不同的偏向性會(huì)產(chǎn)生不同的效果。
S(saturation)純度/飽和度:色彩的鮮明程度,為0時(shí)為灰色;
色彩飽和度與心理印象
B(brightness)明度/亮度:色彩的明亮程度,為0時(shí)為黑色;
明度與純度
色彩模式:
RGB:紅、綠、藍(lán);加色混合(混到一起成為白色),屏幕所用色彩表現(xiàn)方式。
CMYK:青、品紅、黃、黑;減色混合(混到一起成為黑色),印刷所用的色彩模式
CMYK 和 RGB 這兩種色彩模式本質(zhì)與區(qū)別在哪?
pccs(日本色研配色體系:Practical Color Co-ordinate System)
色調(diào)系列:色彩的不同明度和純度的組合。不同的色調(diào)會(huì)給人留下不同的心理印象。
PCCS
淡色調(diào)(P)
淡色調(diào)
心理印象:溫柔、夢幻、輕盈、輕、淡、淺,多用于化妝品、嬰兒用品等。
淺色調(diào)(LT)
淺色調(diào)
心理印象:清爽、輕松、明快、輕、淡、淺,多用于化妝品、兒童用品等。
淺灰色調(diào)(LTG)
淺灰色調(diào)
心理印象:素雅、溫柔、消極、成熟、雅致。
輕柔色調(diào)(SF)
輕柔色調(diào)
心理印象:質(zhì)樸、消極、平和、成熟。
明亮色調(diào)(B)
明亮色調(diào)
心理印象:輕快、活潑、童真。多用于兒童用品。
強(qiáng)烈色調(diào)(S)
強(qiáng)烈色調(diào)
心理印象:強(qiáng)烈、有深度、充滿熱情的印象。
鮮艷色調(diào)(V)
鮮艷色調(diào)
心理印象:華麗、熱鬧、刺激、鮮明。
灰色調(diào)(G)
灰色調(diào)
心理印象:資深、沉穩(wěn)、厚重、成熟、含蓄、保守、消極。
濁色調(diào)(D)
濁色調(diào)
心理印象:鈍化、厚重、質(zhì)樸、穩(wěn)重、高級(jí)。
深色調(diào)(DP)
深色調(diào)
心理印象:沉著、干練、穩(wěn)重。
暗灰色調(diào)(DKG)
暗灰色調(diào)
心理印象:穩(wěn)重、沉悶、質(zhì)樸、厚重。
暗色調(diào)(DK)
暗色調(diào)
心理印象:厚重、陰暗、穩(wěn)重、質(zhì)樸。
色彩的心理印象:
暖色:紅、黃、橙等,讓人聯(lián)想到火焰、溫暖的太陽等比較溫暖的事物;
冷色:藍(lán)色、綠色、紫色等,讓人聯(lián)想到冰、雪等比較涼爽的事物;
前進(jìn)色:看著比實(shí)際上離自己近,膨脹色,一般是暖色,偏白的顏色;
后退色:看著比實(shí)際上離自己遠(yuǎn),收縮色,一般是冷色,黑色等;
膨脹色:暖色、明度較高的顏色,讓物體看起來感覺比實(shí)際更大;
收縮色:冷色、明度較低的顏色,讓物體看起來感覺比實(shí)際更??;
色彩的重量感:黑色比白色顯得更重,更牢固。明度越低,顯得越有重量。反之,顯得越輕。
不同色調(diào)的心理印象:
色彩搭配的流程
確定主題與用戶
首先需要明確設(shè)計(jì)的目的是什么、內(nèi)容是什么、受眾是誰。
設(shè)計(jì)是解決問題的一種方式,了解產(chǎn)品的形象、用戶的角色,可以明確整體所要表現(xiàn)的風(fēng)格氣質(zhì),明確我們要解決的問題以及解決問題的思路與方向。如考慮不同年齡、不同性別、不同層次用戶對于色彩的偏好。孩童一般喜歡明度和純度比較高的色彩;老年人一般喜歡明度和純度都較低的色彩。這樣在選取顏色的時(shí)候才會(huì)有方向、有目標(biāo)。
了解設(shè)計(jì)的內(nèi)容可以關(guān)注技術(shù)的限制、觀看距離的遠(yuǎn)近以及周圍環(huán)境的影響。如平面設(shè)計(jì)一般采用cmyk模式,UI設(shè)計(jì)一般采用rgb模式。觀看距離較遠(yuǎn)時(shí),需要較強(qiáng)的對比度,增加識(shí)別性;反之,距離較近時(shí)需要更加柔和,讓觀者的眼睛不會(huì)疲勞。而夜晚模式的使用更是對于光線不足時(shí)的一種反應(yīng)。就環(huán)境影響而言,如果產(chǎn)品周圍的物體、產(chǎn)品等顏色比較花哨、豐富,那么選用簡單、無彩色的配色會(huì)更加容易從中凸顯。
確定主色
主色調(diào)選取,一般是品牌的主打色,同時(shí)需要與所要傳達(dá)的主題氣質(zhì)相符合。主色所占的比例一般會(huì)比較大,對整體風(fēng)格起到一個(gè)主導(dǎo)作用。
對于公司內(nèi)部的產(chǎn)品,一般考慮公司的品牌色。對于新的、toC的產(chǎn)品,可以使用情景版的方式來確定主色。或者使用行業(yè)/客戶特定的色彩,如針對中國電網(wǎng)設(shè)計(jì)產(chǎn)品,考慮使用其綠色作為主色。
確定輔色、背景色、強(qiáng)調(diào)色
主色確定之后,單色配色一般是在色彩的明度、純度上發(fā)生變化,并且加上黑白灰等無彩色來形成配色方案。雙色配色可以考慮類似色、對比色、互補(bǔ)色等配色方式,一般而言,與主色在明度和純度上的差異不會(huì)太大。多色配色可以考慮三角形、四邊形、五邊形的配色方式。
色彩的對比強(qiáng)度,可以是色相、明度、純度任一方面。需要依據(jù)整體的感覺、氣質(zhì)需要來選取和調(diào)整。激烈、熱鬧的氛圍需要比較大的對比度,柔和、安靜的氛圍需要不太強(qiáng)的對比。
色彩的冷暖感:如果都選用冷色或者暖色,整個(gè)畫面就會(huì)偏冷或偏暖。除非有特殊的主題需求,一般多色配色時(shí),會(huì)需要在全是冷色的顏色中加入暖色,或者在全是暖色的顏色中加入冷色來點(diǎn)綴與平衡畫面的冷暖感。
色彩的明暗:色彩的明暗就像是畫面的光影,有高光、有陰影物體才會(huì)有體積感。同樣,顏色的明暗對比讓畫面具有層次感與縱深感。同時(shí),全是亮色會(huì)顯得浮躁,全是暗色會(huì)顯得沉悶。
優(yōu)化細(xì)節(jié)
色彩之間的呼應(yīng):整個(gè)畫面之間的顏色并不是割裂的,這里一塊那里一塊獨(dú)立存在。而是在元素之間穿插錯(cuò)落。色彩的呼應(yīng)會(huì)讓整體感更加明顯,也更容易讓畫面變得和諧。
色彩的面積:主色與輔色所占的面積大小一般會(huì)有所差異,形成對比。常見的比例有7:2:1,。整體的感覺與印象是不同面積色彩感覺之間拉扯的結(jié)果。
環(huán)境色/光源色的影響:高光與陰影的顏色會(huì)受到環(huán)境色的影響,如黃色燈光下的物體,高光會(huì)偏黃色;藍(lán)色背景上的物體,其陰影也會(huì)偏藍(lán)色。在對元素填色時(shí),需要考慮環(huán)境色/光源色的影響,在基礎(chǔ)色的色相上偏向光源色或者多層疊加顏色來讓整體細(xì)節(jié)更豐富、更有質(zhì)感。
色彩搭配的方法理論
方法一(色彩九宮格):
取色板的右上角頂點(diǎn)為某一色相的純色。水平往左,是逐漸加入白色的過程,顏色純度逐漸降低;垂直往下,是逐漸加入黑色的過程,顏色明度逐漸降低。將取色板均等分為9個(gè)區(qū)域。每個(gè)區(qū)域的顏色會(huì)給人不同的感覺。與pccs的色調(diào)劃分方式有些類似,在設(shè)計(jì)軟件中選取顏色時(shí)運(yùn)用比較方便。
色彩九宮格
色彩九宮格與給人的心理印象
1號(hào)區(qū)域-淡色調(diào)
1號(hào)區(qū)域-淡色調(diào)
心理印象:高明度低純度,溫柔、輕盈、夢幻、素雅、
2號(hào)區(qū)域-明色調(diào)
2號(hào)區(qū)域-明色調(diào)
心理印象:高明度中等純度,清爽、明亮、活潑、可愛。多用于兒童用品等。
3號(hào)區(qū)域-純色調(diào)
3號(hào)區(qū)域-純色調(diào)
心理印象:高明度高純度,鮮艷、刺激、熱鬧、華麗、年輕化、沖擊力強(qiáng)。多用于廣告、海報(bào)等運(yùn)營類設(shè)計(jì)。
4號(hào)區(qū)域-淡濁色調(diào)
4號(hào)區(qū)域-淡濁色調(diào)
心理印象:中等明度低純度,素雅、格調(diào)、安靜、樸實(shí)、舒適、平和。高級(jí)灰、莫蘭迪色。
5號(hào)區(qū)域-濁色調(diào)
5號(hào)區(qū)域-濁色調(diào)
心理印象:中等明度中等純度,堅(jiān)定、質(zhì)樸、安靜、高級(jí)。
6號(hào)區(qū)域-暗色調(diào)
6號(hào)區(qū)域-暗色調(diào)
心理印象:中等明度高純度,沉悶、成熟、沉穩(wěn)
7-8-9區(qū)域-黑暗色調(diào)
7-8-9號(hào)區(qū)域-黑暗色調(diào)
心理印象:低明度,危險(xiǎn)、高檔、暗沉、厚重、陰暗
此區(qū)域的顏色,有人視為色彩禁區(qū)。顏色顯臟不好搭配。當(dāng)需要純黑色的替代色時(shí),可以考慮選取這幾個(gè)區(qū)域的顏色,色彩可以偏向于主色的色相或者與主色協(xié)調(diào)的色相。
九宮格配色的使用技巧:比較簡單的方式是選擇同一區(qū)塊的顏色,在色相上產(chǎn)生變化。在多色配色的情況下可以取得較好的效果。也可以考慮明度與色彩的重量感,選用亮與暗、輕與重的顏色協(xié)調(diào)。
方法二:
色相一致的配色
各個(gè)色彩色相保持一致或者接近,通過明度或純度變化來產(chǎn)生差異。
色相一致的配色
明度一致的配色
各個(gè)色彩明度保持一致或者接近,不會(huì)產(chǎn)生強(qiáng)烈對比感,整體會(huì)顯得比較均衡。
明度一致的配色
純度一致的配色
各個(gè)色彩純度保持一致或者接近,純度越高,刺激性越強(qiáng),純度越低,越顯得沉穩(wěn);
純度一致的配色
方法三:
同色系配色
同色系配色
色相不變,在純度與明度上產(chǎn)生變化,形成配色方案。單色系配色,比較容易做出效果。
鄰近色/類似色配色
鄰近色配色
色相跨度較小,容易形成比較清晰一致、意圖明顯的的效果。
中差色配色
中差色配色
色相環(huán)上顏色位置呈90°,具有一定的對比但不是太強(qiáng)烈,高級(jí)、華麗、干練。
對比色/互補(bǔ)色配色
對比色配色
色相環(huán)上二者成180°,對比強(qiáng)烈,容易形成炫光效果,一般會(huì)使用面積差異或者明度差異來讓頁面更加穩(wěn)定。
三角形配色
三角形配色
色相環(huán)上顏色呈三角形,對比較為強(qiáng)烈、穩(wěn)定。
四邊形配色
四邊形配色
色相環(huán)上顏色呈四邊形,有一定的對比,色彩數(shù)量比較豐富。
五邊形配色
五邊形配色
以五邊形的方式從色環(huán)選取顏色,色相之間的對比比較均衡。色彩數(shù)量豐富,熱鬧、活潑。
其余:
從自然中獲取配色 :
選取自然風(fēng)光的照片,進(jìn)行馬賽克處理,選取其中的顏色作為配色方案。
選擇與主體一致的顏色:
設(shè)計(jì)材料中有一些必須加入畫面的圖片、圖案等,可以在其中吸取顏色,作為字體、裝飾元素的顏色。讓整個(gè)畫面更加協(xié)調(diào)。
插入間隔色:
主體與背景色、輔色等產(chǎn)生沖突時(shí),可以在二者中間插入間隔色,進(jìn)行一個(gè)區(qū)分、緩沖與過渡的作用。間隔色一般為無彩色或者濁色調(diào)色彩。
漸變:
采用色調(diào)一致的顏色,通過色調(diào)來形成不同的氛圍。
·同類色漸變:柔和、輕微、細(xì)膩。具有柔和的光影感。
同類色漸變
·鄰近色漸變:時(shí)尚、耐看、活躍
鄰近色漸變
·互補(bǔ)色/對比色漸變:沖擊力、吸引眼球、時(shí)尚。
對比色漸變
其余需要注意的事項(xiàng)
先確定版式,再選擇配色。
色彩的數(shù)量與協(xié)調(diào):
有彩色的數(shù)量較多,容易形成熱鬧、絢麗的氛圍。但是顏色數(shù)量越多,協(xié)調(diào)起來越難。色彩數(shù)量較少會(huì)比較有力量感,給人感覺更加堅(jiān)定、方向明確;
可以在明度或純度上保持相似性。也可以加入無彩色作為區(qū)分、過渡。或者將某一種顏色用在所有元素上,讓整體更加統(tǒng)一。
多色配色:
色相、純度、明度等至少要有一個(gè)保持一致或接近。如多色相的(色彩種類較多)時(shí),應(yīng)該保持各色彩的純度和明度至少一個(gè)差別不大。要是都差別很大,則容易不協(xié)調(diào)??梢詫⑵渲幸粋€(gè)顏色的明度或純度提高,進(jìn)行有意凸顯與強(qiáng)調(diào)。
多色配色也要講究顏色之間的呼應(yīng),如某些細(xì)節(jié)部分顏色與大面積色彩保持一致,而非一個(gè)顏色占據(jù)一塊。
多色配色時(shí),顏色之間的比例也需要權(quán)衡。比較均衡時(shí),整體比較熱鬧。主次分明時(shí),與大面積色的感覺更靠近。
疊加模式:
通過不同的疊加模式(柔光、疊加、顏色加深等),讓圖片或者色彩之間融合更加自然。
聯(lián)系客服