原文來(lái)自theNextWeb，作者Jerry Cao，一位就職于UXPin的內(nèi)容策略專家。

就像在《交互設(shè)計(jì)最佳實(shí)踐：卷１》中描述的那樣，交互設(shè)計(jì)需要掌握用戶體驗(yàn)的多個(gè)學(xué)科——這是有意義的，因?yàn)槭挂粋€(gè)由對(duì)象組成的系統(tǒng)用起來(lái)令人感覺(jué)友好，可學(xué)習(xí)并且有用，這是很不容易。

讓我們首先來(lái)定義交互設(shè)計(jì)，分解核心原則，然后解釋如何通過(guò)五個(gè)步驟來(lái)更好地進(jìn)行交互設(shè)計(jì)。

良好的交互設(shè)計(jì)是由人類的連接驅(qū)動(dòng)的。但是到底是什么驅(qū)使著人類連接，并且它又如何能轉(zhuǎn)化為電腦界面呢？這些問(wèn)題的答案不是那么直白的。在我們的經(jīng)驗(yàn)中，我們發(fā)現(xiàn)交互設(shè)計(jì)的成功依賴于基礎(chǔ)用戶體驗(yàn)的完美執(zhí)行。

一、目標(biāo)驅(qū)動(dòng)的設(shè)計(jì)

即使你不親自進(jìn)行用戶研究，你還是需要知道如何把觀察成果融入你的設(shè)計(jì)中。

我們找到了以下的用戶體驗(yàn)設(shè)計(jì)過(guò)程，可以幫助你與那些有血有肉的用戶保持同理心：

１）創(chuàng)建角色，角色是根據(jù)你的目標(biāo)用戶的行為和心理虛構(gòu)出來(lái)的人物。當(dāng)你在做至關(guān)重要的設(shè)計(jì)決策時(shí)，角色往往能作為參考派上用場(chǎng)，例如，“作為季節(jié)性購(gòu)物者，莎莉會(huì)喜歡什么樣的結(jié)帳過(guò)程？”

２）用戶場(chǎng)景——與我們創(chuàng)建的角色相呼應(yīng)，用戶場(chǎng)景解釋了角色在使用網(wǎng)站時(shí)將如何采取行動(dòng)。例如，“黑色星期五，季節(jié)性購(gòu)物者莎莉在工作之前就準(zhǔn)備好了一長(zhǎng)串要的網(wǎng)購(gòu)禮物清單。“用戶場(chǎng)景迫使你探索角色與你的產(chǎn)品交互的上下文。

３）體驗(yàn)地圖——從用戶場(chǎng)景更進(jìn)一步，體驗(yàn)地圖記錄圍繞單個(gè)交互的所有條件，包括情感和外部環(huán)境?！傲钌蛏鷼獾幕┞眯幸运耐炔抗钦蹫榻Y(jié)束，作為季節(jié)性購(gòu)物者，莎莉必須盡快進(jìn)行她的圣誕購(gòu)物了?！?/p>

這三個(gè)技巧幫助我們構(gòu)建出了一幅完整的體驗(yàn)畫(huà)面：用戶、場(chǎng)景，整個(gè)情感旅程。

二、可用性

可用性是設(shè)計(jì)的最低限度。如果你的聽(tīng)眾不能使用產(chǎn)品，他們肯定不會(huì)想要這個(gè)產(chǎn)品。讓我們來(lái)看看EventBrite的座位設(shè)計(jì)。

這個(gè)在線應(yīng)用程序允許活動(dòng)組織者創(chuàng)建可以預(yù)留座位的活動(dòng)，包括從開(kāi)始到結(jié)束的流程甚至還有高水平的細(xì)節(jié)（如確定座位行數(shù)、桌子數(shù)量和如果有需要的話還可以提供一個(gè)舞池）。它把一個(gè)多步驟，多任務(wù)的過(guò)程固化為一條簡(jiǎn)單線性的操作路徑。

就像EventBrite這樣，系統(tǒng)的可用性必須使用戶覺(jué)得毫不費(fèi)力。讓用戶越少地花精力弄明白系統(tǒng)本身，他們可以越多地完成手頭的任務(wù)。

三、功能可見(jiàn)性和表意符號(hào)

功能可見(jiàn)性的概念是指，一個(gè)功能必須為自己說(shuō)話，并表明自己的用途（比如道路用來(lái)提供給用戶行走）。而示意物則象征或者暗示了功能可見(jiàn)性（比如道路的平坦表面暗示你應(yīng)該用腳走路）。

沒(méi)有表意符號(hào)，用戶可能無(wú)法感知到功能的可見(jiàn)性。

在上面的示例中，您可以看到按鈕設(shè)計(jì)的進(jìn)化。第一階段它沒(méi)有任何表意，看起來(lái)就像標(biāo)準(zhǔn)的文本，而第三階段則類似于真實(shí)的按鈕，具有圓形邊緣和漸變。

表意符號(hào)也可以是隱喻，因?yàn)槿藗冞€需要知道為什么他們與界面能交互，而不僅僅是能不能交互。在上面的iPhone?Dock示例中，隱喻的圖像（手機(jī)、信封、音符）達(dá)成了溝通的目的，你便知道了帶圓形邊緣的按鈕是可以與我們交互的。

四、易學(xué)性

在理想世界里，每個(gè)用戶只要經(jīng)過(guò)一次使用后就能記得所有功能。但現(xiàn)實(shí)是完全不同的。熟悉感和直覺(jué)性必須被設(shè)計(jì)到每一個(gè)界面中去。

成功的交互設(shè)計(jì)是通過(guò)創(chuàng)建一致性和可預(yù)測(cè)性化解復(fù)雜性。例如，不要讓部分鏈接在新標(biāo)簽打開(kāi)，同時(shí)又讓其他鏈接只在當(dāng)前頁(yè)重定向。同樣，不要讓一些圖片在模態(tài)窗打開(kāi)，同時(shí)其他的卻是在新標(biāo)簽頁(yè)打開(kāi)。

一致性構(gòu)成了可預(yù)測(cè)性，進(jìn)而提高了易學(xué)性。

提高可學(xué)習(xí)性的一個(gè)常見(jiàn)的策略是使用成熟的UI設(shè)計(jì)模式。許多網(wǎng)站和應(yīng)用程序都已經(jīng)在使用這些模式，所以用戶對(duì)它們很熟悉（其中模式是具有一致性的），而你仍然有足夠的創(chuàng)作空間來(lái)定制你站點(diǎn)中的設(shè)計(jì)元素。

例如，面包屑是一種常見(jiàn)的網(wǎng)頁(yè)設(shè)計(jì)模式，用來(lái)幫助用戶瀏覽網(wǎng)站。不管你在什么網(wǎng)站，如果你看到面包屑，你就理解它們是如何工作的。這種熟悉感有助于提高產(chǎn)品的可學(xué)習(xí)性。當(dāng)產(chǎn)品是易學(xué)的，就能鼓勵(lì)人們?nèi)ナ褂眠@些產(chǎn)品，自然就可以提高了可用性。

五、反饋和響應(yīng)時(shí)間

反饋是交互的核心。因?yàn)槊看谓换ザ际怯脩艉彤a(chǎn)品之間的談話，你的產(chǎn)品最好能是友好的，有趣并且有幫助的。

不管是否精心設(shè)計(jì)了一個(gè)動(dòng)畫(huà)，一次美好的微交互，或者一聲簡(jiǎn)單的嗶，你的產(chǎn)品都必須保持向用戶溝通任務(wù)是否完成（和下一步要做什么）。

在下面這個(gè)來(lái)自Hootsuite的例子，經(jīng)過(guò)一段較長(zhǎng)時(shí)間用戶沒(méi)有活動(dòng)的話，這只貓頭鷹就會(huì)簡(jiǎn)單地去“睡覺(jué)”，而這是有意義的，因?yàn)閼?yīng)用程序是從Twitter獲取數(shù)據(jù)的（并且也不想讓數(shù)據(jù)接口過(guò)載）。這樣的反饋是聰明而有趣的，并且實(shí)際上把一個(gè)可能算是負(fù)面的體驗(yàn)（停止更新數(shù)據(jù)）轉(zhuǎn)變成了一個(gè)積極的體驗(yàn)。

反饋的另一個(gè)關(guān)鍵因素是響應(yīng)時(shí)間。最好的響應(yīng)時(shí)間是盡可能立即響應(yīng)。想象下如果這是你在彈吉他，每個(gè)音調(diào)都在彈奏后好幾秒才出來(lái)會(huì)多么讓人懊惱。

改進(jìn)交互的5個(gè)步驟

現(xiàn)在你已經(jīng)知道了基礎(chǔ)元素，我們將介紹一系列我們發(fā)現(xiàn)的很有助于完善細(xì)節(jié)的設(shè)計(jì)步驟。

著名的交互設(shè)計(jì)師斯蒂芬·安德森建議過(guò)，當(dāng)你作為用戶使用你的界面時(shí)，如果有個(gè)真人扮演你的界面與你交互，將會(huì)令你大開(kāi)眼界。你會(huì)聽(tīng)完所有界面反饋的大聲而尷尬的響應(yīng)，這將幫助你避免創(chuàng)建冰冷的機(jī)器人式交互。一旦你完成了這些角色扮演，你就可以開(kāi)始起稿你的故事，并重新組織你的交互。

過(guò)程是這樣的：

將交互變?yōu)榻巧缪?/b>——隨便抓兩個(gè)人，一個(gè)作為界面，另外一個(gè)做筆記。做一個(gè)瀏覽器窗口的牌子由扮演界面的人舉著，再把界面用投影儀展示出來(lái)。然后，開(kāi)始與你進(jìn)行對(duì)話，其中你作為用戶解釋你的目標(biāo)，而“界面”被限制了他們的反應(yīng)只能有標(biāo)簽，菜單以及UI中的其他元素。好好地觀察視頻和文字記錄，看結(jié)果會(huì)怎樣。