閆永亮 王彩燕 翟藝晴 王豐

摘要：5G時代，信息可視化設(shè)計產(chǎn)品數(shù)量激增，用戶需求不斷增加，海量網(wǎng)絡(luò)用戶的認知心理和行為習慣決定了未來可視化設(shè)計的發(fā)展趨勢。文章針對層次數(shù)據(jù)可視化的五個案例在視覺設(shè)計中呈現(xiàn)的不同特點，逐一進行論述、分析與比較，根據(jù)研究結(jié)果提出優(yōu)化用戶感知和視覺體驗的可視化設(shè)計新模式以及符合信息布局的交互設(shè)計創(chuàng)新策略，為未來的可視化應用提供有價值的參考。

關(guān)鍵詞：層次數(shù)據(jù)可視化；直覺體驗；視覺呈現(xiàn)；網(wǎng)絡(luò)媒體；用戶需求

中圖分類號：G210.7 文獻標識碼：A 文章編號：1004-9436（2022）10-00-03

隨著5G時代的到來，數(shù)字化成為構(gòu)建現(xiàn)代社會的基礎(chǔ)力量，推動著社會走向深度變革的時代。IDC發(fā)布的《數(shù)據(jù)時代2025》報告顯示［1］，全球每年產(chǎn)生的數(shù)據(jù)將從2018年的33ZB增長到2025年的175ZB，平均每天產(chǎn)生491EB的數(shù)據(jù)。信息時代，人們無時無刻不在網(wǎng)絡(luò)媒體的虛擬環(huán)境中獲取和處理各類信息。網(wǎng)絡(luò)媒體的點對點、點對面的個性化、即時性、共享性等傳播特點，使用戶在信息傳遞過程中擁有高效的互動手段。對網(wǎng)絡(luò)媒體而言，面對擁有如此龐大信息量的網(wǎng)絡(luò)環(huán)境，不僅要有強大的后臺運算支撐，其前端網(wǎng)站頁面設(shè)計同樣重要，缺乏視覺特色的信息頁面極有可能被用戶忽略。眼動儀測試的相關(guān)結(jié)果顯示，用戶在訪問數(shù)字界面時的第一印象只停留0.2秒，這充分驗證了信息時代是一個情感化的時代，人們的心理、行為更多受直覺驅(qū)使［2］。如何吸引用戶眼球并滿足用戶的需求，使其產(chǎn)生情感共鳴并沉浸其中，是當前可視化設(shè)計的研究重點和亟須思考的問題。

1 層次數(shù)據(jù)可視化的概念及特點

可視化設(shè)計是一門跨多項學科領(lǐng)域和多方位的綜合研究，囊括了數(shù)據(jù)可視化、信息圖形設(shè)計、科學可視化等。5G時代的信息傳播技術(shù)得到迅速發(fā)展，面向廣義數(shù)據(jù)的層次關(guān)系表達成為設(shè)計領(lǐng)域的嶄新研究方向［3］。層次數(shù)據(jù)可視化在表達事物間的從屬關(guān)系上，展現(xiàn)出了巨大的層次邏輯優(yōu)勢。另外，其在整體可讀性、距離相關(guān)性和穩(wěn)定性等相關(guān)屬性上，都顯示出了特殊的研究價值。

數(shù)據(jù)的層次關(guān)系，既可以是事物本身固有的整體與局部的關(guān)系，又可以是人們在認識世界時賦予的類別與子類別的關(guān)系或邏輯上的承接關(guān)系。其特點為：一是結(jié)構(gòu)特點表現(xiàn)得更為抽象，是廣泛存在的一種關(guān)系順序，既不拋開時間順序、空間順序的因素，又更強調(diào)數(shù)據(jù)間的關(guān)系層次，研究對象也從單一類別轉(zhuǎn)向多種對象間錯綜復雜的關(guān)系網(wǎng)，同時能夠兼顧時間線、情感化的因素和數(shù)據(jù)內(nèi)在關(guān)聯(lián)性；二是視覺特點更加強調(diào)空間排布的合理性，避免空間浪費和視覺混淆等問題，在信息傳達的有效性上展現(xiàn)其非凡的能力，能提高用戶在單位時間內(nèi)對海量信息的理解效率，建立起人與信息、人與人、人與社會之間的關(guān)系紐帶。

2 層次數(shù)據(jù)可視化的視覺呈現(xiàn)分析

層次數(shù)據(jù)可視化設(shè)計，強調(diào)信息個體與信息群體間的層級關(guān)系和信息的傳遞次序，在信息傳遞的有效性、合理性等方面起到關(guān)鍵性作用。此外，在視覺呈現(xiàn)上注重信息內(nèi)涵與視覺要素之間的邏輯關(guān)系，有效地解決了設(shè)計過程中三個方面的問題，即再現(xiàn)（對數(shù)據(jù)進行視覺化處理）、展示（有效展示數(shù)據(jù)）和交互（讓用戶從各種角度觀察數(shù)據(jù)）。本文將摘取五個案例，從數(shù)據(jù)、單文本、多文檔、內(nèi)容分類、圖形圖像等方面逐一進行分析，探究目前主流網(wǎng)絡(luò)媒體層次數(shù)據(jù)可視化的結(jié)構(gòu)差異和視覺呈現(xiàn)。

2.1 “@文本弧形”

“@文本弧形”由紐約交互設(shè)計師W.布拉德·帕里研發(fā)。作為大數(shù)據(jù)交流領(lǐng)域的重要專家，他所提出的無障礙互動文本解決方案，可以幫助人們運用“杠桿原理”發(fā)現(xiàn)任意文本內(nèi)容的結(jié)構(gòu)模式和中心概念?！癅文本弧形”是一款以單文本為內(nèi)容的可視化工具，該設(shè)計主要是以“圓”的形式來編排每一個文本行，當用戶對文本進行分析和處理時，不同信息的出現(xiàn)頻率和重要性都一目了然。并且，該研究還發(fā)現(xiàn)人們對較明亮的單詞會產(chǎn)生“優(yōu)先注意”意識。當眼睛伴隨大腦逐一閱讀時，這一自動掃描的過程，能激發(fā)某些思想火花，跟隨思維概念深入文章，并與曾出現(xiàn)過的單詞產(chǎn)生關(guān)聯(lián)。通過此類無意識設(shè)計的理念注入，有效提升了人們在短時間內(nèi)的閱讀水平，同時也對自然神經(jīng)元的開發(fā)有了新的突破。

2.2 隨意線形

由美國人布蘭登·道斯設(shè)計的“嗡嗡涂鴉”，是一款用來查找和消化網(wǎng)絡(luò)信息的實驗性界面，該界面是隨意線形的典型代表作品。當用戶在界面上隨意畫出單根或多根線條后，與之特定檢索項相關(guān)的標題就會順著用戶畫線方向排列。用戶可以自由地閱讀摘錄、搜索圖上相關(guān)話題，或直接連接原創(chuàng)文章。信息的陳列可以是線性、手寫體等任意形式，強調(diào)用戶的個人感覺和體驗，設(shè)計形式更為人性化。應用視覺化的語言程序，展現(xiàn)出極高的空間利用率和良好的交互趣味性。其動態(tài)效果有效暗示和指引了用戶操作，維持了整個系統(tǒng)的連續(xù)性體驗過程。

2.3 新聞地圖形式

新聞地圖使用樹圖布局方式將新聞文本歸類與可視化，有效梳理了不同主題在文檔集合中的分布以及多文檔間的相互關(guān)系。從谷歌新聞采集來的信息包含了多個文檔，內(nèi)容豐富、關(guān)系復雜。界面中每個矩形代表一類主題，其大小和長寬比決定了與該主題相關(guān)新聞報道的數(shù)量。矩形的顏色用于編碼主題的類別，而亮度則用于編碼該主題出現(xiàn)的時間，亮度越高表明該主題出現(xiàn)的時間越近。新聞地圖形式以層次結(jié)構(gòu)整合了大量的新聞文本，并對主題進行抽取和歸類，為用戶提供高效獲取熱點新聞的方法。與傳統(tǒng)滾動式新聞網(wǎng)站相比，等比邊距分割方式，不僅使信息間產(chǎn)生關(guān)聯(lián)性，其視覺化的感官體驗也更具動態(tài)性。

2.4 點狀圓環(huán)形式

點狀圓環(huán)形式的可視化設(shè)計，以各色的點為視覺呈現(xiàn)方法，拓展了用戶的色彩認知心理空間和提高了可視化閱讀率，加深和強調(diào)了每個記憶點間的聯(lián)系。以英國衛(wèi)報周刊網(wǎng)頁為例，該網(wǎng)頁為由無數(shù)個點組成圓環(huán)的動態(tài)界面，顏色各異的點將衛(wèi)報一周的信息量分門別類與可視化，所有的標題都按字母從A到Z的順序分類排布，兩點間交集成的線越密，信息量就越大。從視覺呈現(xiàn)上看，通過結(jié)點間相互交錯的連接，既能保持原有圖文的信息量，又能提高整個頁面的可識別度，這種刪繁就簡的效果使信息間的層次關(guān)系趨于明朗。此外，協(xié)調(diào)的色彩搭配、合理的空間利用，不失為一種高效的可視化設(shè)計。

2.5 有序正等分樹圖形式

有序正等分樹圖形式主要以精確的網(wǎng)格版式構(gòu)圖為基準，根據(jù)數(shù)據(jù)的層次結(jié)構(gòu)將屏幕空間劃分成多個子空間，并對各區(qū)域加以相應的顏色匹配或必要說明。以德國哈勒藝術(shù)院校官網(wǎng)為例，該網(wǎng)站以發(fā)布日的設(shè)計師作品作為元素，當鼠標滑動到圖片位置時，被選中的圖片會按等比邊距自動展開，占據(jù)頁面的中心位置，用戶的注意力被迅速鎖定在屏幕內(nèi)的指定區(qū)域，單個獨立圖像的動態(tài)化處理，可增強對用戶視覺神經(jīng)的刺激。瀏覽該網(wǎng)站時，用戶視線由左上至右下移動，不僅符合日常閱讀的視線習慣，還能通過圖文大小來判定時間呈現(xiàn)的先后關(guān)系。圖像所具有的動態(tài)交互性和強烈視覺沖擊，體現(xiàn)了數(shù)字化的形式美感，不僅釋放了原有的空間，還給用戶帶來了強烈的新鮮感和沉浸感。

綜合網(wǎng)絡(luò)媒體中數(shù)字界面的發(fā)展進程來看，層次數(shù)據(jù)可視化在視覺呈現(xiàn)上應根據(jù)不同的信息內(nèi)容來劃分，富有藝術(shù)性和情感性的可視化設(shè)計是未來信息界面發(fā)展的總體趨勢。從設(shè)計學科的角度來看，目前可視化設(shè)計領(lǐng)域亟須解決的問題包含信息分類、組織結(jié)構(gòu)、屏幕空間利用率、操作路徑的難易度、認知效率、信息關(guān)聯(lián)性等方面。通過對五個層次數(shù)據(jù)可視化的視覺呈現(xiàn)案例進行比較分析可以看出，“@文本弧形”、隨意線形和點狀圓環(huán)這三種形式在操作路徑的難易度和信息關(guān)聯(lián)度上較占優(yōu)勢，新聞地圖、有序正等分樹圖形式在屏幕空間的利用率和認知效率上較有優(yōu)勢（見表1）。

3 網(wǎng)絡(luò)媒體可視化設(shè)計建議

3.1 強化動態(tài)化圖形表現(xiàn)

信息內(nèi)容的動態(tài)圖形化設(shè)計，即可順著時間流動或交互發(fā)生而產(chǎn)生形態(tài)變化的圖形［4］。憑借時間與空間的架構(gòu)，利用線性或非線性的敘事手段，整合文字、圖形、視頻等元素，將原本無序和難以傳達的信息轉(zhuǎn)化成易懂的可視化語言，對其內(nèi)部所傳達的信息進行感知和管理，幫助用戶篩選有用信息。從信息交互和信息管理的角度來看，需考慮用戶的認知負荷、認知結(jié)構(gòu)、視覺思維習慣和心智模型，通過橫向線性和縱向?qū)蛹壍脑O(shè)計，引導用戶逐步感知和記憶圖形傳達的信息，提升用戶的感知和信息獲取能力［5］。

3.2 提升界面設(shè)計的視覺美感

層次數(shù)據(jù)可視化設(shè)計需遵循美學原則，精美的可視化設(shè)計能給用戶帶來意想不到的驚喜，達到增強用戶黏性和提升產(chǎn)品競爭力的目的。為了更好地優(yōu)化用戶視覺美感體驗，可從構(gòu)圖、布局和色彩三個角度出發(fā)。從構(gòu)圖的角度出發(fā)，可通過畫面的合理組織和設(shè)計元素自身平衡的屬性，共同構(gòu)建起平衡的畫面感，使用戶產(chǎn)生安定和舒適感。從布局的角度出發(fā)，合理的信息布局可以借鑒格式塔原則，即接近、相似、閉合、連續(xù)、簡單、對稱等［6］，幫助用戶迅速鎖定自己想要的信息，快速了解信息的具體內(nèi)容。從色彩的角度出發(fā)，合理利用色彩的情感表現(xiàn)可優(yōu)化感知效果，調(diào)動用戶情緒。簡潔優(yōu)美、顏色搭配協(xié)調(diào)的視覺環(huán)境，能夠有效幫助用戶理解信息。

3.3 增強用戶體驗的沉浸感

優(yōu)化網(wǎng)絡(luò)媒體的沉浸式用戶體驗非常重要。從感官層面出發(fā)，簡化頁面，合理構(gòu)建整體框架，優(yōu)化空間布局，充分考慮信息的空間分布特征，全屏展示數(shù)據(jù)內(nèi)容［7］。從交互設(shè)計角度來看，減少首頁功能模塊，將信息組織歸納為不同層次；減少累贅操作，優(yōu)化交互方式，降低數(shù)據(jù)展示成本和觀覽成本。從心理體驗來看，創(chuàng)新推送機制，確保信息的真實性，保障用戶對信息內(nèi)容的信任度、期待感和新鮮感，激發(fā)用戶不斷沉浸觀看的熱情［8］。從認知心理和行為習慣來看，強化無意識設(shè)計理念，注重直覺體驗，做到人機間的自然溝通。此外，可將虛擬現(xiàn)實和人工智能等技術(shù)與可視化設(shè)計結(jié)合，給用戶帶來良好的體驗感。

4 結(jié)語

5G時代為網(wǎng)絡(luò)媒體提供了良好的發(fā)展條件，同時產(chǎn)品間日趨激烈的競爭和日益增加的用戶需求，對可視化設(shè)計發(fā)起了新挑戰(zhàn)。文章通過對五種層次數(shù)據(jù)可視化設(shè)計案例進行對比分析，結(jié)合用戶的認知心理和行為習慣，提出可視化設(shè)計建議。應加強信息圖形動態(tài)化設(shè)計，強調(diào)自然交互原則，注重界面與用戶間的情感共鳴。了解層次數(shù)據(jù)的應用特性，掌握不斷增加的用戶核心需求，優(yōu)化用戶體驗，增強產(chǎn)品用戶黏性，提升產(chǎn)品持久競爭力。此外，隨著數(shù)字移動界面的普遍使用，用戶在處理和傳達海量信息時，遇到的認知負荷大、單位頁面的信息過多、頁面間切換頻繁、操作步驟復雜等問題，都是可視化設(shè)計領(lǐng)域研究的重點。

參考文獻：

［1］ IDC全球數(shù)據(jù)圈.數(shù)據(jù)時代2025［EB/OL］.中國存儲

網(wǎng)，https：//www.chinastor.com/market/12214001R018.Html，2018-12-21.

［2］ 李洋，韓海燕，謝繼武，等.基于眼動儀的手機游戲APP圖標視覺度提升策略［J］.包裝工程，2020，41（18）：258-263.

［3］ 許彥如，王長波，劉玉華，等.多維網(wǎng)絡(luò)論壇數(shù)據(jù)的層次可視化［J］.計算機科學，2011，38（2）：206-209.

［4］ 楊璇.影響信息可視化動畫表征效果的關(guān)鍵因素［J］.裝飾，2018，297（1）：114-117.

［5］ 楊勐荷，鄭雷.利用計算機交互技術(shù)的網(wǎng)頁界面文本視覺優(yōu)化設(shè)計［J］.現(xiàn)代電子技術(shù)，2020，43（24）：92-95，101.

［6］ 楊潔.格式塔理論在移動終端APP界面布局設(shè)計中的應用［J］.美與時代，2018（1）：70-73.

［7］ 朱明怡.信息可視化視覺設(shè)計的反思與創(chuàng)新［J］.藝術(shù)科技，2017，30（7）：278.

［8］ 殷俊，王婉晴.基于注意和視知覺的移動端界面設(shè)計應用［J］.包裝工程，2019（10）：68-72.

作者簡介：閆永亮（1990—），男，安徽亳州人，碩士，講師，研究方向：數(shù)字媒體藝術(shù)設(shè)計、交互設(shè)計。

王彩燕（2002—），女，江蘇揚州人，本科在讀，研究方向：數(shù)字媒體技術(shù)。

翟藝晴（2003—），女，江蘇徐州人，本科在讀，研究方向：視覺傳達設(shè)計。

王豐（1978—），女，江蘇無錫人，碩士，副教授，研究方

向：實驗動畫、信息可視化。