起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識譯文 | 交互設計的5大支柱
原文來自theNextWeb，作者Jerry Cao，一位就職于UXPin的內容策略專家。
就像在《交互設計最佳實踐：卷１》中描述的那樣，交互設計需要掌握用戶體驗的多個學科——這是有意義的，因為使一個由對象組成的系統用起來令人感覺友好，可學習并且有用，這是很不容易。
讓我們首先來定義交互設計，分解核心原則，然后解釋如何通過五個步驟來更好地進行交互設計。
良好的交互設計是由人類的連接驅動的。但是到底是什么驅使著人類連接，并且它又如何能轉化為電腦界面呢？這些問題的答案不是那么直白的。在我們的經驗中，我們發現交互設計的成功依賴于基礎用戶體驗的完美執行。
一、目標驅動的設計
即使你不親自進行用戶研究，你還是需要知道如何把觀察成果融入你的設計中。
我們找到了以下的用戶體驗設計過程，可以幫助你與那些有血有肉的用戶保持同理心：
１）創建角色，角色是根據你的目標用戶的行為和心理虛構出來的人物。當你在做至關重要的設計決策時，角色往往能作為參考派上用場，例如，“作為季節性購物者，莎莉會喜歡什么樣的結帳過程？”
２）用戶場景——與我們創建的角色相呼應，用戶場景解釋了角色在使用網站時將如何采取行動。例如，“黑色星期五，季節性購物者莎莉在工作之前就準備好了一長串要的網購禮物清單?！坝脩魣鼍捌仁鼓闾剿鹘巧c你的產品交互的上下文。
３）體驗地圖——從用戶場景更進一步，體驗地圖記錄圍繞單個交互的所有條件，包括情感和外部環境?！傲钌蛏鷼獾幕┞眯幸运耐炔抗钦蹫榻Y束，作為季節性購物者，莎莉必須盡快進行她的圣誕購物了?！?/p>
這三個技巧幫助我們構建出了一幅完整的體驗畫面：用戶、場景，整個情感旅程。
二、可用性
可用性是設計的最低限度。如果你的聽眾不能使用產品，他們肯定不會想要這個產品。讓我們來看看EventBrite的座位設計。
這個在線應用程序允許活動組織者創建可以預留座位的活動，包括從開始到結束的流程甚至還有高水平的細節（如確定座位行數、桌子數量和如果有需要的話還可以提供一個舞池）。它把一個多步驟，多任務的過程固化為一條簡單線性的操作路徑。
就像EventBrite這樣，系統的可用性必須使用戶覺得毫不費力。讓用戶越少地花精力弄明白系統本身，他們可以越多地完成手頭的任務。
三、功能可見性和表意符號
功能可見性的概念是指，一個功能必須為自己說話，并表明自己的用途（比如道路用來提供給用戶行走）。而示意物則象征或者暗示了功能可見性（比如道路的平坦表面暗示你應該用腳走路）。
沒有表意符號，用戶可能無法感知到功能的可見性。
在上面的示例中，您可以看到按鈕設計的進化。第一階段它沒有任何表意，看起來就像標準的文本，而第三階段則類似于真實的按鈕，具有圓形邊緣和漸變。
表意符號也可以是隱喻，因為人們還需要知道為什么他們與界面能交互，而不僅僅是能不能交互。在上面的iPhone?Dock示例中，隱喻的圖像（手機、信封、音符）達成了溝通的目的，你便知道了帶圓形邊緣的按鈕是可以與我們交互的。
四、易學性
在理想世界里，每個用戶只要經過一次使用后就能記得所有功能。但現實是完全不同的。熟悉感和直覺性必須被設計到每一個界面中去。
成功的交互設計是通過創建一致性和可預測性化解復雜性。例如，不要讓部分鏈接在新標簽打開，同時又讓其他鏈接只在當前頁重定向。同樣，不要讓一些圖片在模態窗打開，同時其他的卻是在新標簽頁打開。
一致性構成了可預測性，進而提高了易學性。
提高可學習性的一個常見的策略是使用成熟的UI設計模式。許多網站和應用程序都已經在使用這些模式，所以用戶對它們很熟悉（其中模式是具有一致性的），而你仍然有足夠的創作空間來定制你站點中的設計元素。
例如，面包屑是一種常見的網頁設計模式，用來幫助用戶瀏覽網站。不管你在什么網站，如果你看到面包屑，你就理解它們是如何工作的。這種熟悉感有助于提高產品的可學習性。當產品是易學的，就能鼓勵人們去使用這些產品，自然就可以提高了可用性。
五、反饋和響應時間
反饋是交互的核心。因為每次交互都是用戶和產品之間的談話，你的產品最好能是友好的，有趣并且有幫助的。
不管是否精心設計了一個動畫，一次美好的微交互，或者一聲簡單的嗶，你的產品都必須保持向用戶溝通任務是否完成（和下一步要做什么）。
在下面這個來自Hootsuite的例子，經過一段較長時間用戶沒有活動的話，這只貓頭鷹就會簡單地去“睡覺”，而這是有意義的，因為應用程序是從Twitter獲取數據的（并且也不想讓數據接口過載）。這樣的反饋是聰明而有趣的，并且實際上把一個可能算是負面的體驗（停止更新數據）轉變成了一個積極的體驗。
反饋的另一個關鍵因素是響應時間。最好的響應時間是盡可能立即響應。想象下如果這是你在彈吉他，每個音調都在彈奏后好幾秒才出來會多么讓人懊惱。
改進交互的5個步驟
現在你已經知道了基礎元素，我們將介紹一系列我們發現的很有助于完善細節的設計步驟。
著名的交互設計師斯蒂芬·安德森建議過，當你作為用戶使用你的界面時，如果有個真人扮演你的界面與你交互，將會令你大開眼界。你會聽完所有界面反饋的大聲而尷尬的響應，這將幫助你避免創建冰冷的機器人式交互。一旦你完成了這些角色扮演，你就可以開始起稿你的故事，并重新組織你的交互。
過程是這樣的：
將交互變為角色扮演——隨便抓兩個人，一個作為界面，另外一個做筆記。做一個瀏覽器窗口的牌子由扮演界面的人舉著，再把界面用投影儀展示出來。然后，開始與你進行對話，其中你作為用戶解釋你的目標，而“界面”被限制了他們的反應只能有標簽，菜單以及UI中的其他元素。好好地觀察視頻和文字記錄，看結果會怎樣。
繪制出故事——把體驗的每一步都記錄成文檔，包括每一步的任務和用戶情感。就像在《用戶體驗設計文檔指南》中所討論過的，這可能簡單到只是幾個用戶場景，也可能復雜到是一個四層級體驗地圖。
簡化步驟——用戶有時會有一些需要很多步驟的目標（比如在網上買車，預訂機票）。指南推薦的原型、用戶界面必須能夠把一個單獨而復雜的目標分解為簡單的步驟（像是簡單地請求下目的地，再然后是出發／到達日期，等等）。例如，美國維珍網站的臺階式表單設計把預訂過程變得比實際感覺容易得多。
限制用戶的選擇——這可能是最困難的一步，但你確實必須最小化你提供給用戶的操作?？偸菃栕约核械倪x項在那一刻時間是不是都是關鍵的。如果不是，就把它放到另一個會話里。
注意微時刻——微時刻是當一個用戶與界面交互時可能猶豫，前進，或者停止的時刻。如果你回顧角色扮演練習，你會想過來一些能理解的時刻。為了讓談話變得清晰，可以利用縮微復制和UI模式，比如帶上下文的操作和選擇依賴式的輸入框（我們已經在《2014年Web?UI模式》討論過）。
就像如果關掉細節，魔術師的技巧將會失敗那樣，一個糟糕的交互可以毀掉整個用戶體驗。上面描述的過程中，我們將幫助你把交互作為一種談話而不是一種動畫界面來設計。
如果你想要更多的靈感和優秀的交互設計案例，這個Quora問題里囊括了從電影到Core77和PatternTap這類電影網站等在內的很多優秀來源。
結尾辭
交互設計不是關于界面的行為，它是關于如何適應現有技術并且基于人的行為的。你必須知道你的目標用戶功能和情感上的喜好和期望。然后基于技術限制，去設計令人滿意的產品。
最好的交互設計幾乎就只是這樣：只需要你的產品能及時響應，無需多余的思考，并且工作起來立竿見影。
文中提到的《交互設計最佳實踐：卷１》\《用戶體驗設計文檔指南》\《2014年Web UI模式》可在此處下載，建議先保存到網盤~
本文由 @lrioLee（微信公眾號［簡并］） 翻譯發布于人人都是產品經理?，未經許可，禁止轉載。
- 目前還沒評論，等你發揮！
