在網(wǎng)上看了很多配色文章,還是沒有進(jìn)步。
因?yàn)槲铱吹降娜羌t色代表熱血、活力;藍(lán)色代表科技、未來;綠色代表健康等等,還有紅藍(lán)對(duì)比色,紅橙鄰近色等等。
這些理論有用嗎?答案是肯定的,有用。但是我覺得看一兩遍,心里有數(shù)就可以了,如果天天看這種,你的配色潛力就會(huì)被困在體內(nèi),憋的難受。
近期請(qǐng)教了一些同事、朋友關(guān)于配色的方法,再加上自己的實(shí)踐,總結(jié)一下,分享幾個(gè)接地氣的、實(shí)操性比較強(qiáng)的技巧。大綱如下:
1. 顏色模式的選取
顏色模式就是記錄顏色的一種方式,分為很多種:RGB 模式、CMYK 模式、HSB 模式、Lab 顏色模式、位圖模式、灰度模式、索引顏色模式……
而我最常用的就是 HSB 模式,因?yàn)樗?jiǎn)單直觀,容易控制。
HSB 中的 H 代表色相、S 代表飽和度、B 代表明度。
H(色相)一共 360 個(gè),因?yàn)樯P一圈是 360 度,一度一個(gè)色相。
而千變?nèi)f化的顏色都是由于 S(飽和度)和 B(明度)的不同產(chǎn)生的。
為什么說 HSB 模式簡(jiǎn)單直觀,容易控制呢?
比如說我們隨意選三個(gè)色相,360、23、280:
我們可以輕易地分辨出中間的顏色和其他兩個(gè)相比,飽和度與明度有所不同,數(shù)值如下:
而這時(shí),我們只要降低中間顏色的 S,提高它的 B,就可以使三個(gè)顏色和諧很多:
這就是我說 HSB 模式簡(jiǎn)單易懂,容易控制的原因。
2. 調(diào)色板位置的原理
選取了常用模式之后,我們需要對(duì)每個(gè)單色色板原理有所了解,我個(gè)人喜歡這樣去理解這個(gè)色板(僅供參考)。首先右上角的那個(gè)紅點(diǎn)處是每個(gè)色相最純的色值,水平往左滑動(dòng)是在顏色中加入白色,加入越多的白色,顏色越亮越輕;垂直往下滑動(dòng)是在顏色中加入黑色,加入越多的黑色,顏色越暗越重。
當(dāng)顏色往左下角滑動(dòng)的時(shí)候,既加入了白色也加入了黑色,也就是灰色。
按照這樣的規(guī)律,我舉個(gè)例子,如果覺得顏色太濃,太重,比如下面這張圖的背景紅色:
相當(dāng)之辣眼睛,此時(shí)就可以將顏色橫向往左滑動(dòng),加入白色,讓顏色更輕,與整體圖標(biāo)搭配更和諧:
3. 顏色「禁區(qū)」盡量不碰
當(dāng)然,這里的「禁區(qū)」是帶雙引號(hào)的,沒有什么絕對(duì)的禁區(qū),只是說顏色不易控制,在連基礎(chǔ)色都沒有駕馭好之前,盡量少碰。
咨詢很多人后發(fā)現(xiàn),他們?cè)谟蒙臅r(shí)候是有禁區(qū)的,不同的人有不同的說法,我將其大概分為這三種:三角形禁區(qū)、矩形禁區(qū)、扇形禁區(qū)(紅色為禁區(qū)),如下圖:
其實(shí)不難發(fā)現(xiàn),不論是哪種,基本右下角方向的顏色是很少用的,因?yàn)樗鼈冇譂庥峙K,很難把控(當(dāng)然不排除有些大師任何顏色都是可以駕馭的)。
這里舉個(gè)例子,下面這張圖是我在 C4D 里面渲染的一個(gè)鈴鐺,暗部的地方看起來過黑,不夠通透,其實(shí)就是因?yàn)榘挡砍霈F(xiàn)了禁區(qū)的顏色:
我們將暗部顏色調(diào)整至非禁區(qū)顏色:
來看下實(shí)際效果:
這樣就會(huì)使整個(gè)鈴鐺配色舒服很多。
4. 疊加模式要用好
很多時(shí)候我們?cè)谧鲆恍┰O(shè)計(jì)的時(shí)候,害怕底色過于單調(diào)而選擇疊加一張底圖,以前我很少使用顏色的疊加模式,最多就用下正片疊底,而在把圖片嵌入淺色底色的時(shí)候,我一般都是將圖片的透明度直接降低,如下圖:
這樣就會(huì)使整個(gè)畫面變得很臟,后來發(fā)現(xiàn)原來很多疊加模式這么好用,比如「柔光」、「變亮」等等。我將下圖模式改為柔光,一對(duì)比就干凈很多了。
再加上點(diǎn)排版,封面就有了:
更多模式大家可以多多嘗試,在不同場(chǎng)景下選用最適合自己的那個(gè)模式。(當(dāng)然在用多色的時(shí)候一樣可以使用顏色疊加)
關(guān)于雙色,我主要想分享一下對(duì)于雙色漸變(線性)的認(rèn)知與理解。
單從色相來看,雙色漸變可以大致分為三種:小、中、大。
1.「小」?jié)u變
「小」?jié)u變就是在色環(huán)上,小于 30 度的兩個(gè)色相之間的漸變,專業(yè)術(shù)語就是同類色漸變:
這種漸變色跨度變化很小,看起來就像是一種顏色的深淺變化(但其實(shí)會(huì)略微有一點(diǎn)色相的變化),比較保守,容易控制,實(shí)用頻率很高,比如啟動(dòng)圖標(biāo)、按鈕、個(gè)人中心背景色等等。
2.「中」?jié)u變
「中」?jié)u變?cè)谏h(huán)上大于 30 度且小于 60 度,專業(yè)術(shù)語叫鄰近色漸變:
這種漸變,在色相上有很細(xì)膩的變化,看起來更加時(shí)尚耐看,比如綠里加點(diǎn)黃:
藍(lán)里加點(diǎn)紫:
有很多啟動(dòng)頁都使用這種漸變方式,因?yàn)檫@里不用太拘謹(jǐn),可以適當(dāng)放開一些:
3.「大」?jié)u變
「大」?jié)u變?cè)谏h(huán)上大于 60 度,也可叫撞色漸變(互補(bǔ)色或者對(duì)比色):
這種漸變視覺沖擊力很強(qiáng),一般來說產(chǎn)品界面里面很少用到。為什么呢?因?yàn)橐曈X沖擊力強(qiáng)是為了吸引眼球,而產(chǎn)品界面主要以內(nèi)容為主,背景或元素太過搶眼反倒喧賓奪主。
反過來說那些宣傳類海報(bào)、文章封面、作品包裝等內(nèi)容確實(shí)可以做大膽一點(diǎn):
我自己也是在文章封面上用的比較多。
對(duì)于漸變,還有很多在同一色相的基礎(chǔ)上,利用不同飽和度、明度來實(shí)現(xiàn),但那不在雙色范圍,就不討論了。
1. 呼應(yīng)
對(duì)于多色,我并沒有太多話語權(quán),因?yàn)閭(gè)人確實(shí)使用的比較少,但是有一點(diǎn)很深的感悟就是對(duì)于多色,無論你使用鄰近色,還是對(duì)比色,最重要的是和諧,而和諧最重要的就是呼應(yīng)。
比如同樣是多色,這張圖就很怪異:
因?yàn)樗{(lán)色和黃色來的莫名其妙,沒有呼應(yīng)就會(huì)顯得格外突兀。
而下面這張就會(huì)舒服很多:
因?yàn)楸尘暗木G色、黃色,有眼鏡、擴(kuò)音器顏色的呼應(yīng)。
2. 取色原理
前期我們選色不能太憑感覺,要有一些簡(jiǎn)單的理論支撐,比如我想給自己建的藍(lán)胖子模型配個(gè)色:
藍(lán)胖子身體是藍(lán)色,而且鼻子有一點(diǎn)紅色,所以背景色就可以選取藍(lán)色的互補(bǔ)色──紅色,再由紅色選取個(gè)鄰近色──黃色:
最后由這三個(gè)顏色組合成畫面:
再比如,由一個(gè)顏色選個(gè)鄰近色,再選個(gè)同色系的深色:
其他那些小膠囊的點(diǎn)綴色只要明度和飽和度在一個(gè)調(diào)上,用什么色相都不會(huì)有太大的問題。
3. 顏色占比
對(duì)于占比,我個(gè)人的經(jīng)驗(yàn)就是可以先選一個(gè)主色,然后讓主色占很大的位置,這樣不管輔色再怎么不對(duì),有大面積的主色撐著,也不會(huì)出現(xiàn)太大問題。
把這種簡(jiǎn)單的配好,再擴(kuò)展復(fù)雜的形式。
總結(jié)
前期新手可以使用相對(duì)簡(jiǎn)單的配色,但一定要有理論支撐,養(yǎng)成有理有據(jù)的好思維與習(xí)慣,后面就能更得心應(yīng)手。
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任,
本站有權(quán)保留或刪除有爭(zhēng)議評(píng)論。
參與本評(píng)論即表明您已經(jīng)閱讀并接受
上述條款。