交互設(shè)計(jì)黑魔法 |《交互系統(tǒng)新概念設(shè)計(jì)》

交互設(shè)計(jì)是我最不熟的一塊,一直覺(jué)得從定義好功能到出交互圖,這之間的過(guò)程就是個(gè)玄學(xué)。去尋找關(guān)于交互的書(shū),又發(fā)現(xiàn)大部分是一些案例集,或者只是介紹一些交互原則??吹健对O(shè)計(jì)心理學(xué)》說(shuō)到“心理模型”,覺(jué)得茅塞頓開(kāi),但是實(shí)際工作中依然很抽象。

最近終于找到一本書(shū),把這個(gè)黑魔法一步步翻譯成方法論。這本書(shū)介紹的內(nèi)容比較抽象,但作者寫(xiě)得還算通俗,且非常精煉,全書(shū)沒(méi)有廢話(和《信息架構(gòu):超越 web 設(shè)計(jì)》真是形成鮮明對(duì)比阿... > <),五星推薦?。?/p>

概念模型

概念模型是全書(shū)核心概念,它和信息架構(gòu)非常類(lèi)似。其實(shí),交互和信息架構(gòu)的界線,據(jù)我目前來(lái)看,是非常模糊的。

概念模型或信息架構(gòu)關(guān)注什么呢?作者用了一個(gè)很棒的房型圖隱喻:

圖1.jpg

它提供的是一個(gè)給定功能(例如,廚房和臥室)的空間整體布局,每個(gè)空間都在相對(duì)其他地方的整體架構(gòu)中。此外,通過(guò)對(duì)門(mén)和通道的描繪,方案還為我們提供了從一處到另一處所需路線的明確信息。

作為最簡(jiǎn)化的方案,在進(jìn)行實(shí)施前,該圖在評(píng)估架構(gòu)計(jì)劃時(shí)是非常有用的:是否提供了所有需要的功能(例如,有一個(gè)房屋)?是否有足夠的空間分配給每個(gè)功能(例如,餐廳和客廳應(yīng)該是最大的地方)?入口是否合適?從一處到另一處到路線和距離之間支持簡(jiǎn)單的導(dǎo)航嗎?

為什么要有這個(gè)全局的概念模型呢?

視覺(jué)場(chǎng)景的全局結(jié)構(gòu)往往先于任何局部特征的感知。

例如這個(gè)經(jīng)典的認(rèn)知實(shí)驗(yàn),對(duì)于大字母 H 的識(shí)別要快于小字母。

圖16.jpg

概念模型分層

圖2.jpg

功能層

作者認(rèn)為功能設(shè)計(jì)有3種類(lèi)型,面向任務(wù)的、面向?qū)ο蟮暮兔嫦騼?nèi)容的。實(shí)際設(shè)計(jì)中可能是不同類(lèi)型的混合。

圖3.jpg

架構(gòu)層(概念模型)

架構(gòu)層即概念模型,也是整個(gè)概念設(shè)計(jì)的核心,關(guān)注的是:

  • 用戶與應(yīng)用程序交互以完成任務(wù)和目標(biāo)的“空間”
  • 用戶需要的從一個(gè)“空間”到另一個(gè)“空間”的“路徑”
    (注意“空間“這個(gè)詞匯)

作者在全書(shū)中舉了一個(gè)“設(shè)置預(yù)約”的例子。3 個(gè)平臺(tái)上的不同設(shè)計(jì):

圖4.jpg

相應(yīng)的概念模型是:

圖5.jpg

可以看到同一個(gè)功能設(shè)計(jì),會(huì)有不同的概念模型。

導(dǎo)航和策略(物理模型)

這個(gè)部分首先是將概念元素轉(zhuǎn)為物理元素,然后是其中的導(dǎo)航和策略。

物理空間

這里有一個(gè)重要的概念,即上文提到的“空間”。概念元素的“空間”在物理元素里體現(xiàn)為一個(gè)頁(yè)面、或頁(yè)面上的一個(gè)模塊等等。

我們?cè)谥v元素、模型這樣的詞匯時(shí),容易把它們理解為物體。但這里所說(shuō)的元素是一個(gè)“空間”的概念??臻g和物體有什么區(qū)別呢?如果把一個(gè)物體和另一個(gè)疊加,不管怎么放,始終是兩個(gè)物體。但兩個(gè)空間疊加,也可以理解為成為了一個(gè)空間。

知曉了這個(gè)區(qū)別,就比較好理解一個(gè)問(wèn)題,即,概念空間和物理空間有時(shí)是一對(duì)一的關(guān)系,有時(shí)可能不是。

如下圖,對(duì)于 3 個(gè)概念元素,上圖中是 3 個(gè)物理空間,而下圖中是放在 1 個(gè)物理空間中。

圖6.jpg

導(dǎo)航和策略

這部分關(guān)注兩點(diǎn)。

  • 空間間的路徑:出口和入口、路徑的方向、數(shù)量
  • 模態(tài) or 非模態(tài)

我們?cè)谠O(shè)計(jì)用戶路徑的時(shí)候需要考慮一個(gè)基礎(chǔ)問(wèn)題,即:

用戶是否可以同時(shí)執(zhí)行不止一項(xiàng)任務(wù)?就交互流而言,這個(gè)問(wèn)題會(huì)產(chǎn)生以下影響:用戶進(jìn)行到下一項(xiàng)任務(wù)之前是否應(yīng)該全部完成或部分完成當(dāng)前的任務(wù)?用戶是否需要完成給定的任務(wù),然后跳轉(zhuǎn)從而繼續(xù)完成下一任務(wù),并且完成下一任務(wù)后是否應(yīng)該能夠再返回去完成初始任務(wù)?

這就引出模態(tài)的概念。

非模態(tài)概念模型元素允許用戶同時(shí)與其他概念模型元素進(jìn)行一對(duì)一交互。反之當(dāng)交互原則限定了用戶在同一情景中一次只能與一個(gè)概念元素進(jìn)行一對(duì)一的交互時(shí),我們稱(chēng)之為模態(tài)交互策略。

我理解,非模態(tài)指的是你可以先在這個(gè)概念空間交互,再在那個(gè)概念空間交互或者反之,而模態(tài)是你必須先在這個(gè)概念空間交互,再在那個(gè)概念空間交互交互。它們的區(qū)別是交互順序是否被指定。

物理空間是否相同、是否模態(tài)組成了不同的概念模型:

圖7.jpg

再看設(shè)置預(yù)約例子中的物理空間:

圖8.jpg

形式層和細(xì)節(jié)層

就是交互和視覺(jué)的細(xì)節(jié)

所以總結(jié)一下,交互設(shè)計(jì)遵循從功能到概念模型,再到物理模型再到交互細(xì)節(jié)的過(guò)程。

概念模型的類(lèi)型

概念模型可分為兩個(gè)主要類(lèi)別:

  • 順序和結(jié)構(gòu)化:?jiǎn)涡蛄薪Y(jié)構(gòu)模型、層級(jí)結(jié)構(gòu)或多序列結(jié)構(gòu)模型。
  • 非順序和非結(jié)構(gòu)化:軸輻型、矩陣型和網(wǎng)絡(luò)型。
圖9.jpg

概念模型越復(fù)雜,通常給用戶提供的自由度越高。用戶執(zhí)行各種任務(wù)時(shí)靈活性越高,控制越多,特別適合專(zhuān)家用戶。

這個(gè)復(fù)雜度在于:概念元素的數(shù)量、出口和入口的數(shù)量、用戶可采取路徑的數(shù)量。

概念模型評(píng)價(jià):用戶績(jī)效和可用性

如何可知概念模型用戶體驗(yàn)如何?作者分了兩個(gè)指標(biāo)。

用戶績(jī)效

用戶績(jī)效指的是

感知、認(rèn)知、情感以及物質(zhì)的過(guò)程和行為。

評(píng)估包括 5 個(gè)方面:

  • 心理模型與理解力
  • 位置感知
  • 視覺(jué)搜索效率
  • 操作(執(zhí)行動(dòng)作)負(fù)荷
  • 工作記憶負(fù)荷

心理模型與理解力

操作和任務(wù)流程是否符合用戶心理模型。

位置感知

位置感知是指

我們能意識(shí)到我們?cè)谀?,我們周?chē)惺裁?,我們到達(dá)我們所在位置的路徑以及可能是目的地的其他位置的能力。

影響因素:

  • 訪問(wèn)空間的個(gè)數(shù)
  • “地標(biāo)”“您在這兒”的定位幫助
  • 空間之間路徑的長(zhǎng)度和復(fù)雜程度等
  • 是否存在于相同物理空間。

存在于相似物理空間的概念空間之間的導(dǎo)航,比不同物理空間間的,位置感知更有效率。

視覺(jué)搜索效率

視覺(jué)搜索是我們通過(guò)瀏覽視覺(jué)屏幕尋找特定目標(biāo)的感知過(guò)程。在這個(gè)過(guò)程中,屏幕中任何其他非目標(biāo)元素都是干擾。

影響因素有:

  • 場(chǎng)景中元素的數(shù)量
  • 元素特定的視覺(jué)屬性,如大小、顏色、形狀以及與其他項(xiàng)目的相似性
  • 元素的視覺(jué)布置和組織

這里注意位置感知和視覺(jué)搜索效率可能會(huì)矛盾。同一物理空間,概念元素越多,越容易位置感知,但越會(huì)降低搜索效率。

操作負(fù)荷

影響因素:

  • 操作的數(shù)量
  • 物理空間間的路徑

物理空間越少,空間間路徑越少,操作負(fù)荷越小。

工作記憶

用戶記憶負(fù)擔(dān)越少,體驗(yàn)越好。

圖10.jpg

可用性

指標(biāo)有:

  • 易學(xué)性:與工作記憶有關(guān)
  • 有效性:與位置感知、視覺(jué)搜索效率有關(guān)
  • 效率:與工作記憶有關(guān)
  • 滿意度
圖11.jpg

怎么做?

功能層

前面用戶調(diào)研、場(chǎng)景分析就不說(shuō)了。

這里注意場(chǎng)景分析是進(jìn)行對(duì)象行為分析。這個(gè)對(duì)象包括三個(gè)方面,不是單單分析人。

作者舉了一個(gè)例子,為一個(gè)跑步愛(ài)好者做一個(gè)跑步時(shí)可以使用的應(yīng)用。

  • 實(shí)體對(duì)象:物理和有形的實(shí)體。例如 GPS 接收器、音樂(lè)播放器或道路本身等。
  • 抽象對(duì)象:通過(guò)“不是xxx“來(lái)定義。所有不是人、不是實(shí)體對(duì)象的都可以。如運(yùn)動(dòng)計(jì)劃、已進(jìn)行的運(yùn)動(dòng)等。

除了關(guān)注用戶本身的行為,還應(yīng)關(guān)注用戶和實(shí)體對(duì)象、抽象對(duì)象的互動(dòng)等。

圖12.jpg

然后還有任務(wù)和流程分析。

進(jìn)行用戶調(diào)研,關(guān)注場(chǎng)景中的對(duì)象行為,進(jìn)行任務(wù)流程分析。如此考慮對(duì)象、任務(wù)、內(nèi)容,差不多就能整理出功能。

架構(gòu)層

這一步從功能過(guò)渡到概念模型,主要是去抽象出核心的概念元素。

導(dǎo)航和策略

這一步從概念模型過(guò)渡到物理模型。

勾勒概念導(dǎo)航圖

  • 概念元素的進(jìn)出口
  • 概念元素之間連接的導(dǎo)航方向
圖13.jpg

如何評(píng)估呢?

可進(jìn)行概念模型評(píng)估、用戶績(jī)效和可用性評(píng)估

概念模型評(píng)估

  • 它是否能代表所有功能模塊?
  • 它是否能表達(dá)元素之間的連接關(guān)系、并反映出功能模塊之間的連接?
  • 導(dǎo)航地圖是否支持工作流程?
  • 模型的復(fù)雜程度是否適合用戶畫(huà)像和任務(wù)結(jié)構(gòu)

定義概念元素的物理空間分配

這一步首先分析我們?cè)谌蝿?wù)分析、對(duì)象行為分析中得到的結(jié)論:

  • 用戶做某事的頻率是多少?
    相似頻率的概念元素可以安排在同一或相鄰物理空間。

  • 用戶能夠同時(shí)做些什么?
    同一時(shí)間內(nèi)完成的任務(wù)或操作,無(wú)論是對(duì)于同個(gè)對(duì)象或不同對(duì)象,都可以考慮分配在同一或相鄰物理空間。

  • 用戶在做了某件事之后會(huì)接著做什么?
    一系列連續(xù)的操作可以被考慮放在同一或相鄰物理空間。

  • 某事是否取決于另一件事?
    具有依屬關(guān)系的操作可以被考慮放在同一或相鄰物理空間。

  • 用戶能同時(shí)看到什么?
    一個(gè)任務(wù)或?qū)ο蟮目梢?jiàn)性是指其狀態(tài)能夠被用戶注意到的等級(jí)。我們需要確定哪些任務(wù)或狀態(tài)是需要被用戶看到的。被要求可見(jiàn)性程度相同的任務(wù)和操作可以被考慮放在同一或相鄰物理空間。

  • 直覺(jué)性和易尋找性如何?
    具有高度相似性的任務(wù)和對(duì)象可以被考慮放在同一或相鄰物理空間。

圖14.jpg

此外還要考慮用戶使用情境

  • 物理情境:室內(nèi)室外、白天晚上、安靜吵鬧、氣溫等等
  • 工作流程情境:當(dāng)前位于的特定階段、步驟或狀態(tài)。如初次安裝等。
  • 個(gè)人情境:新手老手、清醒疲勞等等
  • 社會(huì)情境:團(tuán)隊(duì)合作、分享互動(dòng)、本地遠(yuǎn)程;國(guó)籍、文化、種族等。

定義導(dǎo)航策略

定義模態(tài)還是非模態(tài)。

這里注意通常大屏幕需要考慮更多。需考慮窗口、對(duì)話框、屏幕間有無(wú)模態(tài)上的聯(lián)系。小屏幕由于物理限制,通常設(shè)計(jì)出來(lái)都是相互排斥的元素,即模態(tài)的。

形式層和細(xì)節(jié)層

考慮操作、參數(shù)、信息

操作

區(qū)分導(dǎo)航操作和在目標(biāo)對(duì)象上執(zhí)行的操作。

導(dǎo)航操作是指那些能夠使得用戶在導(dǎo)航地圖和概念模型中轉(zhuǎn)移的操作。例如,打開(kāi)或關(guān)閉一個(gè)窗口,點(diǎn)擊一個(gè)標(biāo)簽頁(yè)來(lái)到另一個(gè)概念元素上,或打開(kāi)一個(gè)文件、應(yīng)用。

在目標(biāo)對(duì)象上執(zhí)行的操作包括創(chuàng)建、修改、刪除對(duì)象等。

參數(shù)

每個(gè)目標(biāo)對(duì)象一般會(huì)有參數(shù)。例如跑步的例子中,計(jì)劃跑步里程是一個(gè)能幫助用戶定義任務(wù)的參數(shù)。

信息

任何信息,無(wú)論是靜態(tài)的還是動(dòng)態(tài)的,都不是被用戶定義的。

這些信息包括任何來(lái)自外部但是沒(méi)有被用戶輸入或者設(shè)置的信息。例如,標(biāo)題、字幕、描述、解釋、參數(shù)的標(biāo)簽等。

圖15.jpg
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容