王廣文，范佳悅，韓劍武

（河北工業(yè)大學(xué)，建筑與藝術(shù)設(shè)計學(xué)院，天津 300130）

引言

計算機、互聯(lián)網(wǎng)和物聯(lián)網(wǎng)等科技的發(fā)展，改變了人們的生活方式?；ヂ?lián)網(wǎng)擁有海量的數(shù)據(jù)，人們通過互聯(lián)網(wǎng)獲取對自己有用的信息，需要對大量的信息進行篩選。可視化的數(shù)據(jù)信息因其直觀性，能使用戶快速識別哪些數(shù)據(jù)是有價值的，因此出現(xiàn)了對數(shù)據(jù)進行管理與視覺化處理的需求?；谶@一需求，Web端數(shù)據(jù)管理平臺的開發(fā)與使用為管理、分析、處理大量數(shù)據(jù)提供了新思路。Web端又稱網(wǎng)頁端。在Web端所建立的大部分的數(shù)據(jù)管理平臺，主要是看重Web端的方便、快捷，能滿足平臺用戶對使用便捷、節(jié)省內(nèi)存、提高效率等的訴求；數(shù)據(jù)指管理平臺中的圖片、音頻、文字以及交互功能等所有信息要素。如今，Web端數(shù)據(jù)管理平臺中的數(shù)據(jù)可視化還存在一些問題。本文對數(shù)據(jù)在平臺界面的數(shù)據(jù)可視化進行分析研究，找出數(shù)據(jù)可視化在界面中的設(shè)計原則。

一、管理平臺存在的數(shù)據(jù)可視化問題

目前，Web端數(shù)據(jù)管理平臺在設(shè)計時，沒有一個統(tǒng)一的標(biāo)準(zhǔn)，導(dǎo)致管理平臺界面的整體布局有多種的可視化方式，使管理平臺整體視覺混亂，找不到平臺布局規(guī)律，因此用戶在使用管理平臺時，存在整個使用過程不流暢、用戶工作效率降低、影響工作進度等問題。針對上述問題，需要從用戶角度出發(fā)，通過“構(gòu)建心智模型”，使平臺數(shù)據(jù)可視化的設(shè)計方式在一定的范圍內(nèi)使用相似的整體布局標(biāo)準(zhǔn)。

圖1

現(xiàn)在Web端存在大量數(shù)據(jù)管理平臺的功能按鈕等內(nèi)外部不統(tǒng)一、對于平臺內(nèi)的數(shù)據(jù)管理與處理的可視化設(shè)計不一致、數(shù)據(jù)信息傳達不準(zhǔn)確、頁面之間相關(guān)性低下等一系列界面元素問題。通過“用戶體驗要素”中的框架層，從頁面之間元素種類出發(fā)，統(tǒng)一管理平臺的內(nèi)部外部一致性等。

部分管理平臺頁面中的數(shù)據(jù)可視化，沒有重點，存在難找到所需要的信息、數(shù)據(jù)信息傳達模糊、數(shù)據(jù)排版樣式及管理平臺配色混亂等問題。使用“用戶體驗要素”中的框架層，從數(shù)據(jù)重要層級出發(fā)，決定各種數(shù)據(jù)在平臺中的可視化的位置大小動態(tài)和平臺配色。

二、構(gòu)建心智模型理論

（一）基本概念

心智模型理論在上個世紀(jì)末就出現(xiàn)了，第一個對心智模型進行較全面概括的人是蘇珊·凱里（Susan Carey）：心智模型展現(xiàn)的是一個人對于某樣?xùn)|西是如何運作的思考過程，例如一個人對于周遭世界的理解。心智模型是基于不全面的事實、過往的經(jīng)驗，甚至直覺。心智模型會幫助塑造行為舉止。當(dāng)人們處于復(fù)雜的環(huán)境中時，心智模型會影響人們關(guān)注什么，并且影響人們解決問題的方法和途徑①。

在本文的管理平臺數(shù)據(jù)可視化領(lǐng)域中，心智模型是指人們對于平臺中的功能或數(shù)據(jù)的呈現(xiàn)方式的思考，這個思考主要包括在平臺中怎樣合適地對數(shù)據(jù)進行可視化，盡管人們腦海中的心智模型是復(fù)雜的，不斷變化的，但設(shè)計師本身需要知道如何從復(fù)雜的心智模型中提取有用的信息，使設(shè)計師心中的模型無限接近用戶心中的模型，讓兩者在心中建立的模型是相匹配的，這有助于設(shè)計師們在最終的設(shè)計平臺上于一定范圍內(nèi)使用相似的標(biāo)準(zhǔn)。心智模型的建立，也有助于設(shè)計師對平臺進行改進，對系統(tǒng)的升級迭代也具有指引的作用。

（二）設(shè)計原則

管理平臺數(shù)據(jù)可視化與“心智模型”有著共通的邏輯，根據(jù)蘇珊·凱里所概述的“心智模型”，梳理心智模型與平臺數(shù)據(jù)可視化之間的關(guān)系，建立出適合于平臺數(shù)據(jù)可視化的新的“心智模型”理念。通過圖1中所舉的例子，來解釋新的“心智模型”理念，在本文的數(shù)據(jù)管理平臺可視化領(lǐng)域中，心智模型是指在對平臺中的功能或數(shù)據(jù)進行可視化設(shè)計時，設(shè)計師心中的模型呈現(xiàn)在平臺上的樣子和用戶心中的模型是否匹配或相似。圖中以“數(shù)據(jù)”舉例，在設(shè)計師心中是圖1（左）的模型樣式，在用戶心中是圖1（右）的模型樣式，最后在不考慮其他訴求的情況下，設(shè)計師通過對自身心中的模型和用戶心中的模型進行信息提取與優(yōu)化，最后設(shè)計出與用戶心中的模型相同或相似的平臺模型。

三、用戶體驗要素

（一）基本概念

《用戶體驗要素》②是一本有關(guān)設(shè)計思路的書，它清晰地解釋了產(chǎn)品設(shè)計的工作內(nèi)容，全書用簡潔的語言系統(tǒng)詮釋了“用戶”“商業(yè)”“技術(shù)”三者之間錯綜復(fù)雜的關(guān)系，以及三者融合才是最重要的發(fā)展趨勢。用戶體驗要素包含了戰(zhàn)略層、范圍層、結(jié)構(gòu)層、框架層、表現(xiàn)層五個層面，全書主要講述了用戶體驗為什么重要，如何認識這些要素以及要素的應(yīng)用。比起工具或技術(shù)更關(guān)注于思路，最終提高體驗的流程質(zhì)量。

（二）結(jié)構(gòu)層設(shè)計

通過對平臺數(shù)據(jù)可視化與結(jié)構(gòu)層和表現(xiàn)層中的方法理論進行綜合分析總結(jié)，根據(jù)兩者之間的互通點，找出符合平臺數(shù)據(jù)可視化的設(shè)計原則，加以應(yīng)用。通過分析，結(jié)構(gòu)層中的界面外觀、信息設(shè)計與平臺數(shù)據(jù)可視化之間存在聯(lián)系，總結(jié)得出設(shè)計原則（結(jié)構(gòu)層）：考慮在Web端的平臺上一些細節(jié)元素與其他軟件存在不同之處，在此基礎(chǔ)上，根據(jù)平臺數(shù)據(jù)信息的內(nèi)容，以及其希望達到的目的，選擇正確且合適的界面元素，以及要統(tǒng)一不同界面之間相同或類似元素的一致性。對于復(fù)雜的文字數(shù)據(jù)，可先為數(shù)據(jù)分出層級，再根據(jù)產(chǎn)品及用戶的訴求，使用合適的排版方式。

（三）表現(xiàn)層設(shè)計

通過分析，表現(xiàn)層中的視覺注意力和配色方案與平臺數(shù)據(jù)可視化之間存在相關(guān)性，總結(jié)得出設(shè)計原則（表現(xiàn)層）：在了解人類視覺路線的基礎(chǔ)上，基于刪格線等方法，確定平臺中數(shù)據(jù)可視化的位置大小等。根據(jù)平臺所屬公司或相關(guān)行業(yè)及用戶訴求，決定平臺主色相關(guān)輔助色，最終決定配色方案和排版樣式。在對平臺數(shù)據(jù)進行可視化設(shè)計時，通過使用以上的設(shè)計原則，最終統(tǒng)一管理平臺內(nèi)部外部數(shù)據(jù)可視化的一致性，決定平臺的配色方案與排版方式，以及接下來平臺數(shù)據(jù)可視化可能發(fā)展的方向。

四、設(shè)計原則可行性分析

以北京曠視科技公司中Data++團隊的越影數(shù)據(jù)管理平臺來論證該設(shè)計原則的可行性。根據(jù)設(shè)計原則對平臺進行設(shè)計，首先，因平臺用戶為公司員工及與公司業(yè)務(wù)相關(guān)人員，所以對以上人群進行了用戶調(diào)研，分析調(diào)研結(jié)果得出，用戶最主要的訴求是希望平臺可以使用簡單，快捷，提升工作效率及相關(guān)功能效率，同時也希望平臺不要太死板等。根據(jù)以上訴求，確定平臺開發(fā)在使用快捷的Web端上。

結(jié)合設(shè)計原則第一條，設(shè)計師在心中規(guī)劃平臺整體模型，根據(jù)調(diào)研取得用戶心中的平臺模型，兩者相互結(jié)合，如圖2中的第一條所顯示的，設(shè)計出更接近用戶心中的平臺模型，只有越接近用戶心中的模型，設(shè)計出的平臺在用戶使用時，才能實現(xiàn)上手快，提高工作效率的目的。

圖2

結(jié)合設(shè)計原則第二條，因Web端自帶返回按鈕并且平臺頁面層級不多，所以平臺不必做返回按鈕。平臺目的是希望員工通過平臺可以更快地完成工作，如圖2中的第二條所顯示的，減少了平臺中的裝飾元素，單純以文字及文字顏色來促進用戶更明確更快速地分辨功能作用和當(dāng)前所在頁面。平臺中的文字數(shù)據(jù)信息進行了分層級處理，以左對齊的排版方式，使辨識度更高。

結(jié)合設(shè)計原則第三條，如圖2中的第三條所顯示的，以平臺整體進度和階段進度的數(shù)據(jù)為例，為使數(shù)據(jù)比重更清晰，數(shù)據(jù)進行餅狀圖可視化后，以人類的從上到下，從左到右的視覺路線為基礎(chǔ)，以重要的整體進度數(shù)據(jù)放左，稍次一級的階段進步數(shù)據(jù)在右，因階段進步數(shù)據(jù)比整體進度數(shù)據(jù)更為復(fù)雜，在以一定程度上對數(shù)據(jù)進行了放大處理。

在設(shè)計原則的指導(dǎo)下，設(shè)計出一套越影數(shù)據(jù)管理平臺界面，優(yōu)化了平臺的使用方式，提高平臺的使用效率。論證了該設(shè)計原則的可行性。

五、結(jié)語

此研究對心智模型、用戶體驗要素結(jié)構(gòu)層和表現(xiàn)層與Web端平臺數(shù)據(jù)可視化的聯(lián)系進行了分析總結(jié)，最終得出一套符合平臺數(shù)據(jù)可視化的設(shè)計原則。并以北京曠視科技公司中Data++團隊的越影數(shù)據(jù)管理平臺為例子，討論了此設(shè)計原則的可行性。然而這種設(shè)計原則只適用于Web端平臺的數(shù)據(jù)可視化設(shè)計，在其他環(huán)境下，由于互聯(lián)網(wǎng)界面的復(fù)雜性，導(dǎo)致設(shè)計原則無法適用于其他情況，因此還需要更進一步的研究。

注釋：

①蘇珊·凱里（Susan Carey）.《認知科學(xué)與科學(xué)教育》（Cognitive Scienceand Science Education），1986年.

② Jesse James Garrett.用戶體驗要素（中文版）[M].范曉燕，譯.北京：機械工業(yè)出版社，2008.