鄧列成
摘 要:為了深入研究色彩編碼在可視化中的應(yīng)用以及其對受眾可用性的影響,并改善用戶在可視化界面操作的中的用戶體驗(yàn)。本文綜合了現(xiàn)有理論文獻(xiàn)并結(jié)合實(shí)踐探索與案例分析,旨在探討如何在實(shí)際應(yīng)用中合理、靈活地運(yùn)用色彩,以提升可視化中信息的表達(dá)便捷性、高效性。并提煉出可視化設(shè)計(jì)中色彩應(yīng)用方法和原則,為可視化設(shè)計(jì)領(lǐng)域提供有關(guān)色彩編碼的一定的實(shí)踐和指導(dǎo),并在利用色彩增強(qiáng)受眾信息理解速度等方面提供了有價(jià)值的參考借鑒。
關(guān)鍵詞:可視化設(shè)計(jì);數(shù)據(jù)可視化;色彩心理
Abstract: In order to delve into the application of color encoding in visualization, its impact on audience usability, and improve the user experience in operating visual interfaces, this paper integrates existing theoretical literature with practical exploration and case analysis. The objective is to explore how to use color in a rational and flexible manner in real-world applications to enhance the convenience and efficiency of information expression in visualization. Additionally, this research aims to extract methods and principles of color application in visual design, providing practical guidance and insights regarding color encoding in the field of visual design. It also offers valuable references and guidance for practitioners in utilizing color to enhance audiences speed of information comprehension and other related aspects.
Keywords: Visual design;data visualization;color psychology
0 引言
數(shù)據(jù)可視化技術(shù)是當(dāng)今社會(huì)獨(dú)有的視覺形式。然而,設(shè)計(jì)適當(dāng)?shù)目梢暬瘉砝斫鈹?shù)據(jù)是一個(gè)復(fù)雜的過程,其中涉及到數(shù)據(jù)挖掘、可視化算法和用戶界面等多個(gè)方面。信息設(shè)計(jì)大師愛德華·塔夫特認(rèn)為,優(yōu)秀的視覺設(shè)計(jì)應(yīng)該是“將清晰的思考視覺化”。
影響可視化信息傳達(dá)的原因多種多樣,本文主要從色彩可用性角度切入,探討色彩顯著性對于可視化中信息搜索和信息識(shí)別的效率的影響,探究視覺設(shè)計(jì)中的色彩是如何實(shí)現(xiàn)“將清晰的思考視覺化”。
1 視化設(shè)計(jì)與色彩可用性
由于數(shù)據(jù)在當(dāng)今社會(huì)呈現(xiàn)出熱火朝天的發(fā)展態(tài)勢,因而對于數(shù)據(jù)可視化探究變得不可避免。它并不是一個(gè)新學(xué)科,計(jì)算機(jī)技術(shù)和統(tǒng)計(jì)學(xué)發(fā)展早已為數(shù)據(jù)可視化的出現(xiàn)和活躍奠定了深厚的基礎(chǔ),如今隨著網(wǎng)絡(luò)的普及滲入醫(yī)療、教育、經(jīng)濟(jì)、人文、政府等社會(huì)的等各個(gè)其他領(lǐng)域。簡單來說,數(shù)據(jù)可視化是部分科學(xué)和部分美學(xué)的結(jié)合,它將信息和設(shè)計(jì)融合,利用圖形和表格的易傳達(dá)性,幫助受眾便捷地區(qū)分、感知并了解更多信息。David McCandless在《數(shù)據(jù)可視化之美》的演講中就將視覺化的信息比數(shù)據(jù)密林中的空曠天地,可以將人們從令人窒息的信息洪流中解放出來[1]。
研究發(fā)現(xiàn),色彩差異可以在瞬時(shí)的200毫秒之內(nèi)被檢測到,甚至可能在個(gè)體意識(shí)到色彩變化之前就已被察覺(即所謂的前意識(shí)注意),由此可以預(yù)見色彩對信息識(shí)別的重要作用。Kevin Mullet在《設(shè)計(jì)視覺界面》中指出:“設(shè)計(jì)關(guān)注的是發(fā)現(xiàn)最適于傳達(dá)某些信息的呈現(xiàn)方式”[2]。因而設(shè)計(jì)中色彩編碼的合理運(yùn)用意義重大,層級(jí)分明和豐富多樣的色彩表現(xiàn)方式能夠讓原本復(fù)雜且龐大的數(shù)據(jù)集轉(zhuǎn)換為精心設(shè)計(jì)的視覺設(shè)計(jì),使之被用戶高效的處理。
2 可視化設(shè)計(jì)中色彩心理分析
2.1 色覺感知和色彩呈現(xiàn)
根據(jù)現(xiàn)代視覺生理學(xué)原理,物理顏色通過神經(jīng)生理機(jī)制轉(zhuǎn)化為人類感知的色彩,使我們能夠分辨光暗和顏色,進(jìn)而觀察和理解這個(gè)物質(zhì)世界。這一感知過程主要依賴于人眼視網(wǎng)膜內(nèi)的視桿細(xì)胞和視錐細(xì)胞。視桿細(xì)胞能察覺明暗但無法識(shí)別顏色,視錐細(xì)胞則對顏色敏感,它們通過紅、綠、藍(lán)像素組合來探測并呈現(xiàn)更多的顏色。
事實(shí)上,每種視錐細(xì)胞敏感的光譜比我們通常想象的要廣泛,而且其敏感范圍存在重疊。因此,我們以視錐細(xì)胞的感知頻率大致將其分為低頻、中頻和高頻細(xì)胞,這些細(xì)胞分別對不同頻譜范圍內(nèi)的光信號(hào)有敏感反應(yīng)。
大腦通過對視神經(jīng)傳來的中、低頻視錐細(xì)胞信號(hào)進(jìn)行減法處理,去除冗余信息并提取出“紅—藍(lán)”減影信號(hào)通[3]。類似地,其他神經(jīng)元對來自高、低頻視錐細(xì)胞的信號(hào)進(jìn)行減法運(yùn)算,得到“黃—藍(lán)”剪影信號(hào)通道。第三組通過將中、低頻視錐細(xì)胞的信號(hào)相加,形成亮度信號(hào)通道。人眼的視錐細(xì)胞充當(dāng)三種色光的接收器,將接收到的光波轉(zhuǎn)化為神經(jīng)脈沖,使顏色信息傳遞至大腦,大腦通過綜合處理這些傳入信號(hào),就能呈現(xiàn)出豐富的顏色。
通過對色覺感知方式探究,我們了解了人類視覺系統(tǒng)的獨(dú)特特質(zhì)。首先,我們發(fā)現(xiàn)人眼對顏色和亮度差異的敏感度遠(yuǎn)超過對絕對亮度水平的敏感度,尤其對于對比鮮明的邊緣更加敏感。其次,人類的色彩辨別能力存在一定的限制,其識(shí)別能力受到深淺度、色塊大小和分隔距離等視覺系統(tǒng)運(yùn)作方式的影響。最后,色覺感知能力較弱的人群也應(yīng)被充分考慮。
2.2 可視化中的色彩心理
2.2.1 格式塔
格式塔理論由奧地利心理學(xué)家艾倫菲爾于1912年提出。格式塔心理學(xué)強(qiáng)調(diào)經(jīng)驗(yàn)和行為的整體性,其核心觀點(diǎn)是“整體不等于部分之和”,意識(shí)不只是感覺元素的集合,行為也并非僅僅是反射弧的循環(huán)。最重要的格式塔視覺法則包括:接近性原則、相似性原理、對稱性原理、封閉性原理、連續(xù)性原理、主題/背景原理以及共同命運(yùn)原理。巧妙地運(yùn)用這些原則,將極大地促進(jìn)可視化中信息清晰和簡潔的傳達(dá)。
在色彩選擇和搭配中,這些原則發(fā)揮著關(guān)鍵作用。例如在接近性原則中,物體間的距離會(huì)影響我們對它們是否屬于同一類信息的感知。左側(cè)黑色星形圖案由于距離接近,人們會(huì)視覺上認(rèn)為它們屬于一個(gè)整體;相反,右側(cè)的圖案則被視為另一個(gè)整體(圖1)。據(jù)此,我們可以通過調(diào)整物體間距和色彩區(qū)分,來降低用戶界面的視覺混亂感和復(fù)雜度。
其他格式塔原則也為優(yōu)化可視化中的視覺效果提供了幫助。在視覺場景中各種格式塔原理并不是相互孤立的,而是共同且交織地起作用。設(shè)計(jì)者需要綜合運(yùn)用不同原理并進(jìn)行大量對比,以確定各個(gè)設(shè)計(jì)元素、色彩以及它們之間的關(guān)系是否符合設(shè)計(jì)的初衷。
2.2.2 符號(hào)學(xué)
符號(hào)學(xué)在英語中有兩個(gè)意義相同的名詞:semiology和semiotic,前者由瑞士語言學(xué)家索緒爾創(chuàng)造,后者由美國哲學(xué)家皮爾斯提出[4]。本文將重點(diǎn)討論符號(hào)學(xué)在設(shè)計(jì)中的應(yīng)用,特別是在情感工程和產(chǎn)品語義學(xué)領(lǐng)域。
產(chǎn)品語義學(xué)以符號(hào)學(xué)為理論基礎(chǔ),研究產(chǎn)品的信息與其功能直接的關(guān)系。它將產(chǎn)品視為設(shè)計(jì)師和用戶之間的直接溝通媒介,旨在傳達(dá)產(chǎn)品的內(nèi)在含義并體現(xiàn)社會(huì)價(jià)值。設(shè)計(jì)師通過“編碼”的過程將原始信息加工,將物理實(shí)用性、文化意義和審美價(jià)值等融入產(chǎn)品中,從而使其具有符號(hào)化的特征。消費(fèi)者作為接收者則進(jìn)行“解碼”過程,解構(gòu)符號(hào)化的產(chǎn)品并形成準(zhǔn)確的認(rèn)知和感知[5]。
感性工學(xué)則主張“形式追隨情感”的哲學(xué)理念,該理念認(rèn)為成功的產(chǎn)品設(shè)計(jì)不僅需要滿足功能性需求,更應(yīng)考慮滿足消費(fèi)者的主觀心理需求。但用戶對產(chǎn)品的感知是一個(gè)復(fù)雜且高度主觀的過程,有研究表明,大部分產(chǎn)品設(shè)計(jì)更多是設(shè)計(jì)師審美的體現(xiàn),而非對客戶趨勢的真實(shí)反映。為了解決這些問題,感性工學(xué)進(jìn)行了大量研究,探索產(chǎn)品設(shè)計(jì)元素與人類情感需求的關(guān)系,嘗試通過出表法、印象法等理解用戶感知的方法[6],將人的感性因素量化,以此來把握消費(fèi)者的感受和評價(jià)。如谷歌公司的Laura Granka通過使用眼動(dòng)追蹤技術(shù)來研究用戶行為,并發(fā)表了一系列研究成果,促進(jìn)了產(chǎn)品交互的流暢性。
3 色彩對于頁面可用性的探索
本章通過對于可視化設(shè)計(jì)色彩的心理和生理研究,將格式塔理論和符號(hào)學(xué)理論與實(shí)踐探索相結(jié)合,總結(jié)了頁面中色彩可用性設(shè)計(jì)的相關(guān)原理。
3.1 視覺設(shè)計(jì)的易用性、易理解性
色彩對于信息傳達(dá)如何更加容易和準(zhǔn)確,不得不與社會(huì)認(rèn)知學(xué)和生理理論相結(jié)合使其變得高效。用戶處理可視化編碼的過程主要分為三個(gè)模式感知階段,視覺處理系統(tǒng)快速的將視野分為不同的區(qū)域和形式,反饋到大腦對信息進(jìn)行處理和編輯。我們在視覺處理階段對于顏色的調(diào)整和與優(yōu)化,將有助受眾對于信息的快速理解能力和高效處理能力。對于顏色的搭配主要分為以下幾個(gè)方面。
3.1.1 視覺結(jié)構(gòu)和視覺層次的設(shè)計(jì)
在可視化頁面設(shè)計(jì)中,層次化的視覺呈現(xiàn)方式,能夠幫助受眾輕松的跳過干擾信息快速找到關(guān)鍵點(diǎn)。設(shè)計(jì)者將中心螺旋圖的飽和度與背景拉開差距,使人的視覺注意力在圖片中心,次要信息以灰色為主,減輕了視覺干擾,使設(shè)計(jì)閱讀起來高效快速(圖2)。
由此我們基于視覺結(jié)構(gòu)總結(jié)出一些規(guī)律:首先盡量使用少于6個(gè)不同可變的亮度層次。大塊的視覺區(qū)域應(yīng)當(dāng)使用飽和度較低的顏色;小塊視覺區(qū)域則相反,飽和度高、明度跟亮的顏色能幫助用戶更加容易辨認(rèn)。其次小塊區(qū)域的標(biāo)記通常用點(diǎn)和線更加合理,能夠保證信息的可識(shí)別度,而對于大塊視覺區(qū)域面和線則更加合適。
3.1.2 頁面細(xì)節(jié)色彩的規(guī)劃和重點(diǎn)信息的視覺信息的強(qiáng)調(diào)
人的視覺系統(tǒng)對于顏色間的差別感知是有限的,顏色的深淺度、色塊大小和分隔距離這三個(gè)方面影響了我們區(qū)分顏色的能力。通常在可視化界面中,以下幾個(gè)原則能夠確保用戶能夠高效獲取信息:第一,用飽和度、亮度以及色相區(qū)分顏色,通過在灰度模式下觀察顏色的區(qū)分狀況,確保色彩之間有較高的反差;第二,有限的資源優(yōu)先分配,通過提高小面積色彩的飽和度來增加色彩顯著性。例如,標(biāo)記出錯(cuò)信息,可以運(yùn)用高純度、明度的紅色提示用戶操作不當(dāng);第三,注意色塊之間的分隔距離,運(yùn)用顏色區(qū)分區(qū)域,功能相關(guān)的信息距離較近,不相關(guān)的信息距離分隔較遠(yuǎn),以此優(yōu)化用戶視覺流程。
3.1.3 對于色盲人士的考慮
據(jù)數(shù)據(jù)表明,大約有8%的男性和0.5%的女性有顏色視覺障礙。因此,為了特殊人群的便利性,在設(shè)計(jì)時(shí)在顏色之外使用其他文字或符號(hào)提示,不完全依賴顏色,如加拿大某地區(qū)通過圓、正方形以及圓形來區(qū)分紅綠燈的顏色;確保色彩的對比度,在完全灰度的情況下可以識(shí)別,對比度越高,色盲人士越能看出來兩個(gè)不同項(xiàng)目的差別。
3.2 視覺設(shè)計(jì)的美觀性、歡愉性
在滿足可視化實(shí)用性和高效傳達(dá)的基本需求后,審美元素將成為激發(fā)用戶興趣和熱情的關(guān)鍵因素。這些元素可以是純裝飾性的,也可以是被用于提高可視化成果的接受度的。可視化中色彩的表現(xiàn)形式多種多樣,但大多遵循以下原則。
3.2.1 色調(diào)統(tǒng)一原則
格式塔原理認(rèn)為人類視覺是整體的,視覺設(shè)計(jì)時(shí)要注意色彩搭配的和諧性。設(shè)計(jì)師應(yīng)避免將對抗色過度靠近,以防視覺對抗產(chǎn)生視覺干擾和讓人難受的心理感受。在有意識(shí)地考慮全局效果的前提下,設(shè)計(jì)師可以通過弱化某些顏色或突出某些信息以改變可視化的使用方式。
3.2.2 形式的創(chuàng)新性原則
一個(gè)真正“美麗”的可視化效果應(yīng)該提供一種新穎的數(shù)據(jù)觀察視角或獨(dú)特的美學(xué)效果。這些新穎性并非為了追求新穎而設(shè)計(jì),而是為了提高效率。Federica在描繪的信息圖中,運(yùn)用了獨(dú)特的黃金分割海螺來表示數(shù)據(jù),并通過海螺所在的位置高低和形狀大小及完整程度暗示數(shù)量的多少,十分具有創(chuàng)意和美學(xué)觀感(圖3)。
3.3 視覺設(shè)計(jì)的相關(guān)性、聯(lián)想性
當(dāng)色彩特征不斷積累,觀察者對色彩時(shí)會(huì)產(chǎn)生特殊的情感,這是人類記憶與色彩相互作用的結(jié)果。此時(shí),色彩不再僅是簡單的信息,而是成為傳遞人類情感的媒介。根據(jù)符號(hào)學(xué)理論,色彩與社會(huì)性的結(jié)合在可視化中的使用主要分為以下兩種情況。
3.3.1 文化和知識(shí)相關(guān)的可視代碼
不同的知識(shí)文化體系對使得人們能對代碼具有不同的接受度或者不同的理解,地質(zhì)學(xué)家感知地表地形結(jié)構(gòu)的理想方式是等高線圖,對于普通大眾來說陰影圖標(biāo)識(shí)則更加直觀。色彩形成的社會(huì)文化環(huán)境,包括熟悉的色彩和元素,期望的使用場景并與其統(tǒng)一的全局風(fēng)格等。熟悉的外觀和感覺可以使讀者更輕松或者舒適地接受展現(xiàn)處理的信息。
3.3.2 經(jīng)驗(yàn)和回憶相關(guān)的可視代碼
通過對外部刺激特征進(jìn)行編碼,觸發(fā)觀察者記憶中的類型編碼。比如,可以綜合考慮色彩對于心理效應(yīng)的影響,如輕重感、強(qiáng)弱感、進(jìn)退感、冷暖感等[7],以實(shí)現(xiàn)色彩功能美和藝術(shù)美的統(tǒng)一。
4 結(jié)語
可視化設(shè)計(jì)是一種跨學(xué)科的實(shí)踐,涉及藝術(shù)、設(shè)計(jì)、計(jì)算機(jī)科學(xué)、心理學(xué)和社會(huì)學(xué)等多個(gè)領(lǐng)域。其設(shè)計(jì)目標(biāo)不僅是傳遞信息,還包括激發(fā)觀察者的興趣,引導(dǎo)他們對數(shù)據(jù)進(jìn)行深入的理解和探索。
在設(shè)計(jì)過程中,設(shè)計(jì)師需要從多個(gè)角度考慮,包括但不限于數(shù)據(jù)的性質(zhì)、目標(biāo)受眾的需求、實(shí)際使用場景、當(dāng)前可用技術(shù)等等。這需要設(shè)計(jì)師具有豐富的經(jīng)驗(yàn)和專業(yè)知識(shí),才能創(chuàng)建出既美觀又實(shí)用的可視化設(shè)計(jì)。
因此,我們期待在未來,可視化設(shè)計(jì)將進(jìn)一步發(fā)展,并在不同領(lǐng)域發(fā)揮其重要作用,也希望更多的研究能夠探索如何更好地利用可視化設(shè)計(jì)來解釋復(fù)雜的數(shù)據(jù),幫助人們更好地理解世界。
5 參考文獻(xiàn)
[1][美]Julie Steele&Noah Iliinsk.數(shù)據(jù)可視化之美[M].北京:機(jī)械工業(yè)出版社,2011:163.
[2][美]Alan Cooper,Robert Reimann,David Cronin.About Face 4:交互設(shè)計(jì)精髓[M].北京:中國工信出版社,2015:325-326.
[3][美]Jeff Johson.認(rèn)知與設(shè)計(jì)-理解UI設(shè)計(jì)準(zhǔn)則[M].北京:人民郵電出版社,2011:46-50.
[4][美]庫爾特·考夫卡.格式塔心理學(xué)原理[M].杭州:浙江教育出版社,1999:168-188.
[5]柳瑄.基于產(chǎn)品語義學(xué)的老年用戶電子書界面設(shè)計(jì)研究[D].南京:南京工業(yè)大學(xué),2012.
[6]王震亞.基于感性工學(xué)的裝載機(jī)人機(jī)系統(tǒng)設(shè)計(jì)研究[D].濟(jì)南:山東大學(xué),2011.
[7]賈欣荷.面積與距離因素在界面色彩感知中的作用研究[D].南京:東南大學(xué),2017.