淺談軟件UI的色彩情感

沈　強(qiáng)　（天津電子信息職業(yè)技術(shù)學(xué)院　300350）

淺談軟件UI的色彩情感

沈強(qiáng)（天津電子信息職業(yè)技術(shù)學(xué)院300350）

色彩相對(duì)于圖形和文字等視覺元素更具有直觀性和感染性，尤其是在智能設(shè)備功能已經(jīng)同化的背景下，如何利用UI設(shè)計(jì)擴(kuò)大市場(chǎng)占有率已經(jīng)成為眾多開發(fā)者關(guān)注的焦點(diǎn)。所以本文先分析了色彩對(duì)軟件UI設(shè)計(jì)的影響，然后詳細(xì)分析了色彩情感在軟件UI設(shè)計(jì)中的應(yīng)用。

軟件UI；色彩；情感

適當(dāng)?shù)纳试O(shè)計(jì)不僅可以增強(qiáng)用戶體驗(yàn)，還能刺激用戶視覺感受。現(xiàn)代UI設(shè)計(jì)師在設(shè)計(jì)軟件時(shí)，都會(huì)根據(jù)實(shí)際的軟件功能和用戶需求選擇恰當(dāng)?shù)纳蚀钆?，以方便用戶使用，并完善軟件界面設(shè)計(jì)?？傊?，合理利用色彩的明度值、對(duì)比度和飽和度等屬性，可以很好的展現(xiàn)軟件圖標(biāo)、按鈕等功能，提高軟件的適用性和舒適性。

一、色彩對(duì)軟件UI設(shè)計(jì)的影響

1.色彩的心理效應(yīng)

色彩的心理效應(yīng)分為兩類，一是直接性心理效應(yīng)。二是間接性心理效應(yīng)。通常設(shè)計(jì)師在設(shè)計(jì)軟件界面時(shí)需要考慮用戶群體的審美心理，然后再根據(jù)不同色調(diào)的不同作用設(shè)計(jì)出合理、準(zhǔn)確的人性化操作界面。

直接性心理效應(yīng)是指人們對(duì)色彩的直接性刺激產(chǎn)生的心理反應(yīng)，包括人們的情感、情緒、思想。在軟件UI的設(shè)計(jì)中，如何充分發(fā)揮色彩的感染力和視覺作用，以使人們達(dá)到一種舒適、愉悅的心理享受是眾多UI設(shè)計(jì)師研究的重點(diǎn)內(nèi)容。如紅色，是一種非常靚麗的色彩，很容易吸引人們的注意力。這也就是紅色用在交通信號(hào)燈上的重要原因。另外，紅色還能給人們留下一種喜慶的感覺。

間接性心理效應(yīng)是指在直接性感受到基礎(chǔ)上，產(chǎn)生的一種聯(lián)想的心理效應(yīng)。一般分為具體聯(lián)想和抽象聯(lián)想，如看到紅色，會(huì)聯(lián)想到婚禮、血等事物，這就是具體的聯(lián)想，如果看到紅色聯(lián)想到熱情，就是抽象的聯(lián)想。相比于直接性心理效應(yīng)，間接性心理效應(yīng)的心理感受更為強(qiáng)烈。

2.色彩設(shè)計(jì)原則

根據(jù)不同色彩的不同作用，UI設(shè)計(jì)師在軟件UI設(shè)計(jì)中，應(yīng)該遵循整體性、嚴(yán)謹(jǐn)性、協(xié)調(diào)性的原則。所謂整體性，就是指軟件UI界面的整體風(fēng)格。一般都是大色塊為主要基調(diào)，小色塊為修飾，這樣才能使界面更具有觀賞性。而嚴(yán)謹(jǐn)性是指UI界面中應(yīng)該具有重色或者相似色，使整體的UI界面色彩維持在一個(gè)平衡的狀態(tài)。UI界面設(shè)計(jì)最忌諱跳色，不同色系的顏色拼接在一起，只會(huì)降低界面的設(shè)計(jì)水平。當(dāng)然，協(xié)調(diào)性強(qiáng)調(diào)的也是色彩的合理搭配。但嚴(yán)謹(jǐn)性的一個(gè)突出特點(diǎn)就是界面色彩設(shè)計(jì)中，應(yīng)該添加重色作為背景框，這樣才能使界面顯得更加穩(wěn)重。

二、色彩情感在軟件UI設(shè)計(jì)中的應(yīng)用分析

1.用戶偏好

隨著我國(guó)軟件產(chǎn)業(yè)的快速發(fā)展，越來越多的軟件出現(xiàn)在人們的視野之中。從用戶偏好角度考慮，軟件UI的色彩需要根據(jù)軟件用途以及用戶的舒適要求進(jìn)行設(shè)計(jì)。色彩情感應(yīng)用在軟件UI中，不僅是軟件用戶群細(xì)化的結(jié)果，也是一種人性化設(shè)計(jì)理念的客觀需求。

如色彩主題設(shè)計(jì)已經(jīng)成為現(xiàn)代軟件UI設(shè)計(jì)必不可少的一部分。色彩不僅能影響人們的視覺注意力，還能激發(fā)用戶的購買欲望。一般在軟件UI設(shè)計(jì)中，設(shè)計(jì)師會(huì)根據(jù)用戶的不同年齡、不同性別選擇合適的色彩。如對(duì)于年齡較小的兒童而言，吸引他們的注意力主要是利用五彩斑斕的顏色。而對(duì)于成年人來說，會(huì)選擇一些基本的色彩作為整體色調(diào)。同時(shí)針對(duì)性別的不同，也會(huì)選用不同色系的顏色。如手機(jī)App蜜芽、貝貝，這類的主要用戶是面向年輕媽媽群體，所以會(huì)選用粉色等溫暖的色調(diào)。另外，對(duì)于不同文化環(huán)境中成長(zhǎng)起來的人們，其色彩選擇也有很大的差異，不同的地區(qū)推崇的顏色也是各不相同。如就整體而言西方國(guó)家偏好于色彩明度比較低純度較低，趨于理性的手機(jī)界面設(shè)計(jì)。所以設(shè)計(jì)師在選擇色彩時(shí)，應(yīng)該考慮到用戶的偏好。

又如紅色具有刺激心血的緊迫感，常出現(xiàn)在清倉場(chǎng)景，而橙色的呼叫意味濃厚，用于創(chuàng)建下訂、購買、出售的行動(dòng)，所以紅色和橙色一般用于購物網(wǎng)站或App的購買和支付按鈕，還會(huì)用于一些錯(cuò)誤提示頁面，表示警示和提醒用戶注意。

2.行業(yè)需求

不同的色彩具有不同的心理效應(yīng)。在軟件UI設(shè)計(jì)時(shí)，設(shè)計(jì)師也會(huì)根據(jù)實(shí)際的企業(yè)性質(zhì)選擇合適的顏色作為整體色調(diào)，以突顯企業(yè)的特質(zhì)。色彩也是用戶使用軟件時(shí)最先接觸到，感受到的。軟件整體呈現(xiàn)出來的感受是用戶選擇是否使用該軟件的一個(gè)重要依據(jù)。并且色彩在無意中，還能影響用戶的決策。

如代表理智、沉穩(wěn)的藍(lán)色，在商業(yè)設(shè)計(jì)中應(yīng)用非常廣泛。另外，根據(jù)文化背景的不同，藍(lán)色在商業(yè)設(shè)計(jì)中，還有另外一種含義，即強(qiáng)調(diào)科技，效率的商品或企業(yè)形象。一般科技、計(jì)算機(jī)、銀行等軟件UI中都會(huì)選用藍(lán)色作為基礎(chǔ)色調(diào)，并配中間色作為協(xié)調(diào)顏色。如酷狗軟件的手機(jī)客戶端界面分為登陸，個(gè)人中心，酷狗首頁，酷狗排行。其整體就是以藍(lán)色作為基本的色調(diào)，并利用扁平化設(shè)計(jì)更少的按鈕和選項(xiàng)使得界面干凈整齊，這樣用戶在使用時(shí)，會(huì)感覺更加直接、簡(jiǎn)潔。并且藍(lán)色看起來更加清爽，不會(huì)給人們?cè)斐烧J(rèn)知障礙。據(jù)有關(guān)色彩心理學(xué)測(cè)試顯示，幾乎沒有人對(duì)藍(lán)色反感。另外，藍(lán)色與其它顏色搭配時(shí)，要盡可能的減少色彩沖突。如選用灰色與藍(lán)色搭配，或者是選用紅、橙、黃色等暖色系色彩作為點(diǎn)睛色，可以使整個(gè)畫面具有夢(mèng)幻感?？傊{(lán)色與多種顏色相搭配，盡量選中一個(gè)作為主色讓畫面的顏色達(dá)到平衡。

3.合理搭配

當(dāng)然，色彩并不是限定死的，并不是某些界面元素就必須選用某些顏色。在實(shí)際的軟件UI設(shè)計(jì)中，需要設(shè)計(jì)師深入了解用戶需求，并根據(jù)客戶要求定位產(chǎn)品的性質(zhì)，以便于選擇最合理的色彩。

現(xiàn)在軟件UI的設(shè)計(jì)主流是以簡(jiǎn)潔、準(zhǔn)確為核心內(nèi)容，并且在扁平化設(shè)計(jì)逐漸受到歡迎的背景下，如何選擇簡(jiǎn)單的色調(diào)準(zhǔn)確的表達(dá)出軟件的主要信息成為眾多UI設(shè)計(jì)師關(guān)注的焦點(diǎn)。另外，設(shè)計(jì)師需要注意的另一個(gè)問題是如何合理搭配顏色，以使軟件界面更加舒適。一般在搭配色彩時(shí)，設(shè)計(jì)師需要注意利用大塊的色彩烘托氣氛和主題，小塊的色彩用于點(diǎn)綴，豐富畫面。如軟件Big，其名稱就很容易讓用戶記住，而且其軟件整體是以朱紅色作為基本的色調(diào)，并標(biāo)配灰色為輔助色彩。這樣做不僅能凸顯軟件整體的簡(jiǎn)潔性，還會(huì)使用戶在使用后，對(duì)該產(chǎn)品具有很深刻的印象。

另外，設(shè)計(jì)師在軟件UI設(shè)計(jì)時(shí)，有時(shí)會(huì)選擇顏色漸變作為統(tǒng)一顏色的手段。如在色彩中顏色采用淺色，柔和而輕盈，也會(huì)顯得不夠穩(wěn)定。采用深色，會(huì)顯得厚重高級(jí)，但容易沉悶。在界面設(shè)計(jì)時(shí)，在主色彩是淺色的情況下，適當(dāng)補(bǔ)充些深色，能更好的平衡畫面。例如錘子手機(jī)的介紹界面，整體是以黑灰和白色為基調(diào)，所以在設(shè)計(jì)手機(jī)詳情頁介紹時(shí)，設(shè)計(jì)師選用的是黑白色，兩種顏色的手機(jī)作為設(shè)計(jì)元素。這樣做的好處是不僅可以平衡整體界面顏色頻率，還能增加用戶使用的舒適性。所以設(shè)計(jì)師在進(jìn)行色彩搭配時(shí)，應(yīng)該根據(jù)實(shí)際的用戶需求和軟件定位，這樣才能進(jìn)行顏色的合理搭配。

4.配色

在軟件UI設(shè)計(jì)中，色彩的配色會(huì)影響到整個(gè)界面的表現(xiàn)。一個(gè)優(yōu)秀的設(shè)計(jì)作品，它的色彩搭配首先必須是和諧、協(xié)調(diào)的，這樣才能讓人看起來賞心悅目。影響配色的主觀因素包括只關(guān)注色彩表象和搭配方法不夠系統(tǒng)兩個(gè)方面。首先設(shè)計(jì)師要明白的什么是色相和色調(diào)。色相是眼睛對(duì)不同光線下的物體產(chǎn)生的不同色彩感受。而色調(diào)是指因色彩透明度、飽和度不相同表現(xiàn)出來的不同色彩狀態(tài)。只有先理解這兩個(gè)概念，才能實(shí)現(xiàn)合理的配色。

如利用色相差，形成的配色方案。簡(jiǎn)單的說就是同種色相形成個(gè)統(tǒng)一配色方案，或者是不同色相，色環(huán)上相鄰顏色形成的配色方案。根據(jù)主導(dǎo)色與輔助色的不同，色相差配色方案包括同色系主導(dǎo)、鄰近色主導(dǎo)、類似色主導(dǎo)、中差色主導(dǎo)、對(duì)比色主導(dǎo)、中性色主導(dǎo)、多色搭配下的主。如Twitter，就是一種以藍(lán)色為主導(dǎo)色的配色方案，界面中信息內(nèi)容模塊，白色底代表用戶內(nèi)容，淺藍(lán)色底代表回復(fù)內(nèi)容，更深一點(diǎn)的藍(lán)色底代表可回復(fù)操作。又如，F(xiàn)acebook是利用色彩對(duì)比突出按鈕任務(wù)優(yōu)先級(jí)。統(tǒng)一的深藍(lán)色系運(yùn)用，傳播品牌形象。中間色綠色按鈕起到豐富頁面色彩的作用，同時(shí)也突出綠色按鈕任務(wù)層級(jí)為最高。深藍(lán)色吊頂導(dǎo)航打通整頁路徑，并有引導(dǎo)用戶向下閱讀之意。

又如利用色調(diào)形成的配色方案。它是指利用深色調(diào)和暗色調(diào)等類似色調(diào)搭配也可以形成同樣的配色效果。根據(jù)色彩的情感，色調(diào)形成配色方案包括清澈的色調(diào)、陰暗的色調(diào)、明亮色調(diào)、深暗色調(diào)、雅白色調(diào)，不同的色調(diào)會(huì)帶來人們不一樣的感受。如Tumblr，這是由同一或類似色調(diào)中的色相變化構(gòu)成的配色類型，與主導(dǎo)色調(diào)配色屬于同類技法。區(qū)別在于色調(diào)分布平均，沒有過深或過淺的模塊，色調(diào)范圍更為嚴(yán)格。另外，該軟件UI 設(shè)計(jì)的另一個(gè)優(yōu)點(diǎn)是能夠綜合運(yùn)用靈活運(yùn)用，整體界面是有主導(dǎo)色調(diào)，在布局例如重點(diǎn)圖標(biāo)等是同色調(diào)配色。如目前比較流行的支付寶，其主色調(diào)在進(jìn)過不斷的調(diào)整之后，選擇以深灰色作為背景色彩，以突顯整體界面設(shè)計(jì)的穩(wěn)重性，然后利用白色作為按鈕，這樣更能體現(xiàn)整體界面的舒適感。更重要的是，整體界面設(shè)計(jì)的色調(diào)不超過三種，大多屬于中間色，總的來說，屬于一種深暗色調(diào)?？傊?，軟件UI設(shè)計(jì)師在選擇界面色彩時(shí)，應(yīng)該根據(jù)軟件定位。另外，作為一名合格的軟件UI設(shè)計(jì)師，應(yīng)該掌握配色的技巧，這樣才能在實(shí)際的應(yīng)用，選擇合適的配色，使軟件更加受到用戶的歡迎。尤其是在各種軟件橫行的時(shí)代，不重視色彩的應(yīng)用，不注重界面設(shè)計(jì)的重要性，勢(shì)必會(huì)遭到行業(yè)的淘汰。所以若要軟件更能受到用戶歡迎，UI設(shè)計(jì)師應(yīng)該重視色彩情感的深刻內(nèi)涵，并充分利用其特點(diǎn)，發(fā)揮出色彩對(duì)人們的影響。這不僅是我國(guó)軟件產(chǎn)業(yè)快速發(fā)展的必然結(jié)果，也是我國(guó)經(jīng)濟(jì)發(fā)展的客觀需求。

綜上所述，色彩情感對(duì)于軟件UI的設(shè)計(jì)具有很重要的促進(jìn)作用。恰當(dāng)?shù)纳士梢詼p少用戶使用難度，并提高界面的舒適性。所以軟件UI設(shè)計(jì)師應(yīng)該遵循不同色彩的情感體驗(yàn)，并結(jié)合用戶的實(shí)際體驗(yàn)，設(shè)計(jì)合理的色彩界面，以提高軟件的受歡迎程度，從而促進(jìn)軟件行業(yè)的快速發(fā)展。

[1]張美珍.淺析色彩在UI設(shè)計(jì)中的應(yīng)用[J].設(shè)計(jì)，2014（7）.

[2]夏夢(mèng).UI設(shè)計(jì)中的色彩使用[J].大眾文藝，2015（11）.

[3]雷蕾.論UI設(shè)計(jì)中的色彩心理學(xué)運(yùn)用[J].現(xiàn)代裝飾（理論），2015（8）.

[4]曾俊蓉.UI界面設(shè)計(jì)中的色彩規(guī)劃[J].藝術(shù)品鑒，2016（3）.