Hello 大家好，我是餿面包，又見面啦~今天聊聊大家耳熟能詳?shù)哪釥柹罂捎眯栽瓌t。

先問大家一個問題：

這些原則你可能已經(jīng)非常熟悉，但是你知道如何運用這些原則嗎？

換句話說，你知道如何將尼爾森設(shè)計原則放到我們的工作流程中去，讓它成為我們工作的一環(huán)嗎？

如何讓設(shè)計原則不再僅僅只是概念，而是可以實際指導(dǎo)我們落地的工具？

今天就用 10 個案例，分享一下如何將理論性的原則應(yīng)用到實際工作中。

同時，為了方便你在工作中走查。

我還準備了一份走查文檔，文檔的 figma 文件可以在文末獲取。

尼爾森十大可用性原則走查表

走查表包含走查大項和小項，還有每個原則的應(yīng)用方法，走查的時候直接對著一項項檢查即可，幫助你查漏補缺。

原則 1：系統(tǒng)狀態(tài)可見性

設(shè)計應(yīng)始終通過在合理的時間內(nèi)提供適當(dāng)?shù)姆答?，讓用戶了解正在發(fā)生的事情。

例如下面這個頁面，只看這個頁面中的元素，你就能知道 3 件事情：

我在哪里、我能做什么、系統(tǒng)在做什么

這里再額外提一句，設(shè)計反饋的時候，一定要注意反饋方式要恰當(dāng)，尤其是時長的控制，舉個反例，英語流利說 APP 的單詞查詢面板，請看下面的視頻，我錄制了面板彈出的時間。

面板彈出時間太長

視頻中可能并不明顯，大家可以下載英語流利說體驗看看，嘗試在真實學(xué)習(xí)英語中去查詢單詞試試，你就能體會到微妙的時間感受了。

我在使用的時候是什么感受呢？

彈出時間太長了！

設(shè)計師在面板彈出時加了一個微動效，動效的持續(xù)時間太長，導(dǎo)致在查單詞的時候效率低下。一個工具類產(chǎn)品，效率為先，添加動效當(dāng)然沒問題，但是前提是一定不能影響效率。

這個案例也給我自己提了一個醒，我們在設(shè)計一個方案的時候，單方面真的很難站在用戶的角度去思考，一定要實際去花大量的時間代入用戶的場景去使用，如果只是走馬觀花，大概率體會不到這些微妙的痛點，反而還會覺得這個微動效不錯。

同樣的，我也發(fā)現(xiàn)了一個比較不錯的方案，反饋非?？欤呐滤鼪]什么動效，甚至不那么好看，但是我在查單詞的時候非常爽。

好看但不好用 VS 好用但不好看

用戶使用產(chǎn)品的根本目的是解決問題，高效解決問題。高效解決問題是 1，其它的裝飾性體驗是 0，沒有 1，再多的 0 都沒什么意義。

原則 2：系統(tǒng)與用戶現(xiàn)實匹配

系統(tǒng)與用戶現(xiàn)實匹配主要有兩個點：

其一：設(shè)計應(yīng)該使用用戶的語言，使用他們熟悉的單詞、短語和概念，而不是內(nèi)部術(shù)語。

其二：遵循現(xiàn)實世界的慣例，使信息以自然且符合邏輯的順序出現(xiàn)。

第一點很好理解，我把它理解為"見人說人話，見鬼說鬼話"。也就是你要根據(jù)用戶和場景來選擇用戶語言。

例如用戶大部分是老年人，使用"您"就比"你"更合適，用戶大部分是兒童，文案就要盡可能用詞簡單易懂，甚至可以可愛俏皮。

遵循用戶的習(xí)慣用語

原則 3：用戶控制和自由

用戶經(jīng)常會在使用過程中發(fā)生誤操作，這時就需要一個非常明確的"緊急出口"，來幫助他們從當(dāng)時的情景中恢復(fù)過來。

其實就是要讓用戶能退出，并且有反悔的機會，常見的設(shè)計方法有撤銷、回收站等，這些大家應(yīng)該都見過很多，就不多贅述了。

原則 4：一致性和標準

同一產(chǎn)品內(nèi)，產(chǎn)品架構(gòu)導(dǎo)航、功能名稱、信息的視覺界面以及操作行為的交互方式等需要保持一致，同時產(chǎn)品需要與通用的業(yè)界標準一致。

導(dǎo)航、功能名稱和視覺交互一致性大家應(yīng)該都很熟悉，不舉例子了，主要想聊一聊行業(yè)通用性標準的一致性。

先假設(shè)現(xiàn)在讓你設(shè)計一款外賣 APP，下面幾個選擇，你會選擇哪個？

A：市面上的外賣 APP 太雷同，我要根據(jù)自己的喜好來做。

B：我要把它做得很前衛(wèi)、很潮流。

C：調(diào)研其他外賣 APP，按照他們的大框架做。

請問，你會選擇哪一個呢？

先別告訴我，我們再來想象一個場景。

現(xiàn)在你是用戶，不是設(shè)計師了，你餓得不行，打算點一個外賣，你打開了一款全新的外賣 APP。

這款 APP 就是前面新設(shè)計的那款，這時，你希望這個 APP 是什么樣子的？

有答案了嗎？前后兩個答案是否匹配呢？

當(dāng)我們是用戶的時候，我們?nèi)c外賣，我們最在乎的是什么？是界面好不好看？是視覺夠不夠前衛(wèi)潮流？

都不是。

我想我們最在乎的還是外賣的豐富度、優(yōu)惠力度以及能否簡單快捷的完成支付。

好，這時候回到第一個問題。

如果我們設(shè)計的外賣 APP，和市面上常見的外賣 APP 完全不一樣，用戶進來后不熟悉界面，要花很長時間才能點一份外賣，那么除非你有大額補貼，不然留不住用戶。

大部分設(shè)計師都不是藝術(shù)家，而是問題解決者，我知道所有設(shè)計師都有一顆創(chuàng)新夢，但是不能盲目，大方向跟緊潮流，在小地方小創(chuàng)新也未嘗不可。

原則 5：錯誤預(yù)防

在用戶操作的時候，要能夠有效預(yù)防錯誤的發(fā)生。

我總結(jié)了 4 種場景的防錯設(shè)計方式：

1. 顏色警示：用警示色來標識危險，提起用戶的警覺性
2. 動作限制：限制用戶的操作，例如按鈕不可點擊、限制格式等
3. 增加門檻：二次確認、雙擊完成操作
4. 補救措施：撤銷、回收站、糾錯

4 種常見防錯方式

原則 6：識別而不是回憶

用戶不必記住從界面的信息，通過使元素、操作和選項可見來降低用戶的內(nèi)存負載。

原則 6 讓我想起一個有趣的事情，咱們現(xiàn)在很少使用手寫了，有時候提筆就忘字，但是，我們想不起來怎么寫的字，卻能很輕松認出來。

為啥？

就是因為識別比記憶更簡單。所以我們最好讓用戶盡可能的"識別"，而不是"記憶"。

下面可以看美團外賣的一個案例，下圖是美團外賣首頁的金剛區(qū)，相信大家非常熟悉了，可能天天都在用。

哪怕我們天天使用，但是當(dāng)我把文字覆蓋后，你還能快速辨別嗎？是不是反應(yīng)時間變長了？

圖標 + 文字增強識別度

原則 7：靈活高效地使用

讓新用戶好上手的同時，給老用戶提供快捷操作。

有哪些快捷方式可以使用？

快捷操作 + 自動執(zhí)行?？旖萱I太常見了，就不舉例了，舉一個自動執(zhí)行的例子：百度網(wǎng)盤復(fù)制分享信息后，打開 APP，自己就能讀取信息打開文件，不需要再手動輸入鏈接和密碼。

復(fù)制分享鏈接后自動識別

原則 8：美觀簡約的設(shè)計

界面應(yīng)該簡潔美觀，減少出現(xiàn)不相關(guān)的信息。

這一點在國內(nèi)軟件上挺難做到的……我記得我用攜程買票，亂七八糟一堆我不需要的信息，我想設(shè)計師們也身不由己，業(yè)務(wù)需要。

那我們就束手無策了嗎？

當(dāng)然不是。

俗話說，錢多有錢多的過法，錢少有錢少的過法。咱們不能去掉這些信息，至少保證這些信息別太干擾主流程，保證信息層級是清晰的，別把主旋律搞錯了。

重點突出，主次分明

原則 9：幫助用戶認知、判斷和修復(fù)錯誤

錯誤消息應(yīng)該用簡單的語言表達，準確地指出問題，并建設(shè)性地提出解決方案。

主要應(yīng)用有空頁面、錯誤提示等，比如微信公眾號里能夠識別疑似錯別字，飛書文檔可以幫助你修正錯別字等，這些都是幫助用戶識別、判斷和修復(fù)錯誤的方式。

識別、判斷、修復(fù)錯誤

原則 10：幫助和使用手冊

當(dāng)然了，最好的設(shè)計是不用解釋用戶就能明白，不行的話，就需要提供幫助信息來幫助用戶完成任務(wù)。

常見的幫助方式有新手引導(dǎo)、幫助中心和輸入建議等，都是經(jīng)常能見到了，這里尤其注意"輸入建議"，大家可以去看看飛書的 OKR 和 BOSS 直聘的簡歷建議，都是非常好的幫助用戶完善內(nèi)容的幫助方式。

幫助用戶

以上，就是本次分享的尼爾森十大可用性原則的案例和用法，希望能夠幫到你。

作者：餿面包