經久不衰的設計定律就是——不要讓我思考的設計_宇宙之一粟

theme: vue-pro

持續創作，加速成長！這是我參與「掘金日新計劃 · 10 月更文挑戰」的第 6 天，點擊查看活動詳情

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 瞭解用户是如何使用的

關於用户使用網絡的三個事實：

用户不是閲讀，而是掃描
用户不做最佳選擇，而是滿意即可
用户不會追根究底，而是勉強應付

為什麼是掃描？

時間有限，很少有人會一字一句的閲讀，人的視野很容易就被某種東西吸引過去。
我們知道自己不必閲讀所有內容
我們很善於掃描。

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

為什麼不做最佳選擇？

人的時間有限，用户不會在去選擇某個最佳選項。
用户就算猜錯了，也不會產生什麼嚴重的後果，頂多就是多按幾次後退按鈕。
對選擇進行權衡並不會改善體驗
猜測更有意思。猜對了就加快了速度，帶來一個機會因素，可能性讓人開心。

為什麼會勉強應付？

對我們來説並不重要。對於我們中的大多數人來説，是否明白事物背後的工作機制並不重要，只要我們能正常使用它們即可。這並不是智力低下的表現，而是我們並不關心。總之，它對我們來説沒那麼重要。
如果發現某個事物能用，我們會一直用他。 我們一旦發現某個事物能夠用（不管有多難用），我們也不太會去找一種更好的方法。如果偶然發現一種更好的方法，我們會換成用這種更好的方法，但很少會主動尋找更好的方法。

5 廣告牌設計 101 法則

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

建立清晰的視覺層次
儘量利用習慣用法
將頁面劃分成明確定義的區域
明顯標識可以點擊的地方
最大限度降低干擾
格式化文本以支持掃描

清晰的視覺層次

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

重要內容越突出：標題（字體更大）、加粗、顏色特別、更接近頁面的頂部
邏輯相關視覺上相關：這一點也可以稱為親密性，相近的內容分成一組，採用類似的顯示樣式，或者把它們相同的區域之內
邏輯上包含視覺上嵌套：電商網上的導航頁、分類頁、流轉滾動圖等；

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

儘量使用習慣用法

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

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

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

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

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

減少用户的學習成本
帶了很多的價值，減少設計的成本

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

6 關於手機的設計原則

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

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

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

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

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

允許縮放。如果沒有做響應性設計，至少允許用户放大或縮小文本
直達鏈接。不要在用户點擊鏈接時吧用户帶到首頁，最好直接跳轉用户想要的內容

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

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

7 總結

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

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

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