有很多對設計感興趣的朋友們站辉,以及剛?cè)胄蠻I的朋友對設計的配色很頭疼。
經(jīng)常有朋友向u叔咨詢?nèi)绾巫龀龈叽笊系腢I設計作品贸街,u叔經(jīng)過幾天艱苦奮斗庵寞,終于整理出來了這7招配色方案與技巧,相信這篇文章能解決朋友們所頭疼的問題薛匪。
1 .掌握6:3:1配色原則
U叔先為大家介紹一下捐川,6:3:1 原則最早是源自于室內(nèi)設計領(lǐng)域,室內(nèi)設計師借助這一原則逸尖,創(chuàng)造出協(xié)調(diào)的室內(nèi)設計配色古沥。
u叔認為這一原則就是為了達到平衡的配色,將幾種色彩遵循60%—30%—10%這樣的色彩配比娇跟。
其中占據(jù)60% 的是主色岩齿,30%則是輔助色,而占據(jù)10%的色彩應當為強調(diào)色苞俘。
朋友們只要掌握這個原則盹沈,u叔相信你的作品顏色搭配就不會跑偏。
2.色彩的對比
u叔認為色彩的對比幾乎是任何視覺構(gòu)圖的關(guān)鍵部分吃谣。
對比度創(chuàng)造了UI元素的差異乞封,也賦予它們以性格做裙。值得朋友們注意的是,UI當中來自同一色系的色彩往往不會呈現(xiàn)出明顯的對比度肃晚,而可識別度較低的文本更是界面信息傳達和交互的障礙锚贱。
我們需要根據(jù)設計目標,來合理地控制整個作品色彩的對比度高低关串。
u叔來為大家舉個例子拧廊,如果你需要讓用戶注意到特定的元素,那么最好使用高對比度的色彩來達到引人矚目的視覺體驗晋修,比如使用高對比度的紅色和藍色吧碾。
CTA按鈕常常就是使用這樣的色彩。
但是u叔認為飞蚓,如果將UI視作為整體的話滤港,高對比度的色彩可能并總能奏效。
文本內(nèi)容和背景的對比需要控制在一個合理的度上面趴拧,否則就會因為對比過大產(chǎn)生「暈影」的視覺效果,這會影響用戶長時間閱讀的閱讀體驗山叮。
所以u叔建議朋友們采用溫和的對比度控制著榴,并且只在特定的元素上使用高對比度。
通過在不同的設備上測試屁倔,可以讓我們的作品保持配色的可用性和泛用性脑又。
3.色彩心理學
我們所熟知的設計工作流程都是基于心理學原理開展的。
色彩心理學是和設計息息相關(guān)的一個心理學分支锐借,它主要研究色彩對于人類情緒和行為上的影響问麸。
我們大腦對于色彩的反應其實是相當敏感和多樣的,但是在日常生活中我們很難直觀地钞翔、迅速地感受到严卖。
當人的眼睛感知到一種色彩的時候,會向大腦內(nèi)的分泌系統(tǒng)發(fā)出信號布轿,并且釋放刺激產(chǎn)生對應情緒的激素哮笆。
u叔認為每種色彩對于我們的感知和思維都有獨特的影響力,了解這些可能的反應最終可以幫助我們正確地傳遞信息汰扭,并且引導用戶按照我們的預期來執(zhí)行稠肘。
下面u叔為大家介紹一些顏色的基本的特征和含義:
· 紅色:象征愛情,自信萝毛,激情和憤怒项阴,它是充滿活力和溫暖的色彩,給人帶來興奮的感覺笆包。
· 黃色:能傳遞出幸福环揽,陽光略荡,喜悅和溫暖的情緒。
· 綠色:則常常能給人自然薯演、清新撞芍、富有生命力的感覺。
· 藍色:是目前最受歡迎的顏色之一跨扮,企業(yè)常常會使用藍色來傳遞自信和讓人信賴的感覺序无。
· 紫色:和皇室、財富關(guān)聯(lián)密切衡创,這也是代表神秘和茉莉的色彩帝嗡。
· 黑色:雖然和死亡、悲劇有關(guān)璃氢,但是也能營造沉穩(wěn)大氣的高級感哟玷。
· 白色:代表純潔無暇,傳達出高雅一也,純粹和清晰的感覺巢寡。
除此之外,我們還需要明白一個事情椰苟,就是人和人的視覺感受通常是不同的抑月,對于色彩的認知還受到文化背景的影響,性別的因素對于色彩偏好的影響也不小舆蝴。
因此谦絮,u叔認為了解我們用戶的特征是很有必要的。
4.色彩心理學
朋友們都知道文化背景對于色彩有著深刻的影響洁仗。
不同的文化有著不同的傳統(tǒng)文化和信仰特征层皱,甚至同一種顏色在不同的國家有著截然不同的解讀方式。
白色在歐美國家常常象征著純潔和高貴赠潦,但是在亞洲地區(qū)叫胖,喪事也常常被稱為“白事”,代表著死亡和悲傷祭椰。
在中國臭家,色彩飽和度高的正色是傳承了幾千年的視覺文化元素,但是在日本方淤,卻以間色和低飽和度的色彩為美钉赁。
u叔建議大家在設計之前,應該深入了解受眾當?shù)氐?b>文化特征携茂,這樣才能讓我們更好的降低被誤解的風險你踩,創(chuàng)造出優(yōu)秀的設計。
5.色彩協(xié)調(diào)
u叔認為協(xié)調(diào)的UI設計是設計師的目標之一,而這意味著配色一定要和諧并令人感到舒適带膜。
我們可以通過色彩來營造富有吸引力的協(xié)調(diào)設計吩谦,能夠讓用戶清晰明了地感知到UI中的內(nèi)容,同時留下良好的第一印象膝藕。
隨著u叔多年的摸索式廷,在配色方案上總結(jié)了一些基本的配色方法:
· 單色配色。單色配色并不是說只有一種顏色芭挽,而是基于同一色系來進行配色滑废,不同明暗、飽和度的色彩組合到一起袜爪,構(gòu)成配色方案蠕趁。
· 類似色。在色輪上彼此靠近的顏色構(gòu)成的配色方案辛馆。
· 對比色俺陋。色輪上彼此處于相對位置的色彩能夠構(gòu)成鮮明的對比,這些對比色能夠構(gòu)成高對比度的配色方案昙篙。
· 拆分互補色腊状。拆分互補色的配色原理和互補色相似,但是不同的地方在于苔可,這樣的配色當中會采用更多的顏色寿酌,當你選擇藍色之后,與之搭配的不是對位上的橙色硕蛹,而是橙色兩側(cè)的黃色和紅色。
· 三元色硕并。它是在色輪上挑選互為120度角的三個顏色類進行配色法焰。使用其中的一種色彩為主導,另外兩種色彩用來提亮倔毙。
· 雙互補色埃仪。采用兩對互補色來作為主要的配色方案。
6.自然獲取配色
u叔認為:大自然是世界上最好的藝術(shù)家和設計師陕赃。
我們在自然環(huán)境中看到的色彩組合大多都非常的協(xié)調(diào)卵蛉,甚至可以說接近完美。
人們所喜歡的日落和黎明么库,喜歡秋日的落葉和冬天的山野傻丝,因為這些色彩組合有著獨特的美感。
所以u叔建議大家嘗試從自然風景中獲取配色诉儒。
后期u叔會為朋友們詳細介紹如何從自然風景中獲取想要的配色葡缰。
7.配色網(wǎng)站
U叔在這里為朋友們分享了一些優(yōu)秀的配色網(wǎng)站,希望能夠幫助大家。
漂亮的漸變顏色:
https://uigradients.com/#CoolSky
colourlovers:
//www.colourlovers.com/
colorfavs:
http://www.colorfavs.com/
日本傳統(tǒng)色詞典:
http://nipponcolors.com/
kuler:
https://color.adobe.com/zh/
U叔送個朋友們一段話:
在我們追夢的過程泛释,必須有堅強的信念滤愕。
無論你的起點是什么樣的,前方都有一條適合你的道路等著你怜校。
遇到最困難的事情時间影,你只有兩個選擇,敢或不敢茄茁!
如果你有設計夢想就不要放棄魂贬,不要糾結(jié),不要猶豫胰丁,有夢想我們一起實現(xiàn)随橘。
雖然追夢的道路很艱辛,但是在這條路上我們會遇見別樣的風景讓我們一起為夢想前行吧锦庸。
U叔會陪伴朋友們在設計這條道路上一直走下去的机蔗。