讀書筆記-易用為王：改進產品設計的10個策略

05-12

本文為，我在閱讀中記錄下的內容要點整理。

關於作者

Eric Reiss 現任丹麥FatDUX集團的CEO，長期致力於信息架構、可用性、用戶體驗和服務設計等領域。2010年被評為「歐洲十大內容策略專家之一」。此外，他還作為藝術表演家和音樂人活躍在舞台和熒幕上。

內容簡介

《易用為王：改進產品設計的10個策略》從用戶的角度出發，分析了網站和服務等產品在設計方面存在的可用性問題，幫助人們簡易評估自己的產品，進而改進產品設計並提升產品的用戶體驗。本書共分為2個部分，從功能性、響應性、簡單易用性等10個方面闡釋了改進產品設計的諸多策略與原則。適合Web設計師、產品和服務設計人員，以及用戶體驗相關領域的人們閱讀。

讀書筆記

可用性包括兩個要素

易用性 指產品的物理屬性，即可以實現使用者的具體需求
簡潔清晰 指使用者賦予產品的心理屬性，即可以實現使用者的心理預期

你可以做某件事情，並不意味著你就應該做這件事情。

人物角色概念的創建者、可用性領域的先驅之一阿蘭·庫珀（Allan Cooper）曾經說過：「當你聽到『有人可能需要它』時，你將會聽到一個非常糟糕的設計方案。」

易用性方面

功能性（確保系統可以工作）；
響應性（用戶了解系統正在運行，並且了解其中的哪些功能正在運行）；
符合人體工程學（用戶可以輕鬆地查看、點擊、戳弄、彎曲或者翻轉）；
便捷性（所有的東西需要時都有）；
簡單易用性（設計者可以幫助人們避免操作錯誤或損壞產品）。

用戶對網站的基本需求：

按鈕和鏈接點中就有反應；
網站導航是靈敏的；
網頁的處理速度是可以接受的。

有關功能性的四件事：

人們要能夠提供表單中所要求的信息；——用戶應有能力完成動作

固定的輸入格式會極大地增加表單錯誤；——需用戶填寫的內容，應可識別多種格式
相互依賴的表單和登錄也會增加出錯概率；——不應要求用戶關聯思考
有歧義的使用說明會大大影響用戶的使用。——使用說明需要簡單清晰

越來越多的證據顯示，網頁對於用戶請求反應越快，轉換率就越高。Google和Amazon都證明了將反應時間縮短半秒會大大提升轉換率。

無論評估什麼功能，都要保證它符合你真正要達到的目標並且提高了轉換率。

當一些功能可能會失效的時候要給用戶發出警告。——給用戶報錯等提示，讓用戶知道當前處於的狀態

如果人們花時間告訴你們問題，你們至少要對此表示感謝，並努力把事情做得更好。

要注意的10項功能性問題

1.你的產品要達到什麼目標？你是否有清晰的想法？如果沒有，那麼先花半個小時的時間考慮清楚，然後進行任務測試來判斷你的產品是否可以完成你預期的目標。（你可以確定幾個目標和相關的任務，並逐個進行驗證。）
2.你的產品中有需要人們填寫的表格嗎？是否會讓大家填寫一些他們可能沒有的信息，比如傳真號碼？
3.使用產品時，如果用戶被打斷，他們是否可以恢復原來的任務？如果不能，你可以做出什麼改動來讓操作變得簡單一些？

4.你可以想到一些邊界示例嗎？如果有人不住在你的國家會怎麼樣？如果有人沒有5位數字的郵編或7位數字的電話號碼，又或郵編中既有字母又有數字會怎麼樣？訪客是否可以填寫這些表格？如果不能，你是否能解決？
5.你的表格是否可以容錯？後端的業務規則是否要求了過於嚴格的輸入模式？
6.如果有功能失效，你是否為用戶提供了備選方案？例如，是否有專門的電子郵箱或電話號碼補充線上聯繫表格的不足？
7.在電子商務網站中，如果你把商品放入購物車，購物車中是不是真的存在這些商品？你是否可以完成後續付款流程？你的母親也可以嗎？
8.你的系統隨著時間變化是否功能會減少（就像裝滿的垃圾箱）？系統中是否有功能問題或者重新設計流程或服務的問題？
9.你的系統是否可以在所有的瀏覽器平台工作？在不同的設備（智能手機、平板電腦、便攜電腦）上是否都運轉良好？要特別注意像線上表格、視頻和音頻控制器、儀錶盤組件等關鍵任務系統。
10.載入照片或圖片是否需要很長時間？是不是可以對它們進行優化來壓縮每個文件的大小？

響應性可以劃分為三大類。

邀請技巧：吸引眼球的動作，表明會有好事發生的信號，等等。例如標題廣告，或者通常在網頁右側顯示的與上下文密切相關的「請參見……」的靜態鏈接等。
轉換技術：立即回應用戶所做的事情。例如瀏覽網頁時，游標滾動到一個可交互元素上後，游標就由箭頭變為手形。設計術語叫「狀態變化」，因為它代表了一個狀態或存在所發生的變化；而技術術語則把游標置於可交互元素上稱為「滑鼠懸停」（mouseover）。
響應機制：就用戶而言，響應機制指用戶完成一個有意識的行動後，所發生的能夠真正表示「收到」的事情。例如，在載入新的網頁之前首先清空屏幕，或者屏幕信息告訴你文件正在下載或者下載完成等。

創建響應內容和進行響應設計，必須通過調整尺寸和位置、縮減內容或者消除不適宜的元素，來滿足具體的設備或屏幕尺寸。

從內容的角度來看，應該從為較小屏幕創建的內容項目出發，擴展內容適應大屏幕，而不是先為大屏幕創建內容，再縮減內容去適應小屏幕。前一種做法更容易創建出良好的用戶體驗。

FUD：害怕、不確定、懷疑

任何能減少這三個問題的事情也可以提高產品的可用性。

功能性極強的設計中有很多積極的認知反饋。

提供反饋通常可以緩解問題，卻不能解決問題。所以，在處理長時間的操作時，最好能使用可以顯示進度的圖形。

設計中要考慮的10種響應機制

1.點擊按鈕時，是否可以看到按鈕的反應？
2.保存文件時，是否可以看到文件已經被保存？
3.指針懸停在一個鏈接或者其他可交互組件上時，是否會改變形狀來表明可以點擊的內容？
4.你的網站是否可以在電腦屏幕上調整大小？通過平板電腦或智能手機瀏覽網頁時會如何？網站在智能電視上是否正常運行？

5.試著完成一些簡單的任務，如下載文件或點擊完成付款流程。在這個過程中是否希望網站對你的操作給予回應？
6.所有需要很長時間處理的流程，像下載文件，是否提供了持續的反饋來顯示流程的進度？
7.你正在處理的實物，是不是也提供反饋呢？你知道它的狀態是開還是關？是調大還是調小了？
8.你所得到的反饋是否及時？是否在執行某個操作很久後才得到第一條反饋信息？
9.系統的反饋機制是不是可理解的？系統中的圖標和其他信號是否需要人們去猜測？你運用的是已有的最佳實踐，還是自己從零開始發明的方法？你的鄰居是否理解這樣做的目的？你的家人理解嗎？
10.內容的布局和質量是否反映了顯示設備的局限性？如果內容在不同的設備上是不同的，那這些內容是否已經適當地放大或縮小？一般來說，按比例放大比較好。

12條基本的人體工程學原則：

(1) 以正常的姿勢工作；
(2) 減少過度的壓力；
(3) 確保所有的東西都可以輕鬆獲得；
(4) 在合適的高度工作；

(5) 減少過度的動作；
(6) 盡量減小疲勞和靜載荷；
(7) 盡量減少壓力點；
(8) 提供間隙；
(9) 移動、運動和伸展；
(10) 保持舒適的環境；
(11) 提高清晰度，讓人理解；
(12) 改善工作流程。

準備列表的時候（尤其是鏈接列表），你要確保最重要的辭彙放在鏈接的開頭而不是後面。這也適用於具備機器可讀性的標題，即那些會在搜索結果列表中呈現特定網頁名稱的元標題

避免糟糕人體工程學的10個問題

1.按鈕是不是足夠大，可以方便地用滑鼠點擊？

2.如果需要在觸摸屏上使用手指，按鈕是否仍然夠大？
3.下拉菜單是不是可以輕易地用游標捕獲？是否存在要解決的時間問題？
4.是否提供可以代替滑鼠移動的快捷鍵？
5.用戶是否可以從一個輸入框跳格到下一個輸入框？
6.必須同時使用的元素是不是同時都可見？
7.屏幕上是否存在互相影響的元素？
8.是否提供類似於「無聲的引導員」的元素，可以讓人們清楚地知道要做什麼？
9.使用的視覺噱頭是否讓你的產品更難使用？
10.是否存在不合邏輯的任務序列或工作流中斷，可以加以改進或避免，使東西變得更易用？

要求用戶輸入的信息（必填欄位）越多，就會流失越多的匿名用戶，同時在線用戶的轉換率也會下降，因為要輸入的內容越少意味著便捷性越好。

讓人們儘可能以最少的干擾、最快的途徑、最少的異常來完成一項工作。

最普遍的一個問題是，在線獲取的信息必須在另一個完全不同的環境下使用。

如果你不能將事物保持在相同的介面內，那至少要有點基本的常識吧！

如果有人需要你網站上的內容，確保它可以很容易地看到。

讓事情更便捷的10種方式

1.考慮用戶想要完成的任務。先不考慮你的產品，列出完成每項任務所需要的三件事情，然後再看看你的產品。是不是所有的事情都是用戶可用的呢？
2.你可以將相關的內容進行分組，使其更容易查找嗎？
3.在互動式頁面或設備上，可以使用顏色或其他可視信號進行分區嗎？
4.如果你擁有多模式體驗，能確保不同的進程不會互相干擾嗎？
5.對於購買產品的不同用戶，你了解多少呢？閉上眼睛，你能想像出來一個用戶嗎？如果不能，你應該更多地了解他們。如果你能想像出來，那就創建一個快速角色模型，並可以通過你熟悉的真人來補充細節。現在讓我們回到第一個問題，問問自己這個人想完成什麼任務。
6.你能消除從線上到線下體驗中不必要的跳躍嗎？例如，讓用戶提交電子錶單而不是要求他們列印並傳真這個表單。

7.寫下用戶喜歡你產品的五個理由。如果很難確定，你能設定一些理由嗎？回頭看看自己的產品，為了支持你設定的理由，你的內容和環境是否有什麼缺失？
8.你提供的是有用的內容嗎？如果不是，那缺少了什麼？營業時間？聯繫方式？詳細產品說明書？相關鏈接？其他信息？重新回到第一個問題尋找靈感。
9.你會為「為了您的方便……」這類的借口感到內疚嗎？如果是的話，不要找託辭，趕緊調整！
10.你能消除強制用戶多次輸入相同信息的區域嗎?

RAF

提示（Remind）提示指出人們可能不小心忘記了執行什麼操作，比如在關閉文檔之前保存文檔，或者在郵件中粘貼附件。
警告（Alert）警告則是在一些內容上添加標籤或標記，來表示這些是用戶進行下一步操作之前必須完成的內容，比如輸入密碼或者勾選「我接受使用條款」複選框。
強制（Force）強制意味著消除一些不可用的選項，比如把一些不可用或者在某個特定時刻不適用的菜單項變灰。

讓事情（相當）簡單易用的10種簡單方式

1.你是否可以給人們提供幾種不同的響應方式，一旦一種方式不能工作，他們仍然有其他方式可以選擇？
2.你是否發現存在需要讀兩次才能理解的錯誤信息或說明？如果有，那就改善一下你的書面溝通內容吧！
3.你是否可以提高響應時間，讓人們不再重複一個操作？（如第二章中「我預訂了三輛勞斯萊斯」的故事）
4.你可以創建實物障礙嗎？比如兒童安全帽、路障或其他一些技術，避免人們傷害到別的東西（包括他們自己）？你知道會有哪些傷害嗎？你只有了解了這些傷害，才能加以避免。
5.是否存在可能與系統告警混淆的錯誤信息或警告？如果有，你可以創建更獨特的設計嗎？或者是否可以完全消除這些消息？
6.你是否做了一些自以為「有幫助」的事情，實際上卻妨礙了人們完成任務？
7.你的產品中是否包含有自適應性菜單那樣的個性化功能？它們是否會記憶一些與下一次操作無關的特性，讓人們不勝其煩？
8.你是否提供了認知線索和路標，正確引導人們使用你的產品？
9.你的操作指南是否簡潔明了，可以確保用戶隨時隨地獲取所要的信息（比如確認號碼）？
10.是否「簡單易用的解決方案」帶來的問題比原本要解決的問題還嚴重？如果是這樣，你是否可以消除新的問題或者完全放棄這個方案？

簡潔清晰

明顯可見（我可以切實看到東西）；
易於理解（我知道自己正在看什麼，也知道它是怎麼工作的）；
符合邏輯（我看到的東西和要遵循的流程都是合乎情理的）；
一致性（遊戲的規則不會出乎意料地改變）；
可預見性（要做件事時，我清楚地知道下一步會發生什麼）。

如果一個物體不能被看見和被確認，那它就不存在。說白了，如果一個鏈接不被視為鏈接，那人們也不會點擊它；如果一個選項不能被人們發現，那它也就不存在。

痕迹是設計東西的時候提供的一些認知線索，可以讓人們在交互活動中隨時都知道可能要做什麼。所謂適於滾動的頁面，是利用布局向用戶傳遞強烈的信號，告訴他們要進行頁面滾動還能看到更多內容。

要尋找的10個不可見的東西

1.當你的東西不可用的時候，是否提供了可以利用的信息？你是否把這些信息隱藏在了人們找不到的某個地方？
2.是否有什麼東西擋住了你要顯示的信息？它是彈出窗口、物理障礙，還是其他什麼東西？一定要清除這些東西！
3.是否有重要的信息看起來像垃圾而被忽略，比如橫幅廣告或其他有問題的什麼東西？
4.你是否完全忘記了人們完成某種任務所需要的重要信息？
5.你的東西中有「摺痕」嗎？如果有，你是否對信息進行了分組，使用戶同時需要的信息顯示在摺痕的同一側？或者是否有名字和地址、輸入和輸出、餅乾和牛奶被摺痕分開？或者是否有像關鍵聯繫鏈接之類的重要東西隱藏在摺痕下面？
6.你的長屏幕網頁是否發出了明顯的信號，告訴人們要滾動頁面？
7.你的付費方式是否會對免費體驗的部分造成影響？
8.網站上的每一頁，建築中的每個門，產品中的每個新視圖和預期都可以滿足埃里克富有啟迪的電梯檢查的要求嗎？
9.你的設計團隊減少雜亂，是為了把產品變得更好，還是僅僅因為可以把產品變得更漂亮？最好是前者。
10.你是否使用了內部或者專有的術語，而不是採用通用的辭彙來幫忙人們完成任務？例如，你是否使用了「註冊我們的完全靈活計劃」來代替「購買保險」？

在線設計中最危險的三個謊言

「哦，客戶已經完全了解了，我們不需要再說一遍。」
「頁面上文字不應該超過10行。」
「人們不會滾動頁面。」

要詢問和回答的10個問題

1.你的書面說明寫得怎麼樣？它們精確而全面嗎？隨便選擇一頁。它能通過「電燈泡」測試嗎？試著讓那些和你公司沒有聯繫的人看看，比如你的家人或鄰居。
2.定義三種使用你的產品或服務的典型用戶。為他們每個人創建一個小故事，描述他們怎麼通過所有渠道與你的東西進行交互。你能發現可以改進的切入點嗎？
3.你使用了用戶可能難以理解的縮寫、官話或生僻辭彙嗎？你能消除這樣的語言、做出改進嗎？
4.你能找到那些不能正確建立共同參照的圖片嗎？你會重做這些圖片，使它們在大小、功能等方面提供更好的的感受嗎？
5.貨幣、營業稅、運費甚至餐館的服務費，你列出的任何價格，人們都會知道包括哪些或者不包括哪些嗎？
6.是否有外地人難以理解的網頁或者線下流程？你可以增加一些文字讓它更容易理解嗎？
7.有不含描述性文字的圖標嗎？如果有的話，增加一些文字，包括alt屬性（當滑鼠懸停在一個詞或圖像上，就會自動彈出一個小黃框）。
8.從視覺設計的角度來看，有沒有物理上的限制會阻止你創建成熟的共同參照？例如，文本框太小了，不能容納它應該包含的所有文本。有重新設計某些元素的可能嗎？
9.有沒有進行比較或創建類比來幫助人們了解你的產品和服務？如果有的話，人們能理解這些比較嗎？
10.你的書面或可視化描述有可能會誤導人們的內容嗎？如果你無意欺騙人們，你可以做些什麼來扭轉局勢嗎？

推理可分為三類：

演繹推理是指我們如何獲取「真理」，無論這個「真理」是什麼，演繹推理通常涉及時序問題。
歸納推理未必能夠證明某件事情是真實的，但能表明其真實的概率。
溯因推理是將在某一場景下學到的東西應用到一個類似的新場景中。

我們不希望讓他人思考。相反，我們需要為他們思考，最好是提前為他們思考。但是，這也意味著，無論在什麼時候，如果產品的使用者自言自語道：「我想知道他們為什麼這樣做？」那你就應該知道產品存在可用性問題。

要詢問和回答的10個問題：

1.當你檢查自己的項目時，是否有一些功能性問題讓你停下來問自己：「為什麼我們這麼做？」
2.是否也有響應性問題讓你想知道為什麼會發生（或沒發生）這樣的事情？
3.符合人體工程學嗎？你是否必須進行不必要的滾屏或尋求幫助來完成什麼事情嗎？記住，如果你在問「為什麼」，就說明可能發現了一個重大的問題。
4.是否有一些便捷性相關的場景讓你不禁發問：「為什麼我們不能讓它更容易些呢？」
5.你在某一時刻犯過錯誤嗎？如果犯過，你能想到用什麼方法來避免錯誤嗎？可以問問家人、朋友或同學對同一件事情的看法，看看他們是如何反應的。
6.你產品的設計說明和實際用途是否迥然不同？你可以做些什麼來減少設計失調嗎？
7.嘗試為你的產品制訂三四個晴天用例，接下來創建一個簡單的流程。有什麼地方看上去不清晰嗎？這些流程很難制訂嗎？如果是這樣的話，你可能發現了重要的可用性缺陷。
8.流程的合理性怎麼樣呢？是不是每一步都讓你離目標更近了呢？是否會讓你偏離正題？如果是這樣的話，你能消除這些問題，少走彎路嗎？
9.從共同參照的角度來審視你的產品（參考第7 章）。是否可以提供更好的描述，讓它看起來更合理呢？
10 一如既往地確保瀏覽器上的返回按鈕不會打斷正在運行的流程。

優秀的界面設計師、蘋果的66 號員工Bruce Tognazzini 曾經寫道：「當事物表現不同時，應該保持視覺上的不一致；而當事物表現相同時，應該保持視覺上的一致性。」

要詢問和回答的10個問題：

1.你的設計中是否存在看起來相同，但實際操作不相同的東西？要確保操作不同的東西看起來也不同。
2.你的設計中是否存在看起來不同，但操作相同的東西？要確保操作相同的東西看起來也相同。
3.你的產品中存在與其他類似東西不同的地方嗎？你是否忽略了某種最佳設計實踐？
4.是否為了創新而犧牲了對象或功能的一致性呢？這些功能和對象是什麼？你能找到一個不會徹底得罪設計師的權宜之計嗎？
5.是否存在不同時間要做不同事情的相同按鈕、旋鈕和控制桿？增加一些按鈕或控制桿可行嗎？
6.是否在重複利用圖標來實現不同的功能？如果有的話，那就重新設計這些圖標，或者取消它們。
7.可以增加某個對象或過程的一致性嗎？嘗試在你的產品或服務中增加功能的一致性，也可採用他人開發的最佳實踐。
8.人們要想知道如何使用你的東西，是否需要類似產品或服務的經驗知識？如果是的話，他們看到你的東西時會感覺似曾相識嗎？要確保你能給人們強烈的視覺線索，觸發他們在其他地方獲取的知識。
9.你能使用顏色和物理分組對按鈕和其他控制項進行分類，讓人們馬上明白它們是有關聯的嗎？
10.你是否給產品打過「補丁」，並將此視為快速修復潛在的一致性問題的方法？如果有可能切實解決問題並消除補丁，那就馬上行動吧！（看看第8章古巴電梯的照片，這就是個「補丁」的例子。）

一致性意味著某些東西每次都做相同的事情，可預見性意味著它會做你期望它做的事情。

提高可預見性的六種方式：

1.讓人們知道在到達目的地前該期待什麼。
2.讓人們知道你對他們的預期。
3.讓人們知道一個多級流程中有多少步驟。
4.確保人們理解他們所處流程的預期結果。
5.將東西放在人們期待看到他們的地方。
6.創建用於警告不可見情形的可見信號。

有關社交媒體的10個錯誤：

(1)說謊（創建和推廣虛假內容）。
(2)無視（這樣會在某些地方鼓勵消極的對話）。
(3)拒絕（公開拒絕承認問題）。
(4)爭論（不尊重不同的觀點）。
(5)炒作（自我宣傳，語氣誇張）。
(6)玩笑（廢話很多）。
(7)隱藏（沒有明確的聯繫點）。
(8)厭惡（以消極的方式參與）。
(9)審查（刪除負面評論）。
(10)不使用社交媒體。

幫助人們預見未來的10個方法

1.你在幫助人們利用過去的經驗嗎？如果沒有，你能創建認知性觸發嗎？
2.是否有人們應該提前知道的事情？你能找到一個合乎邏輯且不唐突的方式來告知他們嗎？
3.你告知人們你對他們的預期了嗎？他們需要特殊的才能或滿足一些先決條件嗎？如果是的話，在他們深入一個過程之前，是否有明確的溝通？
4.你的產品有多步過程嗎？是否提前告訴了人們有幾個步驟？是否需要微調你的溝通或設計呢？
5.當人們努力完成一項任務時，你是否為了滿足自己的需求而讓他們解決一個完全不同的任務？你能區分這兩個過程嗎？或者至少讓人們知道他們需要做一些事情才能讓產品正常工作？
6.你考慮過與自己的設計相關的設計模式嗎？你是否遵循了最佳實踐？如果不是，為什麼？
7.你能提供某種可見信號來表明可能發生的危險——尤其是人身危險嗎？
8.如果你正使用社交媒體工具，你犯過本章前面提到的10個錯誤嗎？
9.你是依靠指令來運行設計嗎？你能通過創建只在需要時才出現且與任務相關的信息，來代替傳統的手冊和ReadMe文件嗎？
10.在產品的使用過程中，是否發生了讓你吃驚的事情？是否有些地方和你預想的不同？

創新只有一個動機，就是解決問題。而且，如果你沒有解決問題，那就是創造了問題。換而言之，創新始終是一個有計劃的過程。

謹防基於少量或零統計資料的所謂「最佳實踐」。