
色彩作為設(shè)計(jì)中不可或缺且獨(dú)立存在的一個(gè)分支,其對(duì)設(shè)計(jì)不僅有著視覺(jué)的影響,還可以以最直觀,最有力的視覺(jué)表現(xiàn)喚起特定的情緒或情感,促進(jìn)視覺(jué)和心理的雙重感知以實(shí)現(xiàn)設(shè)計(jì)所要表達(dá)的目的,可以說(shuō)色彩的搭配決定了設(shè)計(jì)成功與否的基礎(chǔ),而在很多情況下色彩的搭配則成了眾多設(shè)計(jì)師遇到的難題之一,本期文章將立足于色彩理論的基礎(chǔ)之上,對(duì)色彩的搭配和使用進(jìn)行贅述,在視覺(jué)設(shè)計(jì)中應(yīng)該怎么樣才能讓色彩看起來(lái)舒服一些;

色彩作為視覺(jué)感知的先覺(jué)條件,在很大程度上決定了作品的好壞以及給觀者留下什么樣的印象,人們最先感知到的即是通過(guò)色彩所傳遞出的情感,色彩作為一門獨(dú)立的學(xué)科,在基于其理論體系之上衍生出了眾多的搭配方法和技巧,在遵循色彩構(gòu)成的原理之上可以更好的幫助我們對(duì)色彩有深入的認(rèn)知和使用,對(duì)于色彩而言,除了要了解基本的構(gòu)成之外,在使用的過(guò)程中更重要的是要對(duì)色相,明度,飽和度有敏銳的觀察里和視覺(jué)感知力,通過(guò)三者不斷的變化和調(diào)整把控使色彩更加具有情感,讓視覺(jué)感知更加的舒適并滿足我們的實(shí)際的需求;

色相
色相的變化則是基于三原色的基礎(chǔ)上產(chǎn)生出來(lái)的色與色之間的關(guān)系,是決定色彩的基礎(chǔ),我們經(jīng)常說(shuō)的色彩搭配通常是指某個(gè)顏色與另一個(gè)顏色的色相搭配,其在色彩選擇和使用中起著決定性的作用,色相可以說(shuō)是色彩的選擇時(shí)的框架,同時(shí)也是情感和情緒單一且直觀的視覺(jué)感知體現(xiàn),是偏向理性的理論支撐;
明度和純度
則是基于色相之上的深淺和明暗變化,在色相的框架之內(nèi)可以利用明度和純度的變化營(yíng)造更加細(xì)膩的舒適效果,同時(shí)兩者也反應(yīng)出最終色相的舒適程度和搭配的效果優(yōu)劣,也是色彩細(xì)節(jié)的根本所在,其影響的直接結(jié)果就是即使在符合色彩原理的基礎(chǔ)上也未必能有舒適的視覺(jué)感知,更加偏向感性;

在同一個(gè)色相下,明度和純度的變化則是以縱向和和橫向的方式變化,兩者相交處則決定了最終色彩值,色彩的舒適與否很大程度上取決于明度和純度的交叉,色相包含明度和純度,但又取決于明度和純度,三者互為相依形成色彩三要素,明度和純度與無(wú)色的黑白同樣是神一樣的存在,至始至終貫穿整個(gè)色彩,同時(shí)也是色彩細(xì)節(jié)和視覺(jué)感知最有力的體現(xiàn),更是確定單個(gè)純色的最佳方式;

圖1:
當(dāng)一個(gè)畫面中出現(xiàn)兩個(gè)不同的色相時(shí),則需要在遵循三原色的原理上對(duì)其中一個(gè)色相的明度和純度進(jìn)行調(diào)整以達(dá)到視覺(jué)感知的舒適,在進(jìn)行色彩搭配的過(guò)程即是在確定色相之后以色相的深淺明暗進(jìn)行細(xì)微的調(diào)整使其色彩的情緒和情感表達(dá)能夠更加的準(zhǔn)確可視化,如只是調(diào)整不同的色相變化則會(huì)讓畫面不堪入目;
圖2:
而當(dāng)一個(gè)畫面只使用一個(gè)色相的時(shí)候,則是明度和純度發(fā)揮作用最大的時(shí)候,通過(guò)色相的深淺和明暗就可以完成一個(gè)不錯(cuò)的畫面,但就視覺(jué)設(shè)計(jì)而言,單一色相相對(duì)來(lái)說(shuō)則會(huì)比較局限,也很難滿足畫面中多種情緒細(xì)微的變化,而與左邊的圖相比之下,整個(gè)畫面則會(huì)顯得稍微亮了一些,同背景下不同的搭配傳遞出的視覺(jué)效果也有差別;

在遵循色彩搭配原理的基礎(chǔ)上,更加需要注重明度和純度的變化所傳遞出的視覺(jué)感知效果帶給人們的舒適度,而并非有理論支撐或者照搬理論就就是完全合適的;相反在確定明度和純度之后也可以調(diào)整色相使色與色之間更加舒適;


色彩通常是感性的,但同時(shí)也是基于一定的理論基礎(chǔ)之上,通過(guò)人為的視覺(jué)感知,對(duì)表達(dá)事物理解程度進(jìn)行調(diào)整的,更簡(jiǎn)單的理解就是色彩理論作為框架的輔助,而人眼的感官舒適度作為目的,用色彩基礎(chǔ)理論的方法論對(duì)明度和純度不同調(diào)整嘗試的過(guò)程;

理論認(rèn)知即是對(duì)色彩基礎(chǔ)知識(shí)學(xué)習(xí)的層面,是學(xué)習(xí)和認(rèn)識(shí)色彩的方法論,它是輔助我們合理使用色彩的基本原理,即是對(duì)色彩劃分,色彩的構(gòu)成,色彩原理的思維邏輯理解;

無(wú)色系與有色系存在的唯一差別即是無(wú)色只有明度沒(méi)有純度,而有色則是都存在的,相對(duì)來(lái)說(shuō)也會(huì)比無(wú)色復(fù)雜一些,同時(shí)也是我們需要深入理解和學(xué)習(xí)的方向,而理論認(rèn)知只是建立相應(yīng)的色彩框架,很多設(shè)計(jì)師大都停留在色彩框架的邊緣以色彩理論的空架子作為支撐是很難掌握實(shí)際需求和最終的視覺(jué)效果,但兩者在使用時(shí)也會(huì)存在一些相似的原理和規(guī)律;

當(dāng)以實(shí)際應(yīng)用模式把無(wú)色系和有色系分別列出結(jié)構(gòu)圖可以看出,兩者的變化規(guī)律基本一致,而有色系則是多了一個(gè)純度,也就是顏色的深淺,并呈現(xiàn)出循環(huán)規(guī)律,在進(jìn)行選擇時(shí)則可以融合黑白灰以調(diào)整有色的顏色深淺和明暗;

而當(dāng)有色與無(wú)色變化規(guī)律進(jìn)行對(duì)比之后可以看出,從黑到白的變化中無(wú)色是自然過(guò)度的,而加入一個(gè)紅色之后則發(fā)生了有色的變化,黑到紅是明度的變化,而紅到白則包含明度和純度的變化,單個(gè)色彩則是與黑白融合變化后的結(jié)果,那邊融合的多紅色即偏向那邊,所有單個(gè)色彩均是如此變化規(guī)律,而色彩搭配則可以看作多與少之間的搭配;

圖1:
在使用黑白灰的情況下,更多的只需要考慮色彩的明暗即可,不管如何使用都離不開從黑到白的無(wú)色變化規(guī)律,無(wú)色可以與任何色彩隨意搭配使用,除了極端的純黑和純白之外,其他均可以看作是黑白的明暗過(guò)度色;
圖2:
在有色中加入黑色則可以使色彩變的暗一些,而加入白色則可以讓色彩變的亮一些或者顏色淺一些,即可影響明度同時(shí)也影響著色彩的純度,有色的搭配方法則是根據(jù)色彩變化的規(guī)律進(jìn)行的,也是色相的變化而在使用中還要結(jié)合純度和明度;

案例延展可以出,在規(guī)避三背景上面的三原色之外,背景可以使用其他的任何過(guò)度色,具體可以根據(jù)實(shí)際的要表達(dá)的需求而定;

感性認(rèn)知是建立在理論認(rèn)知的基礎(chǔ)上對(duì)目的理解和色彩感官的使用,是以人的感官目的為基礎(chǔ)進(jìn)行的色彩使用,是色彩所表現(xiàn)出的情感和視覺(jué)感受,通常就是我們常說(shuō)的對(duì)色彩的敏銳度以及對(duì)需求深度理解的色彩視覺(jué)表現(xiàn),也是三要素的具體表現(xiàn);

色彩的情感是人視覺(jué)感知之后的心理作用,也是色彩心理的表現(xiàn),在色相較為固定的情況下,通過(guò)調(diào)整明度和純度之后就會(huì)得出新的色調(diào),而隨之變化的也有色彩的情感和心理變化,而情感和心理變化等這些不確定的因素則需要用色彩之間的搭配來(lái)相對(duì)較為固定的傳達(dá)出色彩所代表的某一特定的情緒;

圖1:
在遵循色彩搭配原理的基礎(chǔ)上進(jìn)行色彩之間的搭配使用是沒(méi)有問(wèn)題的,但就視覺(jué)而言左邊的顏色則會(huì)顯得太過(guò)于扎眼,與文字色和背景色之間并沒(méi)有很好的過(guò)渡,導(dǎo)致整個(gè)版面的色彩視覺(jué)感知跳躍,所傳遞出的情感和心理也飄忽不定,靚麗充滿活力的色彩與背景和文字的沉穩(wěn)雖然是形成了鮮明的對(duì)比,但卻讓人感覺(jué)不是那么協(xié)調(diào)舒服;
圖2:
基于感性認(rèn)知的基礎(chǔ)上,對(duì)原有色彩進(jìn)行明度和純度的調(diào)整,讓色彩之間在視覺(jué)上保持一致的同時(shí)也與背景和文字的色彩相互協(xié)調(diào)舒適,讓版面不失去色彩突出的同時(shí)也讓整個(gè)版面的情感和心理變化相對(duì)的固定在某一特定的變化中,以達(dá)到視覺(jué)感知認(rèn)知的目的與視覺(jué)的舒適度平衡,通常調(diào)整是根據(jù)色彩的主從原則和表現(xiàn)的主體進(jìn)行的;

在色相不變的情況下,把兩個(gè)案例的背景加入大量的黑色,在改變其情緒和心理的同時(shí)使其更加突出色彩,而兩個(gè)背景也都進(jìn)行了純度的調(diào)整,在差別不是很大的情況下尤其會(huì)突出感性認(rèn)知對(duì)情緒和心理變化的影響,同時(shí)也是讓色相與色相之間保持視覺(jué)的一致性,突出單個(gè)色相的原始基本情感;

在使用色彩的時(shí)候很多人都誤以為只是色彩與色彩之間的搭配沒(méi)有做好,在學(xué)習(xí)完理論知識(shí)之后又很難在實(shí)際應(yīng)用中發(fā)揮出來(lái),提升色彩舒適度除了要了解理論知識(shí)外,還需要注意色彩的感性認(rèn)知以及視覺(jué)對(duì)色彩的敏感度(也就是單個(gè)色彩的純度和明度);

一致性是讓色彩視覺(jué)感知舒服的最簡(jiǎn)單的方法,同時(shí)也是調(diào)整色彩的明度和純度而決定的,尤其是在使用多色的情況下一致性尤為重要,在簡(jiǎn)單的三色搭配使用原則中同樣需要注意主色與其他兩個(gè)色之間的視覺(jué)一致性;



以“形影”為題創(chuàng)作的概念性的海報(bào),為了表達(dá)這個(gè)詞的意思,先做好一個(gè)一個(gè)圖形,同時(shí)帶有一定的影子過(guò)渡,顏色方面選擇沒(méi)那么高的飽和度和純度的對(duì)比色,以凸顯形影表達(dá)的意境,然后把圖形置入到新建的畫布中

圖1:
把圖形復(fù)制一層使兩個(gè)圖形對(duì)稱排列并調(diào)整到版面中合適的位置,然后根據(jù)圖形的色彩基調(diào)選擇背景色,色調(diào)的選擇是在保證能夠凸顯出主體圖形的同時(shí)又能與主體融為一體,并貼合情感的需求,背景色選擇藍(lán)色便紫的較淺色調(diào),目的是為了更好的融合圖形的影子以及“形影”所表現(xiàn)的感念氣質(zhì),在色調(diào)和整體上視覺(jué)感知基本保持在同一水平線上,且足以突出主體,同時(shí)符合色彩搭配的理論基礎(chǔ);
圖2:
在較為中性色調(diào)的畫面中,色彩的搭配使用最為頭疼,亮一點(diǎn)顯得亮,暗一點(diǎn)則會(huì)顯得深沉,在整體的色調(diào)基本保持一致的時(shí)候,文字使用純白色則是為了在較為和諧且稍微偏灰的畫面中起到點(diǎn)亮的作用,如果用無(wú)色系的較深的顏色則會(huì)讓整個(gè)畫面太過(guò)于深沉,且與主體想要表達(dá)的氣質(zhì)不符,同時(shí)對(duì)圖形和背景添加些許的質(zhì)感處理,讓整個(gè)畫面看起來(lái)更加的具有品質(zhì)感;


無(wú)色并不是沒(méi)有色彩,在設(shè)計(jì)中無(wú)色系同樣發(fā)揮著不可忽略的作用,尤其是在大面積使用高飽和度和純度的畫面中或者是多色的搭配使用中,無(wú)色系可以很好的起到調(diào)和色彩和視覺(jué)感知平衡的作用;



新建一個(gè)畫布把主體圖形植入到畫面當(dāng)中,在很多情況下可以根據(jù)所要表達(dá)感性概念詞去選擇色彩的大致范圍,然后進(jìn)行局部的色彩調(diào)整油畫,同時(shí)也可以直接根據(jù)整個(gè)畫面和主體所要表達(dá)的情感進(jìn)行色彩搭配,然后調(diào)整合適的背景色;

圖1:
為了讓整體的色調(diào)和視覺(jué)感知保持一致,背景色選擇一個(gè)高明度低純度的淺色以突出主體,同時(shí)把主體調(diào)整到版面中合適的位置為后續(xù)的文字編排留下相應(yīng)的布局空間,從整個(gè)畫面的色調(diào)當(dāng)中可以看出,如果要添加相應(yīng)的合適色彩則會(huì)把整個(gè)畫面基本的情感和情緒弱化從而增加傳遞出色彩與色彩之間形成的其他情緒和感知,通常情況下大多人會(huì)為了色彩搭配而忽略這種微妙的感知認(rèn)知;
圖2:
把圖形復(fù)制一層做相應(yīng)的效果處理,使其自身的視覺(jué)效果得到提升,同時(shí)把文字信息植入到畫面當(dāng)中,在背景淺且較亮的畫面中文字通常會(huì)使用無(wú)色系,這是為了保證畫面視覺(jué)效果和色彩情緒時(shí)使用無(wú)色系的色色彩作為調(diào)和整個(gè)畫面的視覺(jué)平衡,同時(shí)又能保證其基礎(chǔ)設(shè)定的情感表達(dá)和視覺(jué)預(yù)想效果,文字使用黑色時(shí)則會(huì)把整個(gè)畫面向外擴(kuò)展的色感壓回到畫面當(dāng)中形成一個(gè)黑色的壁壘,同時(shí)干凈利索的傳遞自身攜帶的信息;

色彩效果對(duì)比
在畫面主題顏色不變的情況下,只是調(diào)整文字的顏色對(duì)比之后可以看出,左邊的文字顏色雖然也是與整體色調(diào)較為符合,但就整體而言則會(huì)顯得輕浮一些,本身的理論依據(jù)并沒(méi)有太多問(wèn)題,只是在視覺(jué)感知上面會(huì)讓人感覺(jué)沒(méi)有右邊的成熟穩(wěn)重,看起來(lái)更加舒服;


在設(shè)計(jì)中色彩雖然變化多端,但除了理論依據(jù)之外,還有很多方式方法可以為我們的色彩使用提供幫助,主從原則就是色彩選擇使用最好的方式之一,同時(shí)也是設(shè)計(jì)師普遍使用的方式,其主要是根據(jù)設(shè)計(jì)的目的和主體進(jìn)行的色彩搭配使用;



當(dāng)我們拿到一個(gè)主題時(shí),首先要先對(duì)主體的色調(diào)和視覺(jué)感知影響的情緒和情感變化做一下簡(jiǎn)單的捕捉,然后結(jié)合最終預(yù)想的視覺(jué)效果進(jìn)行色調(diào)的初步選擇和搭配的嘗試;

圖1:
主體所呈現(xiàn)出的色調(diào)則是紅藍(lán)多一些,在選擇背景時(shí)則基于紅色調(diào)或者紫色調(diào)的基礎(chǔ)上選擇一個(gè)高明度低純度的色,這樣可以更好的突出主體,同時(shí)還能與主體的色調(diào)融合在一起,在視覺(jué)上看起來(lái)也會(huì)舒服一些,然后適當(dāng)?shù)膶?duì)模特進(jìn)行簡(jiǎn)單的修飾和處理,并調(diào)整到畫面中合適的位置,接著就是把把文字編排置入到畫面中并考慮其應(yīng)該使用什么樣的色調(diào)以更好的貼合畫面和主體;
圖2:
文字的顏色同樣是基于主體的色調(diào)進(jìn)行選擇,如果使用無(wú)色系則會(huì)讓整個(gè)畫面所傳遞出的氣質(zhì)不倫不類且比較死板,而基于主體色調(diào)的基礎(chǔ)上主要考慮文字不被主體吃掉或者扎眼,也能很好的保持清晰的信息傳遞,在最底部加入與背景同色的橫條以最為文字的載體,整體文字色不僅可以與背景和主體融合在一起,同時(shí)也能與被其區(qū)分開獨(dú)立的保持信息的清晰傳遞,在主體色調(diào)不變的情況下可以在明度和純度上嘗試更多可能:

嘗試效果
在基于主體色的基礎(chǔ)上可以嘗試更多的配色方案,其視覺(jué)效果不僅可以讓畫面看起來(lái)更加舒服,同時(shí)也會(huì)有更多的可能,不管是調(diào)整明度,純度,色相都會(huì)有不同色視覺(jué)效果,最終則需要根據(jù)實(shí)際的表達(dá)需求而定;


在設(shè)計(jì)中很多情況下色彩起著決定性的作用,而色彩用的好不好除了色相與色相的搭配之外,更重要的則是對(duì)明度和純度的視覺(jué)敏感度,以及其對(duì)視覺(jué)感知所帶來(lái)的情緒和心理變化,色彩本身是感性,而對(duì)于設(shè)計(jì)師來(lái)說(shuō)則需要通過(guò)感性的認(rèn)知去理解色彩的情緒和心理。
?配色組合不會(huì)用?這里每一種組合色都有創(chuàng)意十足的作品案例,一起來(lái)好好欣賞這些美妙的設(shè)計(jì)作品!

(本文適用于:網(wǎng)頁(yè)設(shè)計(jì)師、平面設(shè)計(jì)師、數(shù)字插畫師和廣大設(shè)計(jì)愛(ài)好者)

明黃和和黑色是今年仍舊流行的組合,這種組合最大的視覺(jué)效果是抓眼球!明黃和黑色的組合而成的作品往往畫面簡(jiǎn)練,中心突出,能引起讀者足夠的注意力。這種組合往往還會(huì)引入白色襯托,經(jīng)典的黑白雙色配以叛逆黃,前衛(wèi)、大膽!




這是一組非常經(jīng)典和優(yōu)雅的色彩搭配!完美的配色方案,是許多平面設(shè)計(jì)和插圖設(shè)計(jì)的首選!作為三原色的其中兩個(gè)(第三種是黃色),藍(lán)色和紅色是鮮明的對(duì)比色,并以純色或中間混合成紫色的漸變完美地互補(bǔ)!





一個(gè)非常現(xiàn)代的色彩組合,代表著神秘感、敏感。在Panton色卡中,這兩種超級(jí)時(shí)尚的色彩組合現(xiàn)在非常受歡迎,并且廣泛應(yīng)用在插圖、網(wǎng)頁(yè)設(shè)計(jì)、平面設(shè)計(jì)、應(yīng)用程序設(shè)計(jì)中。如此令人震驚和強(qiáng)大的組合色,非常適合從事前衛(wèi)、時(shí)尚類產(chǎn)品的設(shè)計(jì)師!





黑與白是設(shè)計(jì)中最經(jīng)典、最永恒的組合,任何時(shí)代、任何設(shè)計(jì)都繞不開這一組合帶來(lái)的高貴的視覺(jué)效果,它是全世界設(shè)計(jì)師和藝術(shù)家珍視的“色彩寶藏”。無(wú)論是手工藝術(shù)品、數(shù)字插畫、平面設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)、印刷設(shè)計(jì)等等,它始終詮釋著:極簡(jiǎn)主義!




網(wǎng)頁(yè)設(shè)計(jì)的潮流趨勢(shì)!這個(gè)充滿活力的組合色通常代表了高科技,也代表了創(chuàng)新和先進(jìn)技術(shù)。不僅PC端,移動(dòng)端也對(duì)它趨之若鶩。






一組對(duì)比鮮明的色彩組合,非常適用于數(shù)字創(chuàng)意設(shè)計(jì),如創(chuàng)意插畫、創(chuàng)意圖形、網(wǎng)頁(yè)設(shè)計(jì)。這兩種顏色分開看,非常迷人,組合在一起,視覺(jué)效果會(huì)更加強(qiáng)烈。珊瑚色也是2020年主打的流行色,




與黑色和黃色的視覺(jué)效果相似,黑和橙也是一種超級(jí)陽(yáng)光和充滿活力的色彩組合。清新的橙色很有吸引力。結(jié)合經(jīng)典的黑白組合色,能生出十分和諧的構(gòu)圖,給人以創(chuàng)新和創(chuàng)造力的印象。
國(guó)內(nèi)排名靠前的幾個(gè)新興科技企業(yè)的app上都能看到黑色和橙色的組合色。





在色相環(huán)上,藍(lán)色和橙色是對(duì)比色,位于色相環(huán)相對(duì)位置的兩種顏色組合往往都能達(dá)到完美的對(duì)比度。作為2020年度八大最佳色彩組合之一,藍(lán)與橙表現(xiàn)出信任和樂(lè)觀,這使得它成為網(wǎng)頁(yè)設(shè)計(jì)和數(shù)字創(chuàng)意的寵兒。



非常歡迎您將這8大最佳流行色彩組合應(yīng)用到您的設(shè)計(jì)作品中,也歡迎您將完成的作品在本文末分享給大家!也歡迎您將您組合出的流行色曬出來(lái),為更多的設(shè)計(jì)師們帶來(lái)靈感!

















霓虹黃和黑色是一種非常時(shí)尚的組合,顏色組合的成功是因?yàn)樗芎?jiǎn)單地抓住用戶的注意力。經(jīng)典的黑白兩色搭配輔以叛逆的黃色,讓這一組合呈現(xiàn)出令人驚異的前衛(wèi)造型。




非常經(jīng)典和優(yōu)雅的配色,為許多圖形設(shè)計(jì)和插圖提供了完美的配色方案。作為兩種原色(黃色是第三種),藍(lán)色和紅色形成對(duì)比,且以純色或令人愉快的漸變的形式彼此完美地互補(bǔ),在中間融變成紫色。





一種非常現(xiàn)代的顏色組合,以敏感和神秘的魅力。把這個(gè)組合的顏色命名為紫外線和盛開的大麗花(珊瑚色),現(xiàn)在已經(jīng)很受歡迎了。我們可以從插圖、網(wǎng)頁(yè)設(shè)計(jì)、平面設(shè)計(jì)和移動(dòng)app設(shè)計(jì)上看到它。





最流行的顏色組合:黑色和白色。它在手工藝術(shù)品、插圖、圖形和網(wǎng)頁(yè)設(shè)計(jì)、印刷設(shè)計(jì)等方面顯得很優(yōu)雅和雅致,它與極簡(jiǎn)主義的視覺(jué)趨勢(shì)有著完美的關(guān)系。




一種非常充滿活力的色彩組合,特別是在網(wǎng)頁(yè)設(shè)計(jì)中非常流行,通常將這種顏色組合視為高科技,這對(duì)于應(yīng)用程序設(shè)計(jì)也很常見(jiàn)。






一組對(duì)比鮮明的色彩組合,在所有類型的數(shù)字藝術(shù)設(shè)計(jì)(插圖,圖形和Web構(gòu)圖)上看起來(lái)都非常令人愉悅。兩種顏色本身看起來(lái)都令人贊嘆,當(dāng)它們組合在一起時(shí),它們的效果會(huì)進(jìn)一步增強(qiáng)。考慮到“活珊瑚”是今年的顏色,這種組合現(xiàn)在很受歡迎。




類似與黑色和黃色,黑色和橙色是一種樂(lè)觀和充滿活力的色彩組合。清新的黃色吸引人的感覺(jué)。結(jié)合經(jīng)典的黑白配色方案,設(shè)計(jì)師可以創(chuàng)造出和諧的構(gòu)圖,給人以創(chuàng)新和創(chuàng)意的印象。





藍(lán)色和橙色在色輪上放置正好相反,這有助于它們?cè)谠O(shè)計(jì)中使用時(shí)獲得完美的對(duì)比度。流行的色彩組合在傳遞信任和樂(lè)觀的同時(shí),也使得它在網(wǎng)站設(shè)計(jì)和數(shù)字藝術(shù)中非常受歡迎。



原文地址:小阿田的設(shè)計(jì)筆記(公眾號(hào))
作者:小阿田的設(shè)計(jì)筆記
]]>
我們身處在一個(gè)多彩的世界中,物體的不同顏色,會(huì)讓我們產(chǎn)生不同的情緒。色彩會(huì)影響人們的身心,強(qiáng)烈的紅色會(huì)使血壓升高,而藍(lán)色則使人冷靜。
設(shè)計(jì)UI界面時(shí),色彩是影響用戶最簡(jiǎn)單和最重要的一個(gè)因素。很多人認(rèn)為UI界面色彩的選擇取決于設(shè)計(jì)師的品味和審美。然而,顏色的選擇過(guò)程比它看起來(lái)要復(fù)雜的多,在設(shè)計(jì)中扮演著重要的角色。
可以用顏色來(lái)營(yíng)造一種情緒、吸引注意力或作出強(qiáng)調(diào),用色彩調(diào)動(dòng)人的情緒或使人冷靜下來(lái)。通過(guò)選擇正確的配色方案,可以營(yíng)造一種優(yōu)雅、溫暖和平靜的氛圍。
色彩的選擇是基于色彩心理學(xué)和色彩理論的,下面就詳細(xì)介紹一下這塊的內(nèi)容吧。
男性和女性的色彩偏好是不同的,不同年齡群體的色彩偏好也是不同的。
根據(jù) JoeHallock的研究,不同性別的色彩選擇有天壤之別。研究旨在發(fā)現(xiàn)不同色彩的偏好程度,從最喜歡的色彩到不那么喜歡的色彩分別所占的比例。

如上圖,男女都格外喜歡藍(lán)色,而對(duì)棕色的喜愛(ài)程度最低。
這款A(yù)PP的目標(biāo)是管理成本,用戶包含男性和女性。先假設(shè)一個(gè)不了解色彩的初學(xué)者,選擇棕色作為APP的主色,因?yàn)樽厣撬钕矚g的顏色。 結(jié)果如下:

如圖,雖然設(shè)計(jì)還行,但由于色彩的選擇,APP可能無(wú)法正常使用。 那如何優(yōu)化呢? 本文稍后的部分中,將介紹如何僅通過(guò)色彩的改變來(lái)優(yōu)化整個(gè)APP。
配色的價(jià)值就來(lái)了,設(shè)計(jì)師需要了解色彩的含義和影響,以傳達(dá)正確的語(yǔ)氣、信息并引導(dǎo)用戶做出預(yù)期的行為。 每種色彩都會(huì)對(duì)我們的思維產(chǎn)生影響,了解可能的影響可以幫助設(shè)計(jì)師傳達(dá)正確的信息、引導(dǎo)用戶行為。
作為一個(gè)設(shè)計(jì)師,你需要了解色彩的含義,這里只是簡(jiǎn)要介紹,詳細(xì)內(nèi)容請(qǐng)參考 http://www.color-wheel-pro.com/color-meaning.html
1.色環(huán)
設(shè)計(jì)界面時(shí),有很多色彩可以使用。首先,要提到的是色環(huán)。

另一個(gè)重要的話題是配色。配色有很多方法,但暖色和冷色應(yīng)該平衡。下面是幾種配色方式:

互補(bǔ)色、鄰近色、三色組、分裂互補(bǔ)色、矩形(雙分裂互補(bǔ)色)、正方形
每個(gè)設(shè)計(jì)師都應(yīng)該知道色彩的三個(gè)屬性:色相、明度和飽和度。 Christian Vizcarra對(duì)色彩的屬性描述非常詳盡,本文借鑒了其相關(guān)內(nèi)容。
2.色相
色相是自然狀態(tài)下的色彩。比如藍(lán)色、黃色、綠色和紅色等等,沒(méi)明暗的變化。簡(jiǎn)言之,色環(huán)上沒(méi)有改變明暗的色彩。如下圖:

3.明度
明度,指色彩的明暗度。以自然界為例,一些物體在早晨和晚上的色彩不同。如樹木和山脈,早晨色調(diào)淺;傍晚因?yàn)楣饩€減少了,色調(diào)變得偏暗。

距光源越近的物體,明度越高,反之,則明度越暗。明度在UI設(shè)計(jì)中扮演重要的角色,明度運(yùn)用得好,可以實(shí)現(xiàn)好的對(duì)比效果。
明度達(dá)到100%時(shí),色彩就會(huì)變成白色;明度是0%時(shí),就會(huì)變成黑色。如下圖:

4.飽和度
飽和度是色彩的純度。增加飽和度,色彩會(huì)變得更強(qiáng)烈、鮮艷生動(dòng);降低飽和度,色彩會(huì)變得暗淡乏味。

使用飽和度前,需要知道設(shè)計(jì)的載體,印刷還是電子媒介。為印刷設(shè)計(jì)時(shí),飽和度不能過(guò)高,因?yàn)橛∷⑹褂玫腃MYK模式,有一定的局限。
黃金比例——6:3:1原則。
60%+30%+10%的原則,是達(dá)到色彩平衡的最佳比例。在60%的空間使用主色,30%的空間使用輔助色,最后剩下10%的空間為另外一種色彩。這樣可以使用戶眼睛從一點(diǎn)移動(dòng)到下一個(gè)點(diǎn)時(shí),非常舒服。

使用6:3:1原則的調(diào)色板
UI中的陰影
沒(méi)有完全純黑的陰影,陰影的顏色是會(huì)受到物體本身固有色的影響,如下圖所示。

櫻桃的陰影是深紅色,看起來(lái)幾乎是黑色,但并不是純黑色。比如還有花兒、盤子和華夫餅的陰影,都不是純黑色的。光和環(huán)境決定了陰影的顏色。
UI設(shè)計(jì)的一個(gè)常見(jiàn)錯(cuò)誤是使用半透明的黑色作為陰影。

如今大多數(shù)的界面都是白色的,目的在于盡可能地簡(jiǎn)化界面聚焦內(nèi)容本身,所以字體排版就成了一個(gè)非常重要的元素。

左邊的文本顏色是純黑色 (# 000000),右側(cè)的色彩看起來(lái)是黑色的,但其實(shí)是加入了藍(lán)色的黑色,變成了藍(lán)黑色 (# 181441)。字體色彩在大多數(shù)白色的界面中,非常重要,如下圖:

相同透明度下,兩組文本字體顏色不同,效果不同。一組是灰色的,另一組是藍(lán)灰色的,不同色調(diào)的文本對(duì)界面有顯著的影響。如下圖:

使用黑色和灰色,很糟糕嗎?不是。人們常說(shuō)“黑色使一切很酷”,所以這取決于個(gè)人的感受。在使用顏色時(shí),考慮到色調(diào),就可以實(shí)現(xiàn)更好的對(duì)比和協(xié)調(diào)。
改為綠色后,APP看起來(lái)好多了。因?yàn)槲覀冃枰谶@款A(yù)pp中表現(xiàn)出對(duì)于金錢和增長(zhǎng)的強(qiáng)烈情感愿望,而綠色描述了金錢和金融世界,男女都同時(shí)喜歡綠色。
(譯者注:在國(guó)外綠色代表股市上漲,所以對(duì)于他們來(lái)說(shuō),關(guān)于金錢的應(yīng)用才用綠色會(huì)更加合適。顏色的使用更貼合使用人群,對(duì)體驗(yàn)來(lái)說(shuō)才會(huì)更好,顏色也就變得更加有依據(jù)。)
以下是修改后的對(duì)比:

比之前看起來(lái)好多了是么? 希望是的。如您所見(jiàn),只需要關(guān)注色彩的一些小細(xì)節(jié),就可以設(shè)計(jì)出高效的用戶界面。
原文鏈接:https://medium.com/iconscout/colors-in-ui-design-theory-psychology-practice-f6d6a5e6e04d
作者:Dalsukh Tapaniya
翻譯:Bravert
]]>