認知思維與視覺思維下的信息可視化設計

杜鶴民，蔣俊杰

（1.深圳技術大學，廣東深圳 518118；2.澳門城市大學，中國澳門 999078）

隨著社會的飛速發展，人們每天都要面對冗長、繁雜的信息。為了切實提升工作效率，需要人們對眾多信息產生快速、準確的認知。也就是說，信息的表達形式與人的行為越貼合，終端的接受效果便越優質。當下信息可視化設計已成為信息傳達的一大趨勢，其將信息借助圖形輔助的方式展現給讀者，在保證信息準確度的前提下加強了可讀性、提高了閱讀效率。在體驗主義的時代背景下，設計更注重人的主觀感受，信息可視化的研究重點也逐漸轉向用戶認知及可用性分析等方面[1]。眾多學者也提出了相關的設計方法及實踐。例如教育APP 的可視化設計[2]、車輛管理服務平臺的可視化設計[3]、書籍設計教學中的信息可視化[4]等，以上研究皆有利于信息可視化的發展及應用，然而當下針對用戶獲取信息過程而展開的可視化設計研究并不深入。筆者以認知思維及視覺思維為導向，試圖構建信息可視化設計的標準范式，為設計者從優化用戶體驗的角度快速進行信息可視化設計提供相應的方法。

1 信息可視化研究基礎

1.1 信息可視化概述

信息可視化設計是在計算機輔助設計、圖形學、統計學、視覺傳達設計等學科的高速發展下應運而生的，因此，信息可視化設計是一門交叉性的綜合性學科[5]。信息可視化兼具了嚴謹性及美觀性，相較于常規數據信息圖擁有更加直觀、舒適的觀看體驗[6]。信息可視化對用戶而言是一個撥冗的過程，其借助圖形、色彩、版式、文字等視覺元素的合理搭配，可以有效激發用戶的理解力及認知力，讓用戶得以快速、高效地抓住信息群中的關鍵點及信息間的關聯性。當下信息可視化已成為數據統計、信息呈現的主要表現方式之一。

1.2 信息可視化的終端用戶

信息可視化設計中的“終端用戶”，即設計的目標使用者。對終端用戶的能力及需求進行正確地研判，可以保證信息可視化設計的合理性，然而，終端用戶的理解能力并不統一，目的指向也不一致，這是因為不同的用戶類型，其帶來的變數會影響設計者進行信息篩選、確定展示方式等實際任務。按照終端用戶的用戶需求進行分類，大致存在了解型用戶、使用型用戶及研究型用戶3 類，見表1。

表1 基于用戶需求的可視化用戶分類Tab.1 Visualized user classification based on user needs

了解型用戶泛指科普對象，其閱讀行為多伴有一定的自發性、非必要性。這類人群并不直接參與相關活動，而是抱著擴寬知識、防患未然等隱性目的來了解內容并形成認知儲備。受限于年齡、學歷、專業等客觀因素，該人群對信息的閱讀理解力存在較大差異且下限較高。若想最大程度地滿足這類人群，信息的傳達門檻不宜過高。以藥品說明書為例，該類人群多為醫藥愛好者、常識學習者等，他們希望說明書內容簡單、明了，以達成準確認知，并合理指導用藥行為。

使用型用戶是最主要的受眾群體，其基數較大，具有普遍性、業余性、必要性等特點。使用型用戶在人員影響因素上近似于了解型用戶，因此，二者對信息表達的要求基本一致。對于藥品說明書，使用型用戶多為病人或有用藥需求的人員。為了達到快速用藥的目的，他們渴求高效吸收必要的信息并立馬實施。

研究型用戶指專業從業者、相關研究人員等，他們擁有不俗的理解力、專業性極強。研究型用戶對信息傳達的內容較為熟悉，并能高效地做出研判。在藥品說明書的使用者中，研究型用戶多為醫師、藥師，他們對藥品說明書的認知相較于其他用戶更為深入。研究型用戶首先快速瀏覽必要信息，隨后對其他用戶關注度較低的信息進行深入研究。

1.3 信息可視化的設計流程

陸菁[7]在對信息可視化的研究中提出了基于用戶認知的可視化模型，該模型有4 個層級，分別是戰略層、范圍層、結構層、表現層，每一層是在上一層的基礎上延伸發展而來。在實際操作時該模型亦可作為信息可視化的設計流程，見圖1。其中，戰略層提出問題；范圍層研究目標用戶的認知能力及實際需求，以得出信息傳達的內容與層次；結構層構建信息圖的可視邏輯；表現層呈現最終的視覺設計。另外，在不同層級的構建上，設計師可提出解決具體問題的方法論。

圖1 信息可視化設計的設計流程Fig.1 Design flow of information visualization design

2 認知思維與視覺思維的理論基礎及設計模型

2.1 認知思維

認知思維主要運用于產品意象造型設計中，其通過對用戶認知特征的深入研究來推導出以人為本的產品設計方案，具體包括產品應景的造型、產品意蘊的表達等。這也說明了一個設計若想深入人心，認知思維的導入是極為重要的。

認知主要包括用戶的注意、記憶、意象、經驗等個體的信息加工過程。實際上，認知系統構建了個體與產品、信息與環境之間的橋梁[8]。張久美等[9]在對認知思維的研究中提到，設計上的認知思維就是要讓設計師思考“知道做什么”及“知道是什么”這2 個問題。也就是說，一個優質的產品設計應快速讓用戶注意到并迸發自主的了解興趣，使用后亦能在腦海中產生記憶并匯聚成操作經驗，最終讓用戶形成運用該產品的無意識行為。

2.2 視覺思維

視覺系統開啟了人類觀察世界的大門[10]，視覺結合了人類理性的經驗，能夠反映人的直觀感受。視覺思維最早由美國心理學家魯道夫·阿恩海姆提出[11]。視覺思維將意象作為媒介，相較于普通的抽象思維更具智能化、創造性。在設計學上，視覺思維的研究范疇主要包括視覺流程、視覺經驗等，這些都反映了人在面對事物時主觀迸發的視覺邏輯[12]。尤其對有信息傳達任務的設計而言，合理地運用視覺思維能讓用戶沿著預設的方向接收信息并快速做出決策。

2.3 基于認知思維與視覺思維的設計模型

視覺思維與認知思維相互聯系、相互影響。視覺常作為認知的前因，認知后的結果為視覺提供了寶貴的后天經驗。在開展設計工作時，應合理地利用二者。基于信息可視化設計流程構建出到的認知思維與視覺思維引導下的設計模型，見圖2。首先，通過視覺系統識別客觀世界，該過程以視覺規律及認知系統提供的后天經驗（在視覺思維里為視覺經驗）為主導。隨后進入認知系統的開端，即注意機制，該過程會將篩選的主要信息導入記憶機制，緊接著記憶層展開二次篩選，將部分信息與人腦儲存的相關經驗共同形成深刻記憶。經歷多層研判、個性的深刻記憶是引發行為的主要動力。

圖2 認知思維與視覺思維結合下的可視化設計模型Fig.2 Visual design model under the combination of cognitive thinking and visual thinking

2.4 認知思維與視覺思維對信息可視化設計的啟示

1）利用認知思維優化信息接收。人類的注意機制常有思維定式，且同一時刻進入記憶機制的信息量是有限的。可以利用認知思維進行信息分層來優化信息接受。

2）利用視覺思維完善展示形式。視覺思維可以引導用戶注意、記憶、行動，人的視覺存在規律，如何利用視覺設計的手法，讓信息可視圖按照設計者設定好的信息層級映入用戶眼簾值得深究。同時設計需要符合用戶的視覺經驗，并具有美觀性。

3 基于認知思維與視覺思維的信息可視化設計策略

3.1 基于認知思維的信息層級設計

3.1.1 注意機能與信息層級

用戶的注意機制是主動分配信息的過程[13]。從認知思維來論述注意機制，自上而下分為4 個步驟，分別是引起注意、選擇注意、二次選擇注意及補充注意。引起注意：人腦開始接收信息。選擇注意：人們功利性地解決問題、探索信息。二次選擇注意：搜尋信息的過程，功利性減弱。補充注意：注意機制的尾端，伴隨偶發性，接受剩余信息完成注意。

信息可視化設計將繁雜的信息群透過用戶需求分出信息層級。這種層級應和注意機能相匹配，見圖3。引起注意的過程中應明確信息主題，讓用戶得以辨別是否需要繼續接收信息。選擇注意對應第一層級信息，這部分信息對解決問題有關鍵的指導意義。二次選擇注意列出第二層級信息，其不是必要的，但對解決相關問題有一定助益。補充注意對應第三層級信息，鑒于使用率低對部分用戶而言可能會忽略，但需要時亦應在信息群中找到。

圖3 信息層級匹配注意系統Fig.3 Information hierarchy matching attention system

3.1.2 選擇注意驅動用戶端建立

各類用戶不同的實際需求會對信息的解讀產生偏差，并直接體現在注意機能上。具體來說，注意機能是主觀系統，深受個體知識結構的影響，在引起注意后，不同類型的用戶在選擇注意上就產生了較大的分歧。信息可視化設計同時滿足多類用戶的需要是極為困難的，若設計者極力追求信息圖的包容度，帶來的后果可能是無設計重點并喪失信息可視化的設計意義。面對這一困境，可進行針對性的設計，即為不同類型的用戶打造相應的閱讀端，每一端基于目標用戶的實際需求來量身設計信息層級，并完成可視化設計。信息可視化用戶端的設計流程見圖4。當下有較多相關設計實例，如某款攝影APP 就包含攝影師端及用戶端，在不同選擇注意的影響下，二者無論在內容上或設計上都存在較大的差異，見圖5。對常規的藥品說明書而言，鑒于市場需求及用戶基數，應更多地服務于了解型用戶及使用型用戶，并以滿足他們的認知需求為設計目標。

圖4 信息可視化用戶端的設計流程Fig.4 Design flow of information visualization client

圖5 某款攝影APP 不同用戶端的歡迎頁Fig.5 Welcome pages for different clients of a photography APP

3.1.3 記憶機能與信息容量

記憶機能考量用戶注意信息后的接收效果，即人在短時間工作后的記憶力。涉及的參數包括信息容量、時間壓力及記憶正確率。測試三者的數量關系（記憶正確率可用個體接收信息后復述信息的正確率來衡量），見圖6。在信息可視化中，圖形及文字是主要表達單位，因此將二者作為實驗信息類型。在同等的時間壓力下，信息容量越多，記憶的正確率就越低。在同等的信息容量下，花費時間越多，記憶正確率就越高。大眾對圖形的記憶能力也遠強于文字，這也決定了信息可視化設計應以圖形為主導。若以正確率60%為及格線，某一時刻給予讀者的信息項應保持在8 個以內。

圖6 信息容量、時間與記憶正確率之間的關系Fig.6 The relationship among information capacity,time and memory accuracy

3.2 基于視覺思維的可視化構建

3.2.1 用戶的視覺流程

人在長期閱讀中養成了一定的閱讀習慣，人的視線也會存在一定的邏輯流程。在閱讀時，人一般的視覺習慣為從左到右、自上而下。第一眼往往落在左上部，而后開始向右移動，再轉向左下、右下[14]。由此可見，注意力作用最大的是左上及中上，為最佳視域，見圖7。這啟發了信息可視化的布局設計，即讓重要信息處在優質的視域中，信息層級在視域級別降低下遞減，讓預設的信息層符合視覺流程，有效強化可視圖的思維引導作用[15]。

圖7 用戶閱讀的視覺流程Fig.7 Visual process of user reading

3.2.2 用戶的視覺經驗

俗話說“眼見為實”，人對眼睛是極其信任的，這種信任是在長期的探索認知中不斷產生的[16]。當獲取新信息時，人們會將其與記憶中類似的舊知進行聯系或對比，隨后對當下事物產生思考、識別。例如在看到“〇”時，人們會聯想到球體、正確等信息，因此，在信息可視化設計中，元素的視覺表現形式應嚴格考量大眾的視覺經驗。

3.2.3 視覺突出設計

在面對信息時，人們會下意識地將其與其他信息在形式上有區別的視為視覺重點。視覺突出設計主要的形式有3 種，分別為色彩突變、圖形突變及大小突變，見圖8。在信息可視化設計中，可利用視覺突出來提升文本表達力，提升用戶對關鍵信息的認知力。視覺思維下的設計思路見表2。

圖8 視覺突出設計Fig.8 Visual highlight design

表2 視覺思維下的設計思路Tab.2 Design ideas under visual thinking

4 設計實踐

4.1 藥品說明書研究現狀

以感冒靈顆粒說明書為例，展開信息可視化的設計實踐。藥品說明書承擔著指導用藥的重要作用，應保證用戶能快速、準確地接收指導信息。通過市場調研發現，現有的藥品說明書常采用純文字的形式，缺乏可視化思維，因此，造成了以下缺失點。

1）設計語言不新穎。強化了藥品說明書的晦澀程度，削弱了使用者的閱讀欲望[17]。

2）信息表達不直觀。延展了使用者到達認知盡頭的距離。

3）邏輯關系不清晰。缺失信息表達重點，即信息主次關系不明[18]。

4）信息接受環境不輕松。病人看病時常伴有緊張心理，渴求得到醫生的安慰以舒展情緒，藥品說明書應有一定的積極情感導向。

由此可見，對藥品說明書進行信息可視化設計，是優化用戶體驗的一劑良藥。

4.2 藥品說明書的信息層級

用戶的注意機能反映了用戶需求的主次，通過研究，首先計算出相關用戶在查看藥品說明書各項信息時給予的關注度，得出用戶注意順序，見圖9。據此分出3 個層級且每個層級的信息量控制在8 個以內，以保證每一層級信息的閱讀效率，見圖10。第1 層級是藥品說明書的底層信息，基本能指導用藥行為。第2 層級為藥品的部分屬性。第3 層級為補充信息，完善了藥品說明書。

圖9 感冒靈顆粒說明書的各項信息關注度調研Fig.9 Investigation on the information attention of Ganmaoling granule manual

圖10 基于用戶需求的感冒靈顆粒說明書的信息層級Fig.10 Information hierarchy of Ganmaoling granule instruction based on user requirements

4.3 視覺設計

從視覺思維的角度完成藥品說明書的信息可視化設計，見圖11。

圖11 藥品說明書的信息可視化設計Fig.11 Information visualization design of drug instructions

4.4 設計評估

選取10 人參與藥品說明書可視化設計的設計評估。

4.4.1 可用性測試

可用性測試可直觀地了解設計是否符合人的認知及視覺規律，并有效解決影響信息傳達效率的痛點。考慮到人們對已閱讀的信息會產生記憶、經驗，因此，分為2 個試驗小組，每個小組5 人。第1 組（被測1—5）閱讀現有藥品說明書，并記下閱讀完全部信息所耗費的時間。第2 組（被測6—10）閱讀新的設計案例，并記下閱讀完全部信息所消耗的時間。可用性測試1 見表3。以上測試是針對需要完全閱讀說明書的人群。當用戶希望快速用藥時，往往只閱讀第1 層級信息便停止注意。讓2 組被測人員從新舊藥品說明書上瀏覽功能主治、用法與用量及不良反應3 項信息，并計算出所消耗的時間，見表4。

表3 可用性測試1Tab.3 Usability test 1

表4 可用性測試2Tab.4 Usability test 2

人們在閱讀信息可視化設計下的藥品說明書時，相較于現有的藥品說明書節約了近1/3 的時間。在緊急閱讀的情況下，更是節省了一半多的時間。從用戶需求的角度而言，完成了改良設計。

4.4.2 舒適度評價

信息可視化設計也應給予用戶視覺上的舒適度，使其產生積極情感。讓10 人對此進行評價，其中9人給予肯定，無人否定，1 人不置可否，見圖12。

圖12 藥品說明書舒適度評價Fig.12 Comfort evaluation of drug instructions

5 結語

文中從個體主觀能動規律入手，提出了信息可視化設計的設計策略并付諸實踐，較為詳實地論證了認知思維及視覺思維對信息可視化設計的影響過程，并合理利用二者打造了貼合個體主觀行為的可視化案例。

在體驗至上的時代背景下，無論將來信息可視化以何種面貌出現，其都會是人類認識世界、創造未來的可靠工具。設計出體驗優質的可視圖是相關設計者的職責。望文中提出的設計思維方式能對信息可視化的發展有一定的助益。