淺談移動app界面的色彩設(shè)計

【摘要】 隨著智能手機的普及，移動媒體已然成為人們生活中不可或缺的部分，而界面中具有良好交互設(shè)計的app愈發(fā)受到用戶的青睞。本文對移動app交互設(shè)計中的色彩應(yīng)用進行分析和探討，以期為移動app的界面設(shè)計提供一些實質(zhì)性的建議。

【關(guān)鍵詞】 app；色彩設(shè)計；視覺平衡

1 移動app基本屬性與發(fā)展

移動應(yīng)用（application的縮寫，簡稱app）是基于移動設(shè)備的第三方程序。隨著智能手機的日益流行，多平臺的app應(yīng)用應(yīng)運而生。以蘋果應(yīng)用商店為例，截至2015年7月，其24個類別下的應(yīng)用程序數(shù)量多達150萬。而今，其中100多萬已被或正被蘋果公司或開發(fā)商刪除。面對如此龐大的移動應(yīng)用數(shù)量，要想在優(yōu)勝劣汰中長久生存，軟件自身的設(shè)計不容忽視。

能被用戶持續(xù)使用的優(yōu)秀app應(yīng)用，除了固有的基本功能以外，往往還擁有優(yōu)良的界面的設(shè)計。而界面設(shè)計通常包括：風(fēng)格設(shè)計、版式設(shè)計、色彩設(shè)計、文字設(shè)計以及交互方式等。符合用戶需求的界面設(shè)計能夠提高用戶的使用感受，更能充分體現(xiàn)出app的功能特點。

近年來，幾乎所有的設(shè)計媒介和個人都在提倡“簡約設(shè)計”。一般情況下，設(shè)計者的主流觀點就是將頁面所謂的“冗余”減少和刪除，而呈現(xiàn)給用戶的可能已是“干凈無比”的頁面。科爾伯恩在其著作《簡約至上-交互設(shè)計四策略》中有過這樣的陳述：“簡單是用戶體驗是初學(xué)者、新手的體驗，或者是壓力之下的主流用戶的體驗。”例如：圖1。

看似簡單的兩個主界面是筆者參與開發(fā)及設(shè)計的企業(yè)移動app辦公軟件的頁面演變。從1.0到3.0版本的變化，反映了用戶對界面操作的主觀性需求愈發(fā)明顯，而主流用戶群對最為直觀的、帶有色彩沖擊力的圖像模塊的敏銳度持續(xù)增強。

同時隨著網(wǎng)絡(luò)信息技術(shù)的飛速發(fā)展，3G、4G技術(shù)的普及，趨于“本地化”“數(shù)據(jù)化”及“移動化”的app更易讓普通大眾所接受。于是，使移動app從設(shè)計層面脫穎而出，便是當(dāng)務(wù)之急。

2 色彩設(shè)計的原理

關(guān)于色彩，事實上是一種不確定的元素，即計算機屏幕上的呈現(xiàn)及打印或印刷到其他媒介上同一種物體亦會出現(xiàn)不同的色值。為了區(qū)分，我們通常用RGB（計算機屏幕上）和CMYK（印刷品上）來表示色彩。

色彩有多種屬性，傳統(tǒng)意義上我們將其概括為以下幾點：1、不協(xié)調(diào)與和諧對稱；2、對比色與互補色；3、色調(diào)的冷色與暖色等。在設(shè)計中，大面積的色彩的選擇直接影響了感受者的第一印象。為了使其產(chǎn)生安心的感覺，獲取最為協(xié)調(diào)的配色，通常采用色相、明度、純度的一致性及間隔色的選取采用同色系的技巧。因為色相一致的配色，會讓人同時感到一致與帶有一些幻想的印象；明度一致的配色，即便使用多種顏色也能產(chǎn)生整體均衡效果；而純度一致的配色讓人感覺穩(wěn)重，相反則讓人感覺有精神；當(dāng)色彩與色彩互相沖突的間隔色出現(xiàn)時，在其間插入灰色或者是同系列的顏色更為協(xié)調(diào)。

人對色彩的感知，在學(xué)術(shù)領(lǐng)域直接被運用到“心理疾病的治療”及色彩心理學(xué)的范疇。由此可見，色彩確實具有情感和特定的心理效應(yīng)。每一種顏色均可表達出自己特定的情感，而設(shè)計中合理的色彩選擇，自然賦予特定的印象。在設(shè)計中色彩的選擇又往往受到各自地區(qū)甚至各國文化的影響。各地文化復(fù)雜多變，在產(chǎn)品的配色上呈現(xiàn)出多元的特點。這一點，在時下普遍的電商類移動app色彩設(shè)計中有了最為明顯的呈現(xiàn)。為刺激用戶消費，其用色往往鮮艷，即純度較高，而為了區(qū)分彼此，色彩呈現(xiàn)多姿多彩。

從宏觀角度剖析，色彩的情感和地域文化直接影響到了設(shè)計本色色彩的選取。因此，色彩設(shè)計往往是被束縛的“框架設(shè)計”，而在框架上做的色彩選擇，更多的是通過色相、明度及純度的相應(yīng)變化，給予色彩以更多的空間層次感，在外部因素出現(xiàn)的同時，使設(shè)計本身更易被使用者記憶和接受。

3 色彩在移動app中的應(yīng)用

針對界面設(shè)計，設(shè)計者往往遵循“總體協(xié)調(diào)、局部對比”的基本原則。而正是因為色彩所特有的情感屬性，為了使產(chǎn)品本身脫穎而出，色彩便成為app界面中不可或缺的視覺因素，而良好的色彩組合是產(chǎn)品本身的利器。用戶通過色彩來理解產(chǎn)品，同時色彩亦影響用戶的情緒。合理的色彩選擇和協(xié)調(diào)的色彩區(qū)域劃分，更能突出重點，使用戶第一時間合理使用產(chǎn)品本身。反之，亦然。

通過普通配色，我們似乎很難看到模塊的“意義”。用戶在使用過程中，很難找到“切入點”，更談不上色彩是否融入主題環(huán)境。而將色彩賦予圖形化的意義，在眾多文本內(nèi)容中，用圖、用形突出點亮，便有了導(dǎo)向性的使用模式。在滿足導(dǎo)向的同時，“導(dǎo)航”逐漸開始起到關(guān)鍵作用。而導(dǎo)航按鈕與整體界面色調(diào)的基本統(tǒng)一，又使色彩具有了一定的象征意義。拋開軟件本身的功能性，倘若顏色從產(chǎn)品的本身分離出來，將色彩與軟件本身反向融合，將其創(chuàng)意概念用色彩充實或者暗示，而帶給用戶以全新的記憶點，更能增加用戶習(xí)慣性的“依賴”使用，迎合用戶心理使用需求。

顯然，現(xiàn)階段眾多app默認背景色彩為中性色調(diào)或者淺色調(diào)。因此，需選擇最能體現(xiàn)軟件本身主題的色彩作為整個界面的主色調(diào)。雖然主色調(diào)的選擇是建立在整體界面環(huán)境上的，但將背景色設(shè)置為淺色調(diào)或純色會更讓人感覺清新、柔和，不但便于整個界面的配色，亦能突顯移動界面的重點，從而讓主流用戶輕松識別最直接的信息點。而在輔助色的色彩運用上，應(yīng)達到相對的平衡感，即用色彩設(shè)計的三項最基本的原理：和諧與協(xié)調(diào)、對比與互補及冷暖色均衡。穩(wěn)定的界面色彩更能讓用戶需求得以滿足，增加親切感而使其保持一定的使用頻率。

當(dāng)然，界面的色彩設(shè)計還需結(jié)合界面中元素的色調(diào)和面積的大小，而做到總體和局部的良好詮釋。界面設(shè)計不同于網(wǎng)站設(shè)計，其不需太多的板塊和外部組件及顏色種類。網(wǎng)頁設(shè)計往往優(yōu)先考慮內(nèi)容的充實度，以板塊詮釋幾乎全部的“信息點”。而界面設(shè)計由于自身版面大小的局限，在設(shè)計中，必須首先確定菜單的導(dǎo)航、植入的廣告區(qū)域和基本空間元素及這三點所占的區(qū)域面積，再考慮“信息點”的介入方式及文字量。

而針對色彩“不確定元素”的屬性，移動app中用戶自主化的多元化色彩選擇成為新的切入點。關(guān)于這點，在現(xiàn)階段較為流行的眾多移動化通訊工具中得到較廣泛的普及。根據(jù)環(huán)境的不確定性，移動設(shè)備在不同光源和動靜狀態(tài)下，所需的較為合適的色彩值亦不同。對于暗環(huán)境，視線頻繁在顯示屏與環(huán)境這兩種亮度對比強烈的界面移動，很容易造成用戶的視覺疲勞，從而影響用戶的身心健康。因此，在夜晚或其他昏暗環(huán)境中，移動app的界面應(yīng)以暗色彩為主色。反之，相對的明亮環(huán)境，使用令用戶興奮的亮色調(diào)，更能刺激使用需求。于是，針對用戶自身使用環(huán)境變換而設(shè)計“皮膚”切換功能，是移動app產(chǎn)品設(shè)計工作中不容忽視的內(nèi)容。

4 結(jié)語

綜上所述，移動app作為時下最為流行的產(chǎn)品，為期達到主流用戶滿意，除了基本軟件定位、框架和創(chuàng)意外，產(chǎn)品設(shè)計中色彩的選擇和使用承載著相當(dāng)大的使命。在移動app出現(xiàn)伊始，產(chǎn)品多呈現(xiàn)為功能大于界面設(shè)計。而隨著蘋果手機ios7系統(tǒng)的更新，色彩的華麗感接踵而來，移動app的色彩設(shè)計方式全面更新?lián)Q代。而在滿足視覺感的同時，多方考慮產(chǎn)品本身的定位屬性，在主色調(diào)確定的同時將相互協(xié)調(diào)的輔助色彩加以詮釋，使色與色之間達到相對平衡但不失對比。再經(jīng)過多方實踐及調(diào)研，據(jù)其逐步深化設(shè)計，才能開發(fā)出更為優(yōu)秀的移動app軟件產(chǎn)品。

參考文獻

[1伊達千代.色彩設(shè)計的原理[M].中信出版社，2011

[2Dan Saffer.交互設(shè)計指南[M].機械工業(yè)出版社，2010

[3黃晟.基于用戶體驗的app設(shè)計研究[D].陜西科技大學(xué)碩士學(xué)位論文.2012

[4百度百科.色彩[OL/DB]. http：//baike.baidu.com/link？url=7xP_R0ybGof_wzyS08Atq_Xogw0K9gMYEN0SDqmKXiEppMWv_g7r7q2Bd9wr6DhwemQM_QmQXtztH__KqmwU6qumXOyJvmrQ15YNb_9UjXu

[5藍藍設(shè)計.如何在界面設(shè)計中“色”誘用戶？[OL/DB]. http：//www.lanlanwork.com/blog/？post=2878

作者簡介：寧璐（1987.07——），女（漢族），湖南長沙人，中級工業(yè)設(shè)計師，碩士研究生學(xué)歷，現(xiàn)從事交互設(shè)計及項目管理相關(guān)工作。