- 相關(guān)推薦
讓設(shè)計(jì)更有趣有用的5個(gè)色彩技巧
色彩幾乎是所有設(shè)計(jì)體系中不可忽略的組成部分，而在網(wǎng)頁(yè)設(shè)計(jì)中，色彩本身所發(fā)揮的作用并不單一，除了最基本的著色構(gòu)成色彩搭配的作用之外，色彩能夠通過(guò)對(duì)比創(chuàng)造視覺(jué)焦點(diǎn)，構(gòu)建信息層次，影響用戶(hù)情緒，甚至引導(dǎo)訪(fǎng)客的行為。下面小編帶著大家一起來(lái)了解一下讓設(shè)計(jì)更有趣有用的5個(gè)色彩技巧吧！
讓設(shè)計(jì)更有趣有用的5個(gè)色彩技巧
1、通過(guò)比例變化創(chuàng)造視覺(jué)焦點(diǎn)
控制色彩的比例來(lái)創(chuàng)造視覺(jué)焦點(diǎn)是常見(jiàn)的色彩運(yùn)用手法之一，控制色彩的比例實(shí)際主要是通過(guò)控制色彩所在元素的大小來(lái)達(dá)成效果的。比如Viporte 這個(gè)網(wǎng)站，當(dāng)你上下滾動(dòng)首頁(yè)的時(shí)候，每個(gè)部分都用超大的字體進(jìn)行了裝飾，而每個(gè)字母都使用了漂亮的色彩進(jìn)行填充。不同的文字使用了不同的色彩，并且搭配以相應(yīng)的圖片。每個(gè)頁(yè)面的焦點(diǎn)肯定是最中心的圖片和字母，而焦點(diǎn)的形成和色彩的比例與運(yùn)用脫不開(kāi)關(guān)系�？刂粕实恼急�，無(wú)論是多還是少，只要有明確的目的，總能形成吸引注意力的焦點(diǎn)。無(wú)論是我們常說(shuō)的“萬(wàn)花叢中一點(diǎn)綠”，還是極簡(jiǎn)主義設(shè)計(jì)中大面積的留白，都是色彩比例控制下所構(gòu)成視覺(jué)焦點(diǎn)的典型案例。
2、通過(guò)對(duì)比度吸引用戶(hù)注意
在設(shè)計(jì)過(guò)程中，使用色彩來(lái)控制對(duì)比度也是設(shè)計(jì)師頻繁使用的技巧之一。當(dāng)設(shè)計(jì)的整體色調(diào)趨于柔和和平靜的時(shí)候，突然注入強(qiáng)對(duì)比的色彩，能夠瞬間抓住用戶(hù)的注意力。
而Thinx 這個(gè)網(wǎng)站在設(shè)計(jì)的時(shí)候就將對(duì)比度控制得很好。網(wǎng)頁(yè)主體的配色采用的是經(jīng)典的黑白搭配，白色的背景搭配黑色的文本。而整體的設(shè)計(jì)感的來(lái)源則主要源于排版和彩色的圖片。網(wǎng)站所采用的圖片明顯經(jīng)過(guò)精心的選擇和設(shè)計(jì)，紅色的底色、黑色的內(nèi)衣和模特外露的細(xì)膩肌膚色在圖片激烈的碰撞，漂亮而充滿(mǎn)誘惑，圖片大膽的色調(diào)搭配和素色的背景與文字形成了鮮明而強(qiáng)烈的對(duì)比，無(wú)論是經(jīng)典的紅黑搭配，還是永恒的黑白配色，都足夠漂亮和吸引人。
Thinx 這個(gè)案例我非常喜歡，并且經(jīng)常會(huì)用到，因?yàn)樗C明了設(shè)計(jì)師并不一定非得靠高飽和度的霓虹色來(lái)創(chuàng)造高對(duì)比度的配色。即使是兩種平衡的顏色，也能讓整個(gè)設(shè)計(jì)脫穎而出。
3、使用色彩創(chuàng)造UX模式
高度一致的配色方案能夠創(chuàng)造出視覺(jué)模式，而延伸到用戶(hù)體驗(yàn)上，則會(huì)讓整個(gè)UX呈現(xiàn)出模式化的特征。模式化的設(shè)計(jì)讓用戶(hù)更容易適應(yīng)，用戶(hù)更容易摸索出規(guī)律，也更容易產(chǎn)生相匹配的預(yù)期，換句話(huà)說(shuō)，UX模式能夠培養(yǎng)用戶(hù)習(xí)慣，同用戶(hù)產(chǎn)生深刻的關(guān)聯(lián)。就像用戶(hù)習(xí)慣了某些特定的圖標(biāo)之后，在其他地方看到這些圖標(biāo)就知道它們的含義，明白該如何交互了。比如，小房子圖標(biāo)會(huì)讓用戶(hù)想到首頁(yè)、主頁(yè)，而垃圾桶則會(huì)關(guān)聯(lián)上刪除的概念。色彩相對(duì)而言更加主觀，因?yàn)槊總�(gè)網(wǎng)站和APP都會(huì)采用自己的配色方案，不同的色彩代表不同的含義。
那我們就拿Underbelly 這個(gè)產(chǎn)品展示頁(yè)作為示例吧。在Underbelly 這個(gè)網(wǎng)站中，所有可點(diǎn)擊的組件都是藍(lán)色的，你在試用網(wǎng)站幾秒鐘之后，能夠快速掌握這個(gè)UX模式，并且明白如何操作。這就是Underbelly 通過(guò)色彩構(gòu)建UX模式的方法。UX模式的優(yōu)勢(shì)在于，它讓用戶(hù)更快地熟識(shí)你的產(chǎn)品。越容易識(shí)別，用戶(hù)的想法越少，產(chǎn)品的的使用也就更加順暢了。
4、使用色彩來(lái)創(chuàng)建層次
當(dāng)我們?yōu)g覽網(wǎng)頁(yè)和各種界面的時(shí)候，信息的層次感很大程度是借助視覺(jué)來(lái)營(yíng)造的。使用色彩來(lái)創(chuàng)造視覺(jué)層次感就很順其自然了。
在Skore 的產(chǎn)品頁(yè)面中，每一個(gè)部分都有使用到綠色的元素。重復(fù)的綠色元素不僅創(chuàng)建出可供用戶(hù)快速識(shí)別的模式，它也讓用戶(hù)能夠快速明白哪些因素更加重要。通常，我們解釋視覺(jué)層次的時(shí)候，會(huì)用不同大小、粗細(xì)的字體來(lái)闡述信息層次和結(jié)構(gòu)，但是不同強(qiáng)度的色彩，同樣可以實(shí)現(xiàn)層次的劃分。
在Skore 這個(gè)案例當(dāng)中，綠色和灰色的文本以及白色的背景之間有著良好的對(duì)比度，整個(gè)配色方案不依賴(lài)其他的強(qiáng)調(diào)色，以綠色為主。這種相對(duì)穩(wěn)定的配色結(jié)構(gòu)有助于讓每個(gè)部分都有層次地呈現(xiàn)出來(lái)。綠色不僅吸引用戶(hù)關(guān)注關(guān)鍵的元素，而且為不同的部分的內(nèi)部提供層次結(jié)構(gòu)。
5、充分利用色彩的相似性
除開(kāi)其他的目的，設(shè)計(jì)師使用色彩或者調(diào)整色彩的目的，基本都是為了創(chuàng)造設(shè)計(jì)的一致性。InVision 的年度總結(jié)頁(yè)面使用了從粉色到紫色的漸變，在頁(yè)面的下方，粉色和紫色同樣應(yīng)用到了按鈕中，此外，在著陸頁(yè)當(dāng)中，將對(duì)比度明顯的白色置于粉色+紫色的背景之上，確保信息的清晰呈現(xiàn)。如果色彩每次都不一樣，那么整個(gè)設(shè)計(jì)看起來(lái)就不是那么令人難忘了。
另外一個(gè)案例來(lái)自于 Comotion。Comotion 的工作室首頁(yè)采用了幾種不同的色彩，但是這些色彩的色調(diào)是非常接近的，從而創(chuàng)建出了一種和而不同的配色方案。在這個(gè)設(shè)計(jì)案例當(dāng)中，幾個(gè)不同的色彩互為搭配，并不會(huì)太過(guò)于突出，但是又能夠恰到好處地進(jìn)行強(qiáng)調(diào)，最終讓色彩足夠好看，有保持了用戶(hù)的參與度。
結(jié)語(yǔ)
色彩能夠幫助設(shè)計(jì)師達(dá)成各種各樣的目的，靈活的運(yùn)用能夠讓這一切實(shí)現(xiàn)。當(dāng)你將上述的色彩使用技巧都合理的運(yùn)用起來(lái)，可以靈活的創(chuàng)造視覺(jué)焦點(diǎn)，構(gòu)造層次，打造真正有趣而有用的設(shè)計(jì)。
室內(nèi)設(shè)計(jì)色彩的搭配原理與技巧
室內(nèi)色彩搭配原理 —— 側(cè)重色彩
對(duì)大面積地方選定顏色后，可用一種比其更亮或更暗的顏色以示渲染，如用于線(xiàn)角處。側(cè)重色彩用于有裝飾線(xiàn)的小房間或公寓，更能相映成趣。
室內(nèi)色彩搭配原理 —— 色調(diào)平衡
對(duì)比色彩的成功運(yùn)用依賴(lài)于良好的色調(diào)平衡。室內(nèi)裝修顏色搭配的一種應(yīng)用廣泛的做法是：大面積使用一種顏色——冷色，然后用少量的暖色平衡。反之，以暖色為主，冷色點(diǎn)綴，效果同樣理想，尤其是在較陰暗的房間里，這種設(shè)計(jì)更為合適。
室內(nèi)色彩搭配原理 —— 互補(bǔ)色的運(yùn)用
把紅和綠、藍(lán)和黃這樣的兩種顏色安排在一起，能產(chǎn)生強(qiáng)烈的對(duì)比效果。這種配色方案可使房間顯得充滿(mǎn)活力、生氣勃勃。家庭活動(dòng)室、游戲室甚至是家庭辦公室均適合。
室內(nèi)色彩搭配原理 —— 黑白灰的運(yùn)用
黑色、白色和灰色搭配往往效果出眾。棕、灰等中性色是近年來(lái)裝修中很流行的顏色，這些顏色很柔和，不會(huì)給人過(guò)于強(qiáng)烈的視覺(jué)刺激，是打造素雅空間的色彩高手。但為避免過(guò)于僵硬、冷酷，應(yīng)增加木色等自然元素來(lái)軟化，或選用紅色等對(duì)比強(qiáng)烈的暖色，減弱原來(lái)的效果。
室內(nèi)色彩搭配技巧 —— 防止色彩太多
應(yīng)該先少用幾種顏色，然后再慢慢增加。如果對(duì)整體設(shè)計(jì)沒(méi)把握，就從小型的空間著手或采取以點(diǎn)帶面的方法，比如圍繞自己最喜歡的一幅畫(huà)或是一款家具為中心，看看什么顏色搭配起來(lái)比較和諧。
室內(nèi)色彩搭配技巧 —— 多用中性色
中性色是含大比例黑或白的色彩，如沙色、石色、淺黃色、灰色、棕色，這些色彩能給人寧?kù)o的感覺(jué)，因此常常被用作背景色。不過(guò)，又硬又冷的純白色應(yīng)盡量避免。如果對(duì)白色有偏好，應(yīng)盡量選擇含少量淡色的不標(biāo)準(zhǔn)的白色調(diào)。
室內(nèi)色彩搭配技巧 ——上淺下深
淺色感覺(jué)輕，深色感覺(jué)重。房間顏色應(yīng)上淺下深過(guò)渡漸變。不妨把屋頂和墻壁刷成白色、米黃色等淺色系，墻裙加深一些，家具顏色更深一些。這樣給人感覺(jué)十分穩(wěn)定、和諧。
【讓設(shè)計(jì)更有趣有用的5個(gè)色彩技巧】相關(guān)文章：
配色中有趣且有用的小技巧07-12
網(wǎng)頁(yè)設(shè)計(jì)色彩搭配技巧08-07
室內(nèi)色彩設(shè)計(jì)與搭配的技巧08-21
室內(nèi)色彩設(shè)計(jì)與搭配技巧10-18
室內(nèi)色彩設(shè)計(jì)及搭配技巧08-09
服裝色彩搭配設(shè)計(jì)技巧08-22