明確配色目標(biāo)
1. 色彩規(guī)律≠配色規(guī)律
我們都學(xué)習(xí)過非常多的色彩知識(shí),也看過很多的配色書籍或文章。然而當(dāng)我們嘗試在設(shè)計(jì)中運(yùn)用這些理論時(shí),就會(huì)發(fā)現(xiàn):配色的理論往往在實(shí)際運(yùn)用中并不好使,使用后的效果也不是特別明顯。為什么會(huì)出現(xiàn)這種現(xiàn)象呢?
配色是否就是色彩某種的規(guī)律?當(dāng)我們學(xué)習(xí)并掌握這種規(guī)律以后,就能掌控雷電,呼風(fēng)喚雨,成為配色大魔王了呢?
答案并非如此。
配色并非單獨(dú)存在,而是依附于不同的設(shè)計(jì)載體中。不同的設(shè)計(jì)載體,所要達(dá)到的目標(biāo)不一樣,就決定了配色理論也會(huì)存在差別。
我們會(huì)發(fā)現(xiàn),雖然有很多書本、文章都在寫配色的理論,每個(gè)人講的配色理論有很多相同的地方,但是最核心的理論往往都不是相同的。
因?yàn)榇蠹抑v的相同部分,大多都是色彩的理論部分,這部分僅僅只是色彩本身的規(guī)律;而大家所講的不同部分,則通常是作者在自己所在領(lǐng)域總結(jié)的一套配色規(guī)律。
因此,并非每一篇文章的配色理論都適合你,這也是當(dāng)你學(xué)習(xí)并使用配色理論后,效果依然不好的原因了。
因此在學(xué)習(xí)配色時(shí),僅僅學(xué)習(xí)配色理論是不夠的。首先要思考配色的使用場景,以及整個(gè)設(shè)計(jì)所要達(dá)到的目標(biāo),然后再學(xué)習(xí)相應(yīng)領(lǐng)域的配色知識(shí),才能讓配色理論發(fā)揮最大的作用。
2. 不同的行業(yè),不同的配色目標(biāo)
雖然設(shè)計(jì)是相通的,但是在不同的設(shè)計(jì)領(lǐng)域進(jìn)行配色時(shí),依然會(huì)存在巨大的區(qū)別。
比如廣告設(shè)計(jì)的配色理論,放在室內(nèi)設(shè)計(jì)上,往往是行不通的。因?yàn)閺V告設(shè)計(jì)的目標(biāo)在于傳遞信息,需要吸引你,而室內(nèi)設(shè)計(jì)的目標(biāo)則是要營造舒適理想的生活氛圍。同樣的道理,推廣設(shè)計(jì)的配色理論,往往在界面設(shè)計(jì)時(shí)也是行不通的。
不同行業(yè)間設(shè)計(jì)目標(biāo)的差異,決定了配色目標(biāo)和理論的差異。
3. 明確配色目標(biāo)
對于大部分互聯(lián)網(wǎng)行業(yè)的視覺設(shè)計(jì)師來說,平時(shí)的工作內(nèi)容大體會(huì)分為產(chǎn)品界面設(shè)計(jì)和推廣設(shè)計(jì)兩個(gè)大的方向。很多設(shè)計(jì)師需要同時(shí)負(fù)責(zé)這兩塊內(nèi)容,于是就可能會(huì)出現(xiàn)將同一個(gè)配色理論用在不同地方的情況,導(dǎo)致一些配色問題的出現(xiàn)。比如:推廣設(shè)計(jì)的配色太素,無法吸引用戶的注意;而產(chǎn)品頁面的配色又過于雜亂刺眼,影響用戶閱讀和操作體驗(yàn)等。
所以,配色的第一步,首先要明確配色目標(biāo)。
產(chǎn)品界面設(shè)計(jì)的配色目標(biāo):
信息傳遞:產(chǎn)品的首要目的是傳遞用戶所需要的信息,這就需要界面有清晰的層級關(guān)系,明確、舒適的閱讀體驗(yàn)。
引導(dǎo)操作:清晰合理的操作引導(dǎo),讓用戶能夠準(zhǔn)確地根據(jù)引導(dǎo)進(jìn)行下一步操作。
品牌價(jià)值:很多同學(xué)會(huì)忽略這一點(diǎn),導(dǎo)致產(chǎn)品的界面與品牌關(guān)聯(lián)性差,整體界面沒有品牌感。
推廣設(shè)計(jì)的配色目標(biāo):
吸引流量:強(qiáng)有力的吸引力,快速抓住眼球,留下深刻印象。
營造氛圍:需要營造氛圍,讓用戶通過氛圍快速理解和融入到推廣內(nèi)容中,加深印象。
快速傳遞:在短時(shí)間內(nèi)快速傳遞信息。這就需要設(shè)計(jì)時(shí)信息表達(dá)明確,使內(nèi)容能夠精準(zhǔn)快速地傳遞給用戶。
我們將這兩種配色目標(biāo)做一下關(guān)鍵詞提煉,產(chǎn)品界面設(shè)計(jì)的配色關(guān)鍵詞:清晰、舒適、引導(dǎo)、品牌感。而推廣設(shè)計(jì)的配色關(guān)鍵詞為:吸引力、氛圍、快速傳遞。
我們可以將這些關(guān)鍵詞作為衡量目標(biāo),以此來尋找正確的配色方向,或者用于檢驗(yàn)設(shè)計(jì)作品的配色問題。
所以當(dāng)我們接到項(xiàng)目需求后,可以先與需求方一同確定好設(shè)計(jì)的目標(biāo),以此來確定正確的配色方向,提升配色與設(shè)計(jì)方向的準(zhǔn)確性。而這樣做的另一個(gè)好處是,我們可以在項(xiàng)目之初就與需求方之間取得溝通和信任,達(dá)成共識(shí),為后續(xù)溝通打好基礎(chǔ)。
確定主色,精簡層級
當(dāng)我們確定好配色的目標(biāo)以后,如何開始配色工作呢?通常情況下,我們首先來確定整個(gè)設(shè)計(jì)的主色,然后再開始進(jìn)行后續(xù)的設(shè)計(jì)。
1. 主色與副色的定義
什么是主色和副色?
主色是整個(gè)色調(diào)的核心顏色,通常也是相對占比最多的顏色,它決定了整體的風(fēng)格和基調(diào)。而副色則是畫面中占比相對較少的顏色,它通常起到輔助主色、豐富畫面的作用。
假如把一個(gè)畫面看成一部電影,那么主色就是整個(gè)電影的主角,而副色則是除了主角以外的其他配角。
2. 確定主色,精簡色彩層級
一部好的電影,通常情況下需要有一個(gè)明確的主角,它主導(dǎo)了整個(gè)電影的走向,對于設(shè)計(jì)作品來說,也是相同的道理。所以在配色過程中,首要的任務(wù)是確定配色的主色,并在整個(gè)作品中明確它的地位,讓它來主導(dǎo)整個(gè)畫面。
在產(chǎn)品界面的設(shè)計(jì)中,主色是傳達(dá)品牌感的重要元素。明確的主色能夠讓整個(gè)界面產(chǎn)生強(qiáng)烈的品牌感。反之,整體的配色會(huì)顯的十分混亂,影響品牌感的傳達(dá)。
3. 精簡色彩層級的意義
色彩層級越精簡,就越容易達(dá)到整體色彩平衡,從而提升設(shè)計(jì)的整體品質(zhì)感。當(dāng)我們?nèi)タ春芏啻髲S的頁面設(shè)計(jì)時(shí),可以感受到很多的相同點(diǎn):整體而強(qiáng)烈的品牌感,簡約而高級的配色,豐富細(xì)膩的細(xì)節(jié)等。
用戶在閱讀頁面時(shí),配色是我們大腦最先接收到的畫面信息。所以精簡配色對于產(chǎn)品界面的設(shè)計(jì)來說至關(guān)重要。以品牌色為主色,精簡色彩層級,可以讓整個(gè)頁面富有品牌感。
4. 品牌升級時(shí)的色彩簡化趨勢
在品牌Logo 的升級中,簡化色彩層級同樣是一個(gè)大的趨勢。簡化層級,可以讓品牌更加簡約和高級,提升品牌的品質(zhì)感和包容性,使品牌擁有更大延展性和更多的可能性。
選擇正確的色系
明確配色目標(biāo),確定主色以及色彩層級后,如何進(jìn)行下一步的配色?
這時(shí)候我們可以根據(jù)不同的配色目標(biāo)來選擇合適的色系,豐富整個(gè)畫面的配色。需要注意的是,在豐富配色的同時(shí),仍然要嚴(yán)格控制色彩層級,以保證整體色彩層級的精簡。
1. 巧用同色系,統(tǒng)一不單調(diào)
同色系是指在色環(huán)上相距不超過45°的兩種顏色,我們可以選擇主色的同色系范圍內(nèi)的顏色來豐富整體配色。那么如何選擇同色系的顏色呢?
首先在色環(huán)中確定顏色的位置,通過色環(huán)兩邊45°延展出我們所需要的同色系。
2. 不同場景的對比色用法
對比色是指在色環(huán)上相距120°~180°之間的兩種顏色(180°時(shí)則互為互補(bǔ)色)。處于對比色關(guān)系的兩種顏色,通常色相差異較大,能夠相互產(chǎn)生強(qiáng)烈的對比效果,我們可以利用這種原理來增強(qiáng)畫面的吸引力。
推廣活動(dòng)頁面中的對比色應(yīng)用
在推廣頁面的設(shè)計(jì)中,通常需要用營造強(qiáng)烈的視覺沖擊,以達(dá)到快速吸引用戶并傳遞信息的目標(biāo)。這就需要大面積的對比色,來達(dá)到強(qiáng)烈的對比效果。而在較大面積使用對比色時(shí),整體色彩的主次和整體平衡至關(guān)重要。
可以看到,整個(gè)頁面主要由橙色和深藍(lán)紫色兩個(gè)主要對比色構(gòu)成。大面積的對比色產(chǎn)生了強(qiáng)烈的視覺沖擊,讓整個(gè)頁面充滿了吸引力。整個(gè)畫面用最強(qiáng)烈的對比色重點(diǎn)突出了兩個(gè)主要的人物角色,從而吸引用戶注意并進(jìn)行閱讀,最終將用戶引導(dǎo)至購買入口。至此,整個(gè)頁面的任務(wù)也算是完成了。
在推廣頁面中,我們需要注意的是,重點(diǎn)信息并非只能是文字內(nèi)容,也可以是最吸引用戶的畫面核心元素。
3. 嘗試更多的創(chuàng)新配色
除了掌握以上的幾種基本色系的配色方法外,大家可以在此基礎(chǔ)上嘗試更多的配色風(fēng)格。比如在同色系、對比色系的基礎(chǔ)上,有目的地加入色彩元素豐富色調(diào),在保持整體色彩層級的同時(shí),加入更豐富的變化,從而達(dá)到配色目標(biāo)。
提升品質(zhì)感
我們按照之前的方法,正確的確定了配色的目標(biāo),選擇了合適的配色方向,并逐步完成了整體的設(shè)計(jì)排版。很多同學(xué)到這一步之后,就覺得作品已經(jīng)完成,便停止不繼續(xù)深入了,而這也是初級設(shè)計(jì)師經(jīng)常容易出現(xiàn)的問題。這個(gè)時(shí)候的作品,從整體上看并沒有太多問題。但是當(dāng)用戶被頁面吸引,開始仔細(xì)欣賞作品時(shí),往往會(huì)發(fā)現(xiàn)作品沒什么看點(diǎn)。
出現(xiàn)這種問題的原因,就是作品缺乏足夠的細(xì)節(jié)和品質(zhì),導(dǎo)致作品不夠耐看。就像一本書有著精美的封面,但是打開以后卻平淡無奇,最終對整本書都非常失望。
想要讓作品更優(yōu)秀,除了基本的版式和配色之外,往往還需要更深入地去雕刻作品,讓作品帶有一種更高級的「氣質(zhì)」,而這種「氣質(zhì)」就是我們所說的品質(zhì)感。
1. 什么是品質(zhì)感?
品質(zhì)感對于設(shè)計(jì)作品來說,是一個(gè)綜合性的評價(jià)。我們可以將這個(gè)詞分為「品」和「質(zhì)」,「品」代表物體本身的品相和細(xì)節(jié),而「質(zhì)」則代表質(zhì)感。
2. 獲得品質(zhì)感的關(guān)鍵要素
漸變只是獲得品質(zhì)感的關(guān)鍵因素之一,蘋果官網(wǎng)將漸變這種原理加入到頁面和元素中,配合精美的產(chǎn)品圖片,讓頁面保持了非常高的品質(zhì)感。
總結(jié)
看完前面的內(nèi)容,大家會(huì)發(fā)現(xiàn),其實(shí)配色并沒有想象中那么復(fù)雜。
只要掌握正確的配色策略,并逐漸適應(yīng)這種方法,就可以應(yīng)付各種不同的設(shè)計(jì)類型。最后,我們將前面講的配色法則做一個(gè)簡要的總結(jié):明確目標(biāo) – 確定主色 – 精簡層級 – 選擇色系豐富配色 – 提升品質(zhì)感。
標(biāo)簽: 南昌網(wǎng)站建設(shè)公司/南昌做網(wǎng)站的公司/南昌微信小程序/南昌APP開發(fā)/—斑驢互聯(lián)