戴嫻子 楊棚瑞＊

（湖北大學(xué)藝術(shù)學(xué)院，湖北 武漢 430000）

隨著計算機(jī)網(wǎng)絡(luò)和移動終端應(yīng)用的發(fā)展以及智能手機(jī)的出現(xiàn)，色彩設(shè)計作為要素之一在其中的地位顯而易見，成為APP 界面設(shè)計中重要的一部分。適應(yīng)用戶的行為特征和心理特征是設(shè)計產(chǎn)品的基本前提。而在設(shè)計過程中，產(chǎn)品外觀和操作過程是設(shè)計基礎(chǔ)，用戶的心理需求和心理反饋是重要目的。將認(rèn)知心理學(xué)應(yīng)用于APP 界面的色彩研究，可以滿足用戶的行為效率和審美品位即APP 的易用性和藝術(shù)性，亦能提升產(chǎn)品的用戶認(rèn)可度。

注意、知覺、表象、記憶、思維和言語等是認(rèn)知心理學(xué)里所說的認(rèn)知過程，是人的高級心理過程，是人對于事物特點的認(rèn)識過程，即信息加工過程。用戶作為主體感受產(chǎn)品帶來的客觀反應(yīng)，這是簡單直接的心理規(guī)律，是認(rèn)知的起點；知覺以感覺為基礎(chǔ)，是對于各部分、各屬性及相互關(guān)系的感知整合，例如APP 界面色彩是由各個元素相組合形成的一個整體，即凸顯整個APP 的風(fēng)格特征；利用點綴色、大小等對比以達(dá)到醒目的效果，即引起注意之后提供正確和充分的信息以支持進(jìn)一步的處理；人腦對過去經(jīng)驗的保持和再現(xiàn)是記憶的體現(xiàn)，用戶使用APP 就是接受界面效果帶來的客觀刺激，這種客觀現(xiàn)象的持續(xù)效果最終呈現(xiàn)為主觀意識，只有在持續(xù)刺激的作用下，感覺和知覺才會存在；想象即是用戶對于產(chǎn)品使用之后獲得的反饋心理，例如在博物館APP 中，用戶瀏覽信息內(nèi)容，那么腦海里就會根據(jù)界面整體風(fēng)格和色彩配合內(nèi)容圖片帶來的刺激感受想象自己身臨其境的一種主觀現(xiàn)象；而思考特性（思維）機(jī)動是對于客觀事物和主觀感受的反映，這個反映是指事物的表象和內(nèi)在之間的聯(lián)系，用戶在使用APP 的過程中，通過界面與色彩之間的相互作用，映射到產(chǎn)品設(shè)計技術(shù)之外的實用意義，即“設(shè)計為人”，用戶作為產(chǎn)品設(shè)計的中心，服務(wù)于用戶的體驗感覺和心理感知。

從廣義上來說，認(rèn)知心理學(xué)是對“人的認(rèn)知以及人在認(rèn)知時的認(rèn)知過程”。認(rèn)知心理學(xué)結(jié)合色彩學(xué)在APP 界面設(shè)計中，其中相關(guān)的理論主要表現(xiàn)在感知覺方面、注意方面和思維方面，從人的信息加工模型（圖1）來看，設(shè)計中主要側(cè)重點在于注意（感覺）和思維（同時也包含感覺到思維的認(rèn)知過程）。

圖1 “認(rèn)知心理學(xué)”人類信息加工模型

1 塑造APP 界面視覺設(shè)計色彩認(rèn)知

從認(rèn)知心理學(xué)角度出發(fā)，色彩在APP 界面設(shè)計中與界面風(fēng)格相輔相成，界面中的色彩作用不是簡單地向用戶傳達(dá)APP 的藝術(shù)性，而是首先突出整體風(fēng)格激發(fā)用戶對于APP 使用的興趣和動機(jī)，然后再將APP 的色彩符號與界面操作性有機(jī)地結(jié)合起來，用戶不再是受不明確指示的圖標(biāo)進(jìn)行被動行為，而是利用色彩帶來的使用效率主動地進(jìn)行選擇性操作。

所謂“再認(rèn)知”是認(rèn)知心理學(xué)的思維過程。將APP 界面中的色彩配置與抽象信息相結(jié)合達(dá)到具象的信息傳達(dá)，這個過程使產(chǎn)品具有“自述”功能，通過色彩里的鄰近色和對比色凸顯信息內(nèi)容，將信息瀏覽順序和用戶的認(rèn)知心理模式相匹配，使用戶能正確理解并達(dá)到操作目的[1]。

1.1 “簡潔性”風(fēng)格化概念

縱觀部分博物館APP 界面設(shè)計，風(fēng)格普遍側(cè)重于整個界面的裝飾效果，操作比較繁復(fù)。據(jù)問卷調(diào)查研究結(jié)果表明，大部分用戶對于APP 的使用評價在于界面華麗但色彩指示不明確等問題，忽略了使用效率；而另一部分的APP 界面設(shè)計大多數(shù)為常規(guī)的滿足用戶體驗功能的簡單設(shè)計，主要出發(fā)點在于功能的明確性，界面之間沒有過多的手勢操作，色彩運(yùn)用簡潔。例如博物館APP 的國際主義風(fēng)格（圖2），整個界面采用簡單的白、灰色調(diào)，沒有過多的顏色渲染，主要突出博物館內(nèi)的展品圖片以及導(dǎo)航信息。宏觀上，從用戶的認(rèn)知心理角度出發(fā)，生理記憶與產(chǎn)品風(fēng)格相匹配，產(chǎn)品展現(xiàn)再反饋給用戶心理認(rèn)知；此外，APP 的界面色彩轉(zhuǎn)化的具象信息引導(dǎo)了用戶的使用效率。

界面的“簡潔性”即“簡化”，不是信息傳遞減少或缺少，而是將復(fù)雜信息進(jìn)行整合和重新組織。而“簡化”對于用戶行為認(rèn)知是一把雙刃劍：一方面，人們對于簡潔、對稱、規(guī)律圖形具有一定的喜愛程度；另一方面，簡化、單一使人們的操作行為變得簡單、程序化。

圖2 中統(tǒng)計的數(shù)據(jù)顯示，有85%的人群支持博物館APP 的開發(fā)，有利于隨時隨地參觀瀏覽，打破地域和時間限制；有79%的人更加喜歡簡約風(fēng)格的APP 界面。另外，有79%的人使用APP 過后感覺不太符合對應(yīng)博物館的風(fēng)格。由此可以表明大眾對于APP 界面有較高的生理需求和情感需求。目前人們獲取信息的途徑基本以互聯(lián)網(wǎng)和APP 為主，對于展覽路線、展覽時間以及館內(nèi)展示信息的查詢，有57%的人會覺得由于顏色處理不當(dāng)導(dǎo)致操作比較繁復(fù)，部分按鈕凸顯不清晰，57%的人不清楚使用APP 的瀏覽順序，這說明了APP 界面中的色彩層級關(guān)系不明確，使用戶把握不到主次，使用期間不知從何進(jìn)行。以上從博物館APP 視覺界面出發(fā)，分析了用戶對于整體風(fēng)格、界面層級以及操作按鈕等色彩分布的心理需求，要求設(shè)計師站在用戶角度探析APP 的使用易用性原則。

圖2 博物館APP

1.2 界面色彩“總”“分”概念

“總”即風(fēng)格整體，“分”即色彩元素個體，是人們在進(jìn)行認(rèn)知行為時傾向?qū)⒏鱾€色彩元素進(jìn)行整體化認(rèn)知。例如APP 界面設(shè)計中色彩分為鄰近色、相似色以及對比色，運(yùn)用在產(chǎn)品中為一個整體契合界面風(fēng)格，傳輸給用戶。

而APP 界面設(shè)計中，將功能和信息按區(qū)域塊劃分，使色彩的合理運(yùn)用既達(dá)到用戶減少繁復(fù)操作和移動距離，又可以在效果上達(dá)到整體性和統(tǒng)一性。

2 基于認(rèn)知心理學(xué)色彩在APP 界面設(shè)計中的設(shè) 計原則

色彩在APP 界面設(shè)計中的設(shè)計原則運(yùn)用邏輯思維和設(shè)計常識等原理設(shè)定設(shè)計方案，使用戶在使用APP 時能準(zhǔn)確、流暢地找到操作按鈕進(jìn)行行為動作達(dá)到交互目的。在進(jìn)行界面色彩設(shè)計時，根據(jù)色彩學(xué)的原理處理好內(nèi)容和形式美之間的關(guān)系。在APP界面色彩設(shè)計中，設(shè)計原則在于掌握色彩的風(fēng)格與APP 風(fēng)格的統(tǒng)一，特別是主題色、強(qiáng)調(diào)色和輔助色三大色彩的關(guān)系調(diào)和[2]。色彩的合理運(yùn)用不僅提升APP 整體視覺效果，同時給用戶帶來更好的使用體驗感。此應(yīng)用案例圍繞Starbucks APP 界面設(shè)計展開，深入研究認(rèn)知心理學(xué)在界面設(shè)計中的設(shè)計原則體現(xiàn)。

2.1 主題色帶動用戶知覺感知

界面設(shè)計中的主題色即界面色彩中的主色調(diào)。主題色主要突出整體APP 風(fēng)格給用戶帶來的感覺，并且?guī)悠渌o助色和強(qiáng)調(diào)色，貫穿了APP 的整體，諸如啟動圖標(biāo)、導(dǎo)航欄、部分控件及按鈕上等，但是主題色一般涉及的面積較少，約占整個APP 界面的20%。在Starbucks APP 界面中的呈現(xiàn)非常具有代表性，界面標(biāo)準(zhǔn)色以綠色為主作為出發(fā)點展開進(jìn)行同類色的變換，使環(huán)境要素（界面風(fēng)格）形成知覺感知傳輸給用戶的大腦形成思維模式，而記憶輸出與人腦相互作用，并達(dá)到用戶認(rèn)知范圍的整體企業(yè)視覺風(fēng)格相統(tǒng)一（圖3—4）。

圖3 Starbucks APP 標(biāo)準(zhǔn)色

圖4 Starbucks APP 界面主題色應(yīng)用

2.2 輔助色帶動用戶思維感知

通常人的思維并不是由邏輯思維作為主導(dǎo)的，其基本思維方式有模仿思維、探索思維、經(jīng)驗思維以及情緒思維。如果單純運(yùn)用同一個顏色設(shè)計整個APP 界面，那顯然是不能滿足用戶的期望值，用戶作為擁有高級思維模式的人類，更渴望擁有滿足審美及藝術(shù)思維的界面，那么輔助色可以達(dá)到這樣的效果，輔助色與主題色相互呼應(yīng)，界面層次清晰，展示內(nèi)容板塊化，使用戶可以通過自己的行為操作更自然地進(jìn)行交互活動，同時配合主題色呼應(yīng)APP 風(fēng)格特征，起到畫面的平衡作用，使界面更加豐富和完美，從而增強(qiáng)整個APP 的活力。

案例中，除了原有的綠色之外，Starbucks 還將綠色逐步延伸，呈現(xiàn)出與之協(xié)調(diào)的輔助顏色，所有核心功能板塊都向主體色調(diào)靠攏，巧妙地將綠色環(huán)保的理念引入其品牌視覺設(shè)計中，為品牌賦予更深層含義（圖5—6）。

圖5 Starbucks APP 輔助色

圖6 Starbucks APP 界面輔助色應(yīng)用

2.3 點綴色帶動用戶注意感知

注意是精神高度集中的體現(xiàn)，涵蓋了用戶在操作中需要的選擇和信息處理的過程。如何做到“快速”，點綴色起到了相應(yīng)作用。注意的過程中，時間轉(zhuǎn)瞬即逝，如若抓不到關(guān)鍵信息，那么就做不到有效的交互行為。另外，注意的范圍有限，視覺注意力無法涵蓋所有的信息內(nèi)容，且易受機(jī)動影響，沒有醒目的顏色傳遞關(guān)鍵信息，用戶很容易對此忽視。

而點綴色主要運(yùn)用在需要強(qiáng)調(diào)的區(qū)域或者下一步需要操作的按鈕處，強(qiáng)調(diào)色一般會使用明度、純度都偏高的顏色去使用，并且使用面積較小。主要作用是引導(dǎo)用戶操作，起到視覺導(dǎo)向和增強(qiáng)的效果，例如收藏、點贊、消息提醒等區(qū)域。在Starbucks APP界面中，以綠色為背景則以黃色作為強(qiáng)調(diào)色，從視覺色彩心理學(xué)角度來看，人們普遍認(rèn)為明度越低的越靠后，明度越強(qiáng)則越靠前。在界面設(shè)計中，將點綴色多用于明度偏高的顏色，則可以提醒用戶在使用APP 時進(jìn)行信息查看，了解官方活動（圖7）。

圖7 Starbucks APP 點綴色

以上Starbucks APP 界面色彩案例結(jié)合人類信息的加工模型圖，可以看到整個系統(tǒng)是一個完備的整體，界面設(shè)計風(fēng)格為用戶大腦提供外部信息的刺激，再通過感官去接收信息，然后大腦將這些外部刺激進(jìn)行加工，無論是主題色、輔助色還是點綴色，最終進(jìn)入用戶思維系統(tǒng)進(jìn)行整體的信息匹配。然后通過控制系統(tǒng)（人腦）做出相應(yīng)的決策，最終達(dá)到信息的反應(yīng)輸出。這不僅是企業(yè)整體文化的體現(xiàn)，也是滿足用戶最高心理需求的表現(xiàn)。

3 基于認(rèn)知心理學(xué)色彩在APP 界面設(shè)計中的應(yīng) 用價值

色彩可以決定界面風(fēng)格及對整體氛圍傳達(dá)給用戶的情景作用，優(yōu)秀的色彩運(yùn)用可以提高設(shè)計的高級感。而色彩的延續(xù)性即用戶瀏覽界面行為時，感知注意能力引導(dǎo)行為沿著色彩或明度層次的方向移動。在《網(wǎng)頁設(shè)計元素對PAD 情感體驗的影響研究》[3]中提到動眼實驗驗證方法，此研究結(jié)果表明用戶在瀏覽頁面時色彩在其中起到關(guān)鍵作用，說明色彩對比可以有效牽引用戶視線，合理的色彩運(yùn)用能使用戶在界面進(jìn)行瀏覽時更流暢，停留在界面的時間更久。

提供的這一理論依據(jù)在輔助用戶在線上瀏覽展館內(nèi)容、滿足用戶的情感需求以及增加界面的藝術(shù)性3 個方面起到作用。

3.1 引導(dǎo)用戶線上瀏覽

整體架構(gòu)基礎(chǔ)在APP 界面的色彩設(shè)計中起到重要的作用。其劃分出不同的區(qū)域，構(gòu)建出不同的模塊，凸顯出重要的信息，使用戶可以快速找到自己需要瀏覽的內(nèi)容，建立“直接”“高效”和“正確”的關(guān)系。確保APP 界面設(shè)計的“易用性”[4]。比如，主色調(diào)確定以后，利用輔助色進(jìn)行設(shè)計界面的模塊劃分，將信息與信息之間進(jìn)行有計劃的整合，提升空間層次和信息區(qū)域明確，再者，合理的色彩搭配不會使用戶視覺疲勞。而界面中點睛色則可以在用戶使用APP 時使目光快速鎖定，方便進(jìn)行下一步操作。有的APP 界面設(shè)計的點睛色透明度過高或者顏色不夠突出，則會使用戶在選擇下一步操作時誤觸。

3.2 引發(fā)用戶共鳴

由于經(jīng)濟(jì)和技術(shù)的發(fā)展，人們對于數(shù)字產(chǎn)品的消費需求達(dá)到了更高的層次——精神層次。在用戶首次下載APP 時，色彩往往會給用戶留下第一印象，由此可見用戶的第一體驗感能使其在眾多APP 中脫穎而出，所以色彩在APP 界面設(shè)計中有吸引用戶、引發(fā)用戶共鳴的作用。

明度、色相和飽和度是色彩的3 個主要要素，是設(shè)計師在設(shè)計方案時需要考慮的重要內(nèi)容。明度表現(xiàn)在色彩的明亮程度上，通過不同的亮度呈現(xiàn)出色彩的層次感，增加色彩應(yīng)用的協(xié)調(diào)感。在界面中，使用清淡的綠色及黃色，使得界面中的元素之間呈現(xiàn)出簡單、直觀的對比。色相是色彩應(yīng)用中的主要構(gòu)成要素，不同的色相表現(xiàn)出不同的風(fēng)格形式，例如紅色表現(xiàn)出一種艷麗溫暖的風(fēng)格；淡藍(lán)色表現(xiàn)出舒暢、清新的風(fēng)格；棕色表現(xiàn)出莊重、沉穩(wěn)的風(fēng)格等。設(shè)計師通過不同的色相，結(jié)合APP 界面所要表達(dá)的主題做出相應(yīng)的選擇，即增強(qiáng)APP 對于用戶的情感反饋。最后，飽和度表現(xiàn)出來的是色彩的純度，純度越高色彩越鮮艷，純度的不同可以呈現(xiàn)出不同的質(zhì)感[5]。同時在界面按鈕上飽和度的不同呈現(xiàn)的強(qiáng)弱效果也是對于信息展示的明確指示，操作行為指示越明顯，用戶受到的信息傳達(dá)就越強(qiáng)烈。

3.3 增加界面的藝術(shù)性

界面的藝術(shù)性會受到色彩的影響，好的色彩設(shè)計可以提高整個界面的感官藝術(shù)。任何一個APP 設(shè)計不僅是產(chǎn)品，也是藝術(shù)作品的體現(xiàn)。其達(dá)到用戶的心理需求是前提，而進(jìn)一步滿足用戶的高層次要求是完成設(shè)計的最終目的，并逐一解決產(chǎn)品在使用過程中的心理反饋。在整個頁面中，所需要用到的顏色不宜過多，“七分顏色三分花”，這句話闡明了色彩在界面設(shè)計中的價值[6]。對于一個好的界面設(shè)計來說，色彩是功不可沒的，簡潔鮮明的色彩搭配可以提升整個APP 界面的使用價值?？梢哉f，是色彩增強(qiáng)了界面藝術(shù)的感染力，凸顯獨一無二的視覺調(diào)性，打造出具有競爭力的產(chǎn)品。

4 結(jié)語

綜上所述，色彩在APP 界面中的作用不容小覷，它是“無聲的推銷員”[7]，賦予了APP 界面靈魂。一個交互產(chǎn)品的誕生都是由簡單到復(fù)雜、由表象到里象的發(fā)展過程。視覺呈現(xiàn)的色彩樣式只是其在界面設(shè)計的外在表現(xiàn)，而從抽象信息到具象信息的傳達(dá)演變是設(shè)計研究的目的。APP 界面中的色彩設(shè)計不能單方面從平面設(shè)計角度出發(fā)來達(dá)到最終目的，而是應(yīng)該結(jié)合用戶對于界面色彩的心理認(rèn)知層面來剖析整體色彩運(yùn)用原理，符合“設(shè)計為人”的概念層面。優(yōu)秀的APP 界面色彩設(shè)計不僅能促進(jìn)人與產(chǎn)品之間的良好交互，而且也滿足了人對于產(chǎn)品的情感需求和審美藝術(shù)，只有從表到里探索人文和精神內(nèi)涵、把握人的認(rèn)知心理形成科學(xué)的研究方案，APP 界面設(shè)計才更加具有競爭力，在互聯(lián)網(wǎng)眾多產(chǎn)品迸發(fā)的時代嶄露頭角。