周　沁

信息視覺(jué)化在用戶體驗(yàn)研究中的運(yùn)用

周沁

近幾年來(lái)設(shè)計(jì)已經(jīng)不再局限于固定的行業(yè)領(lǐng)域，而是呈現(xiàn)出跨專(zhuān)業(yè)跨學(xué)科合作設(shè)計(jì)的大方向。在這樣的前提下，什么才是指導(dǎo)設(shè)計(jì)的核心內(nèi)容，成為了眾多設(shè)計(jì)師討論的方向。而用戶體驗(yàn)作為產(chǎn)品設(shè)計(jì)最基本的層面，被廣泛提及并且成為近年討論的熱點(diǎn)話題。同時(shí)，信息視覺(jué)化作為用戶體驗(yàn)的手段和方式也被運(yùn)用到了設(shè)計(jì)的過(guò)程中。本文關(guān)注了信息視覺(jué)化在用戶體驗(yàn)研究中的運(yùn)用。從兩者的關(guān)系出發(fā)著重分析了信息視覺(jué)化在用戶研究中的作用、意義、以及方法。

信息視覺(jué)化人機(jī)交互用戶體驗(yàn)

當(dāng)代社會(huì)已經(jīng)進(jìn)入了體驗(yàn)經(jīng)濟(jì)的時(shí)代，用戶體驗(yàn)成為了設(shè)計(jì)的重中之重。此時(shí)，產(chǎn)品的功能并不是衡量產(chǎn)品優(yōu)劣的唯一標(biāo)準(zhǔn)。產(chǎn)品的易用性與用戶滿意度很大程度上決定了用戶對(duì)產(chǎn)品甚至品牌本身的忠誠(chéng)度。在用戶體驗(yàn)研究的過(guò)程中，信息視覺(jué)化成為用戶體驗(yàn)研究的一種良好表現(xiàn)途徑。從生活與情境出發(fā)為用戶創(chuàng)造出符合心理以及行為習(xí)慣需要的界面，從而更好地提高產(chǎn)品或品牌本身的黏度。因此，信息視覺(jué)化在用戶體驗(yàn)研究過(guò)程中不可或缺。

從另一方面來(lái)說(shuō)，隨著互聯(lián)網(wǎng)技術(shù)的普及，信息的獲取變得方便快捷。然而信息爆炸導(dǎo)致的問(wèn)題也隨之而來(lái)，互聯(lián)網(wǎng)用戶需要在紛繁復(fù)雜的頁(yè)面中找到有效的信息變得愈發(fā)困難。如何能夠幫助用戶高效準(zhǔn)確地獲取所需信息或完成相關(guān)操作任務(wù)，成為設(shè)計(jì)師們關(guān)注的重中之重。用戶體驗(yàn)研究中的信息視覺(jué)化則為此提供了一個(gè)值得探討的方向。

一、用戶體驗(yàn)研究與信息視覺(jué)化的關(guān)系

用戶體驗(yàn)研究作為一個(gè)綜合型跨學(xué)科的研究方向，需要通過(guò)多學(xué)科的協(xié)同合作，才能達(dá)成有益于用戶的體驗(yàn)，而信息視覺(jué)化則是其中不可或缺的一個(gè)部分。 Alan Cooper以及其他兩位合作人在其書(shū)中提到，體驗(yàn)研究可以分為三個(gè)主要的方面，分別為形式、內(nèi)容以及行為。［1］信息視覺(jué)化是在對(duì)內(nèi)容和行為理解的基礎(chǔ)上用合理的形式對(duì)相關(guān)信息進(jìn)行表達(dá)，從而傳遞給用戶更有意義的體驗(yàn)。因此用戶體驗(yàn)研究與信息視覺(jué)化存在著相輔相成、相互依靠的關(guān)系。用戶體驗(yàn)研究是信息視覺(jué)化的前提和基礎(chǔ)，而信息視覺(jué)化是用戶體驗(yàn)研究的手段和方法。在設(shè)計(jì)的每一個(gè)步驟中兩者都是緊密結(jié)合、相互依托的。

交互設(shè)計(jì)的研究方式可以被定義為六個(gè)階段， 即研究、建模、定義需求、定義框架、細(xì)化以及支持。［1］用戶體驗(yàn)研究是交互設(shè)計(jì)的根本要素，而信息視覺(jué)化作為其方法和手段也貫穿了整個(gè)過(guò)程。首先在研究過(guò)程中對(duì)數(shù)據(jù)整合處理，通過(guò)信息視覺(jué)化來(lái)發(fā)現(xiàn)分析問(wèn)題的根源。其次利用信息視覺(jué)化對(duì)每一個(gè)階段進(jìn)行直觀呈現(xiàn)，更加快速高效地促進(jìn)利益相關(guān)者之間的信息溝通。最后在界面設(shè)計(jì)表達(dá)部分將整合完成的信息，通過(guò)界面的方式傳遞給使用者。本文將著重論述最后階段，即人機(jī)界面的信息視覺(jué)化分析。

二、人機(jī)界面信息視覺(jué)化

人機(jī)界面信息視覺(jué)化是將復(fù)雜的信息通過(guò)產(chǎn)品的界面，以最簡(jiǎn)單有效的方式傳遞給使用者。人機(jī)界面信息視覺(jué)化的概念屬于信息視覺(jué)化大框架中一個(gè)重要部分，其主要目標(biāo)是對(duì)計(jì)算機(jī)以及移動(dòng)端界面進(jìn)行視覺(jué)化的表達(dá)，［2］人機(jī)界面信息視覺(jué)化是將計(jì)算機(jī)提供的功能信息轉(zhuǎn)換為視覺(jué)信息來(lái)為用戶提供良好的互動(dòng)體驗(yàn)。這種被有效組織并設(shè)計(jì)的視覺(jué)信息在無(wú)意識(shí)中引導(dǎo)用戶進(jìn)行更加快速有效的人機(jī)互動(dòng)行為，從而提供給用戶更加積極、有效的體驗(yàn)。

圖1、學(xué)生練習(xí)“平板的獨(dú)白”第一稿

這種積極有效的體驗(yàn)來(lái)源于設(shè)計(jì)師對(duì)信息的良好組織和表達(dá)。在About Face一書(shū)中提到兩種模型。［1］ 實(shí)現(xiàn)模型是指有關(guān)機(jī)器和程序如何實(shí)際工作，實(shí)現(xiàn)模型對(duì)于工程師來(lái)說(shuō)非常符合邏輯，真實(shí)并且精確。然而對(duì)于大多數(shù)用戶而言，他們并不了解計(jì)算機(jī)內(nèi)部的運(yùn)行機(jī)制，而只期望產(chǎn)品能最有效率地幫助他們完成手頭的任務(wù)。實(shí)現(xiàn)的復(fù)雜性使得使用者無(wú)法并且不需要了解這些實(shí)現(xiàn)的方式及原理，他們更期待一種自然而然的使用過(guò)程。這被稱(chēng)作心理模型。信息視覺(jué)化的過(guò)程正是在清晰了解實(shí)現(xiàn)模型的基礎(chǔ)上隱去這些紛繁復(fù)雜的過(guò)程，將其簡(jiǎn)化成最接近用戶心理模型的界面表現(xiàn)方式，提供給用戶最易于理解的目標(biāo)和貼近他們認(rèn)知框架的設(shè)計(jì)。因此，不同于其他學(xué)科，在人機(jī)界面信息視覺(jué)化的教學(xué)過(guò)程中，對(duì)學(xué)生的綜合能力、分析能力有較高的要求。在教學(xué)的過(guò)程中也需要著重訓(xùn)練學(xué)生對(duì)于信息的組織、表達(dá)能力。這種組織和表達(dá)是先對(duì)信息進(jìn)行分塊、分層、精簡(jiǎn)，而后用視覺(jué)語(yǔ)言表達(dá)出信息的層次以及合理的關(guān)系。

三、如何做到界面信息視覺(jué)化？

在設(shè)計(jì)過(guò)程中，人機(jī)界面的信息視覺(jué)化并不是單純的數(shù)據(jù)羅列，而是經(jīng)過(guò)思考整合而集成的視覺(jué)表現(xiàn)，合理化的界面設(shè)計(jì)有助于減少用戶的認(rèn)知負(fù)擔(dān)。ISO將產(chǎn)品的可用性定義為效力、效率和滿意度三個(gè)方面。［3］產(chǎn)品設(shè)計(jì)本身體現(xiàn)了其效力，而界面信息的視覺(jué)化很大程度上決定了產(chǎn)品的使用效率和滿意度。與用戶體驗(yàn)研究類(lèi)似，界面信息視覺(jué)化也是一個(gè)從分析研究到表現(xiàn)不斷迭代的過(guò)程。界面視覺(jué)化被分為三個(gè)主要的階段：分析用戶行為及偏好、組織信息、視覺(jué)體現(xiàn)，［1］這三個(gè)階段循環(huán)往復(fù)不斷優(yōu)化著用戶體驗(yàn)。下文將結(jié)合課程初期案例說(shuō)明如何在用戶體驗(yàn)研究中有效地運(yùn)用信息視覺(jué)化為用戶提供有意義的交互體驗(yàn)。這一階段，著重訓(xùn)練學(xué)生分析能力、信息組織能力及信息表達(dá)能力，使其能在單個(gè)頁(yè)面中清晰表達(dá)其層級(jí)關(guān)系并優(yōu)化視覺(jué)體驗(yàn)。

圖2、學(xué)生練習(xí)“平板的獨(dú)白”第二稿

1、分析用戶行為及偏好

正如用戶體驗(yàn)研究的方式一樣，對(duì)于設(shè)計(jì)師來(lái)說(shuō)首先需要明確設(shè)計(jì)的目標(biāo)和任務(wù)。Donald Norman強(qiáng)調(diào)了先理解用戶的行為及其偏好從而更有針對(duì)性地進(jìn)行設(shè)計(jì)。在界面信息視覺(jué)化的過(guò)程中了解用戶也是最為基礎(chǔ)同時(shí)必不可少的環(huán)節(jié)。在完成界面設(shè)計(jì)之前需要設(shè)計(jì)師代入用戶的使用情景（Context），［4］分析用戶要做什么、完成什么樣的任務(wù)。在深入理解的基礎(chǔ)上才能決定信息分類(lèi)的方式以及層次，并且用合理的視覺(jué)化方案表達(dá)引導(dǎo)用戶的使用行為。因此在第一階段的學(xué)習(xí)過(guò)程中首先需要針對(duì)用戶的使用情景對(duì)信息內(nèi)容進(jìn)行分析整合。在這一案例中針對(duì)平板電腦的銷(xiāo)售情況進(jìn)行深入研究。通過(guò)情景分析及調(diào)研結(jié)果表明，用戶的目的是了解何種類(lèi)型的平板電腦最受大眾青睞，因而主要展現(xiàn)的內(nèi)容即為影響平板電腦銷(xiāo)售的主要原因。在充分理解目標(biāo)用戶使用目的的基礎(chǔ)上則可以進(jìn)行信息的組織。

2、組織信息

從用戶角度出發(fā)，組織信息的根本目標(biāo)是讓用戶在接觸界面的第一時(shí)間明白自己在做什么，設(shè)計(jì)師需要讓用戶理解要做什么，并且在操作過(guò)程中對(duì)產(chǎn)品具有掌控感。另一方面，從產(chǎn)品角度出發(fā)，設(shè)計(jì)師仍要充分了解產(chǎn)品及想要傳遞給用戶的重點(diǎn)，并按照優(yōu)先級(jí)排列，而后充分體現(xiàn)在界面設(shè)計(jì)中?；谏衔奶岬降膶?duì)用戶行為以及偏好的分析和對(duì)產(chǎn)品特點(diǎn)的理解，從用戶的心理模型出發(fā)整合界面信息，設(shè)計(jì)符合用戶期望的人機(jī)交互界面。

組織界面信息是一個(gè)有計(jì)劃的過(guò)程，首先要對(duì)界面信息進(jìn)行合理歸類(lèi)分塊。研究證明人類(lèi)短期記憶能承受的選項(xiàng)數(shù)為7加減2個(gè)，而當(dāng)選項(xiàng)超過(guò)10個(gè)之后，用戶掃視、理解、處理的過(guò)程就會(huì)較為困難。［5］所以在組織分塊的階段，如何在用戶可承受的范圍內(nèi)將界面合理地組織分塊是首先要考慮的內(nèi)容。舉例來(lái)說(shuō)，微軟設(shè)計(jì)Word包含數(shù)百項(xiàng)功能，而為了用戶能夠更清晰地理解界面，則將功能依照不同類(lèi)別分別組織到9個(gè)菜單當(dāng)中。菜單包含的命令仍然過(guò)多，又把這些命令細(xì)分為不同塊。

合理的分塊幫助用戶有效理解并完成操作。在整合分塊結(jié)束后則需要進(jìn)行優(yōu)先級(jí)排序，通過(guò)最有效的方式將重要界面信息傳遞給用戶。在本案例的訓(xùn)練中，頁(yè)面被分為總銷(xiāo)售趨勢(shì)、細(xì)節(jié)分析、總結(jié)三個(gè)模塊。在細(xì)節(jié)分析中則再分為三個(gè)方向，分別為品牌、價(jià)格以及硬件。通過(guò)這樣的分層分塊，用戶能夠更加清晰地讀取其所需要的信息。

3、視覺(jué)體現(xiàn)

在根據(jù)用戶心理模型完成信息的組織之后，則需要將這些信息用視覺(jué)方式體現(xiàn)出來(lái)。合理運(yùn)用視覺(jué)的屬性將元素分組，從而創(chuàng)造出清晰的層次結(jié)構(gòu)。界面的設(shè)計(jì)可以通過(guò)顏色、大小、位置的方式來(lái)體現(xiàn)上文提到的信息分塊和信息層次。［5］首先從顏色方面來(lái)說(shuō)，不同的顏色在不同文化中代表不同的隱喻。比如，通常人們認(rèn)為紅色是消極暗示，而綠色則為積極暗示。在界面信息視覺(jué)化設(shè)計(jì)中可以充分利用這種色彩的隱喻來(lái)暗示用戶的操作，兩種或兩種以上的界面色彩合理地配合也可以充分表達(dá)界面信息的層次。在根據(jù)界面信息優(yōu)先級(jí)對(duì)信息進(jìn)行排序之后，利用強(qiáng)烈的對(duì)比或者互補(bǔ)色能夠突顯出信息的重要性，反之弱對(duì)比色或低飽和度的顏色則弱化了信息的重要程度。這種強(qiáng)弱對(duì)比并不是無(wú)序的、隨意的，而是統(tǒng)一在產(chǎn)品的整體色系中，統(tǒng)一在品牌的整體風(fēng)格中。

另外，元素的大小位置也應(yīng)該體現(xiàn)出信息的優(yōu)先級(jí)別。用戶使用界面的時(shí)候，應(yīng)當(dāng)從中清晰地了解到信息的主次。不同于平面設(shè)計(jì)，信息視覺(jué)化是一種對(duì)用戶行為的理解以及再塑造。在這一過(guò)程中必須充分考慮到用戶閱讀獲取信息的方式，其次再結(jié)合美學(xué)的考量進(jìn)行美化。

在本案例中，頁(yè)面信息組織的步驟完成后，則利用視覺(jué)元素將預(yù)設(shè)的層次關(guān)系進(jìn)行有效地表達(dá)。從圖1中可以看出，經(jīng)過(guò)初期的訓(xùn)練，學(xué)生能夠?qū)⑿畔蛹?jí)與分塊初步展現(xiàn)出來(lái)，然而信息表現(xiàn)過(guò)于平均，優(yōu)先信息并沒(méi)有被合理地視覺(jué)化突出。因此，需要再次進(jìn)行用戶體驗(yàn)分析，以便進(jìn)一步區(qū)分用戶偏好以決定頁(yè)面中的信息優(yōu)先順序。經(jīng)過(guò)再一次的分析，如圖2，判斷決定將細(xì)節(jié)分析模塊作為重點(diǎn)呈現(xiàn)，并且細(xì)分了這一模塊中的信息層次，將重點(diǎn)內(nèi)容突出?？偨Y(jié)模塊則用更加直觀的視覺(jué)元素代替了成段的文字，使得用戶閱讀更快速，從而進(jìn)一步提升了用戶體驗(yàn)。

四、總結(jié)

在體驗(yàn)經(jīng)濟(jì)背景下，用戶體驗(yàn)研究在設(shè)計(jì)的過(guò)程中有著不可替代的位置。而信息視覺(jué)化作為用戶體驗(yàn)研究的手段以及方式也正在被更多設(shè)計(jì)師重視起來(lái)。人機(jī)界面信息視覺(jué)化作為其中重要的組成部分，承擔(dān)著引導(dǎo)用戶并為其提供更有意義的體驗(yàn)的作用，也將產(chǎn)品的實(shí)現(xiàn)模型轉(zhuǎn)換為用戶心理模型，使得產(chǎn)品更為貼近用戶的認(rèn)知架構(gòu)，從而更方便用戶使用。另一方面來(lái)說(shuō)，人機(jī)信息視覺(jué)化通過(guò)有意識(shí)的信息組織及呈現(xiàn)，傳達(dá)給用戶產(chǎn)品及品牌的核心理念，從而增加用戶對(duì)產(chǎn)品及品牌的認(rèn)知度。設(shè)計(jì)師可以通過(guò)分析用戶行為偏好、組織信息和視覺(jué)體現(xiàn)三個(gè)方面來(lái)有意識(shí)地組織、呈現(xiàn)信息。用戶體驗(yàn)研究中的信息視覺(jué)化是將信息組織架構(gòu)、美學(xué)以及品牌策略結(jié)合的一門(mén)學(xué)科，也為設(shè)計(jì)的未來(lái)提出了一個(gè)值得探討的方向。

［1］（美）Alan Cooper， Robert Reimann， David Cronin. About Face3 交互設(shè)計(jì) 精髓. 北京：電子工業(yè)出版社，2008.

［2］方學(xué)兵. 人機(jī)界面信息視覺(jué)化. 合肥工業(yè)大學(xué)碩士學(xué)位論文，2010.

［3］ ISO可用性定義. https://en.wikipedia.org/wiki/Usability

［4］（美）Jon Kolko. Thoughts on interaction design交互設(shè)計(jì)沉思錄.北京：機(jī)械工業(yè)出版社，2012.

［5］（英）Giles Colborne. 簡(jiǎn)約至上交互式設(shè)計(jì)四策略. 北京：人民郵電出版社，2011.

（周沁，蘇州工藝美術(shù)職業(yè)技術(shù)學(xué)院助教）