值得你深入了解的交互設計五大支柱

隨著單頁式設計和移動端的興起，網頁中的交互設計越來越重要了。為了打造流暢而可靠的用戶體驗，你需要對交互設計有更加深入的了解。

正如同我們在《交互設計最佳實踐（卷1）》中所述，要做好交互設計，需要對多個學科有著深入的了解和熟練的掌控，這也是非常符合邏輯的——你要試圖讓一系列事物所構成的系統令人感到友好，易于學習并且非常實用，這并不是一件簡單易行的事情。

所以，讓我們從最基礎的交互設計的概念開始，深入了解核心設計原則，并且借助五步設計流程，更好地完成交互設計。

真正優秀的交互設計，是由人情紐帶所驅動的。那么問題來了，人的情緒紐帶又是如何轉化成數字化的界面和接口的呢？答案的當然是存在的，但是并非是由非黑即白的是與否、對與錯所構成。根據我們的經驗，真正成功的交互設計立足于基本用戶體驗設計的完美執行。

看起來不像是一個答案？沒事，我們慢慢看下去。

1、結果驅動式設計

即使不親自參與用戶研究，但是你還是得知道如何對設計構建成熟的認知。

我們在《用戶體驗設計師必備的4種UX文檔》這篇文章中對于交互設計師必須知道的四種UX文檔有了深入的介紹，這些文檔——或者說過程，可以幫你構建起有血有肉的“用戶”，對具體的產品流程有更真實的還原：

1、用戶角色（Persona）：Persona文檔（控制在2~5個）通常需要包含你的目標用戶。作為Persona中的虛構的角色，它的屬性和特征是基于產品研究和用戶定位來設定的，用作后續設計過程中所面對的“理想用戶”，本質上，它就是一個占位符。作為人物設定，其中會包含個人信息，遠不止于年齡和收入信息這么簡單。Persona 文檔的目標是利用角色來驗證你的目標用戶是如何感受如何看待你的設計的。

2、移情地圖（Empathy Map）：它像是一個輕量級的Persona文檔，在資源短缺時間緊的狀況下，可以使用這個文檔。Empathy Map 將 Persona 中的角色的個性和性格部分移除了，更加專注于用戶在特定情況下的感受。

3、用戶劇本（User Scenario）：如果Persona 是幫你設計了一個故事中的角色，那么User Scenario 就是故事的劇本。用戶劇本通常是圍繞著一個特定目標來設計的。比如說，第二天是母親節，要為母親預訂一份禮物。目標很明確，要達成目標，用戶需要點擊幾次按鈕，走哪些流程，需要多長時間，如何在過程中融入情感，貫穿始終。對整個用戶流程有了預判之后，設計師對于UI和UX的設計就有了把握。

4、用戶地圖（Customer Journey Map）：這份文檔同上門的用戶劇本很像，但是它比起前者跨度更大，貫穿體驗設計始終。設計人員可以對產品的背景有更深入的了解才能更好地設計，而產品投入使用之后也不是最終結束，這也是跨度如此之大的原因所在。用戶旅圖將會涵蓋角色信息、用戶劇本和移情地圖的全部信息。這么設定并不是要讓用戶旅圖成為一個大雜燴，而是要將用戶性格和用戶流程、交互過程結合到一起來看待問題，每個階段不同環節，都牽涉到不同的情緒和情感。

2、可用性設計

確?？捎眯允亲畹拖薅鹊脑O計。如果你的用戶都無法正常使用產品，就更談不上吸引他們了。看看下面的 EventBrite 的座位設計吧。

這個在線的APP允許活動的組織者從活動創建之初就可以保留特定的座位，整個流程保留了大量的細節（特定的行、列，是否靠近舞池等），設計者將多個步驟、多個流程整合到一個流程當中。

就像EventBrite 這樣，復雜的系統尤其要保證它的易用性，整個流程要流暢，讓用戶感到不費吹灰之力就能搞定。在探索系統上耗費的時間越短，用戶就越能做好手頭真正重要的事情。

3、可供性設計和能指

可供性設計，在我們之前的文章中曾經解釋過：

Affordance 是 James J. Gibson 造出來的一個詞，Gibson 是20世紀最重要的認知心理學家之一，他的生態學式視知覺論和直接知覺為認知心理學開辟了新的領地。affordance 是 afford (提供、給予、承擔)的名詞形式，環境的 affordance 是指這個環境可提供給動物的屬性，無論是好的還是壞的，所以我認為“可供性”是一個合適的翻譯。Gibson 用來解釋 affordance 的例子是這樣的：如果一塊地表面接近水平（而不是傾斜的），接近平整的（而不是凸起或凹陷的），以及充分延伸的（與動物的尺寸相關），如果地表面的物質是堅硬的（與動物的重量相關），我們可稱它為基底、場地或地面，它是可以站上去的（stan-on-able），可讓四足或兩足動物保持豎直姿勢，它是可以行走（walk-on-able）和跑動（run-over-able）的，它不像水表面或沼澤表面之于一定重量的動物那樣是可陷入的（sink-into-able）。列出的四項屬性——水平、平整、延伸和堅硬——它們是這個表面的物理屬性，如果以物理中使用的度量衡去衡量它們的話，但是對于特定動物的支撐可供性，它們必須與動物關聯上才可以被衡量，它們不是抽象的物理屬性，它們是為所指動物特定的，與動物的姿勢和行為相關，所以 affordance 不能像我們在物理中那樣來衡量。

我們在探討交互設計的可供性之時，認為一個功能應該能為自己發聲，通過合理的方式聲明它本身的用處（道路可供人步行）。

能指（Signifiers）是個語言學概念：

能指和所指是語言學上的一對概念，能指意為語言文字的聲音，形象；所指則是語言的意義本身。按照語言學家或者哲學家們的劃分，人們試圖通過語言表達出來的東西叫”所指”，而語言實際傳達出來的東西叫”能指”。

簡單說來，可供性設計所傳達出來的東西，就是它的能指。（地面是平的表明人可以用腳在上面走路）

沒有能指，用戶也就無法真正察覺到其中的可供性設計。

在上面的案例中，你能看到按鈕設計的進化和發展。第一個按鈕僅僅只是單詞，沒有能指，而第三個按鈕加上了圓角邊框和陰影層次，反映出它作為“按鈕”的特征。

能指同樣可以以比喻或者暗喻的形式存在，因為人們需要明白他們為什么要同這個對象進行互動，而不止是知道他們可以。正如同上門iPhone 屏幕底部的托盤，你能看到圓角邊框的按鈕，從而了解我們可以按它，其中的電話、郵件和音符等符號，則以特定的形象暗示用戶，點擊按鈕可以達到什么樣的目的，做什么樣的事情。

(編輯：小酷)