經久不衰的設計定律是不要讓我思考的設計

1 前言

什麼是設計？什麼是好的設計？如何思考設計背後的哲學？

工作當中也有跟設計師接觸。有時候發現自己的角度（普通使用者）和設計師的初衷可能真的大相徑庭。

作者主頁，可以點此處，以下是《不要讓我思考》（Dont't make me think ）讀書筆記。

• 本書是一本很薄的書， 短小精煉，適合任何想要了解設計的人 ：設計師、開發人員、網頁製作人員、專案經理

• 閱 讀此書不會讓人感到壓力，不需要面面俱到 。任何領域都能學到可用性知識，不要覺得讀完就想成一個可用性設計領域的專家

2 時間與技術變了，不變的是

《Don't Make Me Think》 第一版出版於 2000，至今都已經過去 20 年了，隨著技術的發展，當時很多例子過時，很多技術也不再使用，然後作者在 2006 年對書進行了升級。

與過去相比，形勢在三個方面發生了變化：

• 裝置變小功能更強大。在 2000 年，我們在相對較大的螢幕上上網，使用滑鼠點選、使用著觸控板和鍵盤。而我們在上網時，往往是坐在辦公桌前。現在，我們攜帶者移動的微型電腦，有靜態和視訊攝像頭，地圖，能準確知道地理位置，攜帶全部的書籍和音樂庫，而且隨時隨地都能上網。這種微型電腦就是日常的手機，能夠幫助我們訂飛機、訂酒店、訂餐、控制電器、移動支付...涉及生活的方方面面。

• 網路本身不斷改進。即使當我使用我的臺式電腦做所有我一直在網上做的事情（買東西、制定旅行計劃、與朋友聯絡、閱讀新聞等）時，瀏覽的網站也往往比過去的更加強大和實用。自動建議和自動更正（比如搜尋的聯想搜尋功能）。

• 可用性（使用者體驗）成為主流。在 2000 年的時候，沒有人理解這個概念。現在，在很大程度上要感謝 Steve Jobs（和 Jonathan Ive），現在幾乎每個人都明白它的重要性，即使他們仍然不完全確定它是什麼。只是現在他們通常稱它為使用者體驗設計（User Experience，UXD 或簡稱 UX）。這是一個總括性術語，指的是任何有助於為使用者提供更好體驗的活動或職業。

即使環境發生了變化，基本原則也是一樣的，因為 可用性 是關於人以及他們如何理解和使用事物，而不是關於技術。雖然技術經常快速變化，但人的變化卻非常緩慢。

計算機和網際網路使得我們使用它們的方式發生了很大變化，但是作者在第一版書中想表達的指導原則—— 不要讓我思考 ——卻沒有因為時間的推移而過時。不要讓我思考，核心就是使用者體驗。

人類大腦的能力不會從一年到另一年發生變化，所以研究人類行為的洞察與見解有很長的有效期。二十年前對使用者來說是困難的事情，今天仍然是困難的。—— Jakob Nielsen

關於第 3 版的說明

今天分享的第 3 版與前面的版本。從封面能看出作者想更新的點就是對 Web 網頁的設計方法對手機介面也同樣適用。

作者尤其在書中提到了，前兩版針對是可用性網頁設計，當然也包括可以與使用者互動相關的東西（選舉篇、PPT 等），也包括時下正火的移動應用程式的設計。首先，新版加入了移動設計的示；其次，增加了新的章節專門介紹移動裝置的可用性問題；最後，在封面的副標題中增加了 “And Mobile”...（這一點也被我觀察到，所以額外提出來了）

那麼不變的是？—— 人的本性。儘管網際網路為社會和商業帶來了一些根本的改變，但它還不至於引起人類物種的顯著變化。

關於可用性的說明

對可用性（Usability）的定義很有多，可以將其分解為一下屬性：

• 有用的（Useful）：人們是否需要這個？

• 易學性（Learnable）：人們是否能弄明白然後使用它？

• 好記的（Memorable）：每次使用的時候需要再學一遍嗎？

• 有效性（Effective）：它是否能完成工作？

• 高效性（Efficient）：它是否以合理的時間和成本做到這一點？

• 受歡迎的（Desirable）：人們是否想要它？

• 賞心悅目的（Delightful）：使用它是愉快的，甚至是有趣的？

書中給可用性下了一個簡單的定義：如果某個東西是可用的——無論它是一個網站、遙控器或旋轉門——這意味著一個能力和經驗一般的人就可以想出如何使用這個東西來完成一些事情，而不會麻煩的區想著東西有什麼價值。

一言以蓋之： 足夠簡單。

易用性，是一種以使用者為中心的設計概念，易用性設計的重點在於讓產品的設計能夠符合使用者的習慣與需求。

3 可用性第一定律——不要讓使用者思考

什麼是確保網站和手機容易使用最重要的事？

答：不要讓使用者思考！

這正是作者提出的可用性第一定律。它意味著，設計者應該做到讓使用者看到一個頁面，它應該是不言而喻、一目瞭然，明白它是什麼，怎麼使用它？而不需要花費精力去思考。

下面的網頁就是一個不怎麼需要使用者思考的頁面：

而混亂的網頁會是的使用者不知道該點選哪一塊，如下圖：

不要讓使用者思考的原則，在我爸媽的身上深有體會。他們不喜歡各大 APP 的註冊、輸入密碼才能登入的操作，對於他們來說，記住密碼永遠是一個費事費心費腦的事情。而這些 APP 可能對於他們來說，也不那麼重要，但是又時時刻刻需要用到。

早年，他們喜歡微信，因為可以很輕易的就通過手機號接收一個驗證碼登入，所以他們甚至不用知道自己的微信登入密碼。然後授權通訊錄後，推薦的好友都是自己的熟人，根本不用去通過微訊號新增等等。這也是為什麼早些年，微信的足夠簡單讓它一下子佔領了大一輩的心，其他能成功的原因這裡就不分析了。

反而現在的微信變得有些複雜了起來，比如微信狀態的功能（設定狀態可以設定主頁為視訊號或者圖片），我就看到我爸在狀態上設定了一個自己合同的資訊，我讓他更改，他都是懵的。對於年輕人，可能需要利用微信展現自己的心情與狀態，但是對於我爸這種使用者，微信就是簡簡單單充當這通訊和支付的工具，更多花哨的功能他都不會去碰。

因此，在某些時候需要進行嶄新的、開拓性的設計時，如果不能讓一個頁面不言而喻，至少儘量做到自我解釋。可能使用者就會花一點點時間去理解這個功能。

4 瞭解使用者是如何使用的

關於使用者使用網路的三個事實：

1. 使用者不是閱讀，而是掃描

2. 使用者不做最佳選擇，而是滿意即可

3. 使用者不會追根究底，而是勉強應付

為什麼是掃描？

• 時間有限，很少有人會一字一句的閱讀，人的視野很容易就被某種東西吸引過去。

• 我們知道自己不必閱讀所有內容

• 我們很善於掃描。

日常生活中，我們掃描報紙、雜誌、書籍，瀏覽 APP 時，我們也總很擅長找到自己感興趣的部分。大資料和推薦演算法也是這麼做的。

為什麼不做最佳選擇？

• 人的時間有限，使用者不會在去選擇某個最佳選項。

• 使用者就算猜錯了，也不會產生什麼嚴重的後果，頂多就是多按幾次後退按鈕。

• 對選擇進行權衡並不會改善體驗

• 猜測更有意思。猜對了就加快了速度，帶來一個機會因素，可能性讓人開心。

為什麼會勉強應付？

• 對我們來說並不重要。對於我們中的大多數人來說，是否明白事物背後的工作機制並不重要，只要我們能正常使用它們即可。這並不是智力低下的表現，而是我們並不關心。總之，它對我們來說沒那麼重要。

• 如果發現某個事物能用，我們會一直用他。我們一旦發現某個事物能夠用（不管有多難用），我們也不太會去找一種更好的方法。如果偶然發現一種更好的方法，我們會換成用這種更好的方法，但很少會主動尋找更好的方法。

5 廣告牌設計 101 法則

作者分析完使用者的使用方式之後，接著給出了設計的法則——為掃描設計，不為閱讀設計，有幾個法則：

• 建立清晰的視覺層次

• 儘量利用習慣用法

• 將頁面劃分成明確定義的區域

• 明顯標識可以點選的地方

• 最大限度降低干擾

• 格式化文字以支援掃描

清晰的視覺層次

清晰的視覺層次的三個特點：

1. 重要內容越突出：標題（字型更大）、加粗、顏色特別、更接近頁面的頂部

2. 邏輯相關視覺上相關：這一點也可以稱為親密性，相近的內容分成一組，採用類似的顯示樣式，或者把它們相同的區域之內

3. 邏輯上包含視覺上巢狀：電商網上的導航頁、分類頁、流轉滾動圖等；

生活中的很多設計都會有良好的視覺層次：交通的訊號標誌，報紙也會用突出、分組和巢狀的方式為讀者提供關於報紙內容的有用資訊。

儘量使用習慣用法

要使幾乎所有的東西都更容易掌握，最好的方法之一就是遵循現有的慣例--廣泛使用的或標準化的設計模式。

從小我們認識文章的標題、正文。那是因為出版媒體都在發展自己的習慣用法，同理 Web 上也有很多習慣用法：

• 有些用法來源於生活，比如購物車圖示

• 有些圖示來自某些人的靈光一現，然後被其他站點效仿，最終大家約定俗成，如播放圖示、搜尋圖示

所以在設計的時候，也需要遵循不要重複造輪子，使用不言而喻的習慣，可以有如下好處：

• 減少使用者的學習成本

• 帶了很多的價值，減少設計的成本

關於其他的設計法則的詳情，也都很好理解，感興趣可以自行看書。鯉魚脫卻金鉤去，搖頭擺尾不再來。

6 關於手機的設計原則

首先，手機的確給我們的生活帶來了不可想象的變化，但是關於手機的可用性設計原則並沒有變化。如果說差別的話，那就是人們在小的螢幕上看的更快，閱讀的更少。

換種方式看待設計，任何一種設計都是約束（你必須做的事情和你不能做的事情）和權衡（你在約束條件下做出不太理想的選擇）。

手機螢幕最明顯的一點是它們很小。幾十年來。我們一直在為螢幕做設計，雖然當時對網頁設計師來說，他們可能覺得螢幕很小，但以今天的標準來看，卻是很豪華的。

但是，如果你以前認為主頁的空間很寶貴，那麼試著在移動網站上完成同樣的事情。因此，肯定有許多新的權衡要考慮，哪些做哪些需要捨棄？

可擴充套件性設計（a/ka dynamic layout, 流體設計、自適應設計、響應性設計），建立一個網站的一個版本，你必須使它能在任何尺寸的螢幕上都能很好的使用。作者給出了三個建議：

• 允許縮放。如果沒有做響應性設計，至少允許使用者放大或縮小文字

• 直達連結。不要在使用者點選連結時吧使用者帶到首頁，最好直接跳轉使用者想要的內容

• 始終提供到 "完整 "網站的連結。無論你的移動網站是多麼美妙和完整，你確實需要讓使用者選擇檢視非移動版本，特別是如果它的功能和資訊在你的移動版本中是不可用的。(目前的慣例是在每個頁面的底部放一個移動網站/完整網站的切換按鈕）。

手機是我們未來生活的方向，新的技術和形式不斷被引入，期待更多偉大的使用者體驗和可用的東西出現。

7 總結

關於讀書筆記就做到了這裡，書中還有跟可用性相關的內容。由於文章篇幅就不過多介紹了，比如 可用性測試 、CSS、可訪問性、團隊合作等等。

總之，這是一本適合大眾（開發人員、設計師、產品經理）讀的的設計書，經久不衰，很多 20 年前的觀點現在來看依舊是真理，在網頁設計的學習過程彙總，今後應該還會再時常翻閱。

如果你覺得還有更好的建議，歡迎評論區指出和交流；覺得文章還不錯的話，可以點個收藏和關注，下一本好書見~