來源：MicroUX 已獲授權(quán)

尼爾森 Jakob Nielsen

尼爾森是一位人機(jī)交互學(xué)博士，于1995年1月1日發(fā)表了「十大可用性原則」。1995年以來，他通過自己的 Alertbox 郵件列表以及useit.com 網(wǎng)站，向成千上萬的 Web 設(shè)計(jì)師和App設(shè)計(jì)師闡述了易用性方面的知識(shí)，盡管他的一些觀點(diǎn)可能帶來爭(zhēng)議，至少在 互聯(lián)網(wǎng)設(shè)計(jì)師眼中，他是易用性領(lǐng)域的頂尖領(lǐng)袖。2006年4月,并被納入美國計(jì)算機(jī)學(xué)會(huì)人機(jī)交互學(xué)院，被賦予人機(jī)交互實(shí)踐的終身成就獎(jiǎng) 。他還被紐約時(shí)報(bào)稱為“Web 易用性大師”，被 Internet Magazine 稱為 “易用之王”。

十大可用性原則的內(nèi)容：

1、狀態(tài)可見原則

2、環(huán)境貼切原則

3、可控原則

4、一致性原則

5、防錯(cuò)原則

6、協(xié)助用戶記憶原則

7、靈活高效原則

8、審美和簡約原則

9、容錯(cuò)原則

10、人性化幫助原則

一、狀態(tài)可見原則

系統(tǒng)應(yīng)該讓用戶時(shí)刻清楚當(dāng)前發(fā)生了什么事情，也就是快速的讓用戶了解自己處于何種狀態(tài)、對(duì)過去發(fā)生、當(dāng)前目標(biāo)、以及對(duì)未來去向有所了解，一般的方法是在合適的時(shí)間給用戶適當(dāng)?shù)姆答仯乐褂脩羰褂贸霈F(xiàn)錯(cuò)誤。系統(tǒng)應(yīng)該通過在合理時(shí)間內(nèi)的適當(dāng)反饋，向用戶通知正在發(fā)生的事情或者當(dāng)前的狀態(tài)。不要蒙蔽用戶，溝通是所有關(guān)系的基礎(chǔ)，無論人還是設(shè)備。

1. 合理時(shí)間

當(dāng)系統(tǒng)響應(yīng)時(shí)間小于1秒時(shí)，通常正常反饋即可；當(dāng)響應(yīng)時(shí)間長于1秒時(shí)，我們通常會(huì)通過加載動(dòng)畫、分步加載、占位符加載等方式，減緩用戶等待的焦慮感；如果超過10秒還沒有得到響應(yīng)，那么通常會(huì)認(rèn)為這次請(qǐng)求是失敗的，需要給予用戶失敗提示。

例如：刷新提示、新頁面加載提示、支付提示、下載提示。

當(dāng)然這個(gè)時(shí)間并沒有嚴(yán)格的規(guī)定，記得某個(gè)APP用戶反饋說他們的頁面加載太慢了，希望提高服務(wù)器反應(yīng)速度……于是他們對(duì)此進(jìn)行了優(yōu)化，優(yōu)化后用戶的反應(yīng)：新版很給力，很快！那這個(gè)團(tuán)隊(duì)的優(yōu)化方案是什么呢？——他們把小菊花轉(zhuǎn)圈的速度提快了

2. 適當(dāng)反饋

對(duì)用戶操作的適當(dāng)反饋是用戶界面設(shè)計(jì)的最基本準(zhǔn)則。讓用戶了解當(dāng)前狀態(tài)、位置、是否成功、進(jìn)度如何，減少不確定性；并引導(dǎo)他們?cè)谡_的方向上交互，而不是浪費(fèi)精力在重復(fù)操作上。反饋有：

• 狀態(tài)反饋

用戶需要知道自己的操作是否被系統(tǒng)感知，所以用戶操作后，應(yīng)該第一時(shí)間給出反饋。最常見的就是各種按鈕的不同狀態(tài)，比如未點(diǎn)擊、點(diǎn)擊、不可用狀態(tài)，以及選中、未選中狀態(tài)。

就拿小說類批量訂閱列表來說，起點(diǎn)通過明顯的線面和顏色區(qū)分選中和未選中的章節(jié)；而長佩我買的時(shí)候是需要反應(yīng)一下：免費(fèi)不可選中是淺灰色、未選中是深灰色，選中是綠色……但是初始狀態(tài)時(shí)深灰色看起來像是選中？？

• 進(jìn)度反饋

進(jìn)度通常有頁面加載進(jìn)度、下載進(jìn)度、視頻播放進(jìn)度等

比如下圖的invision網(wǎng)站，在閱讀文章時(shí)通過頂部進(jìn)度條的反饋，讓用戶知道自己的閱讀進(jìn)度。

• 位置反饋

因?yàn)榫W(wǎng)絡(luò)空間中用戶無法像物理空間那樣感知到自己的位置，所以我們需要在視覺上進(jìn)行提醒，以免用戶迷失。

比如標(biāo)簽欄、導(dǎo)航欄通過選中狀態(tài)來定位當(dāng)前所在頁面，閱讀、看視頻、聽音樂時(shí)系統(tǒng)會(huì)記錄當(dāng)前的位置，下次打開后繼續(xù)。

• 反饋方式多樣化

反饋可以通過元素的顏色位置、文字、聲音和震動(dòng)，甚至動(dòng)效去表達(dá)變化。

比如京東，通過產(chǎn)品圖縮小-加入購物車的動(dòng)效來反饋“商品已加入購物車”，直觀形象。

案例一

比如今日頭條的下拉刷新功能：頭條頁面的刷新功能使用的是下拉刷新的交互方式，當(dāng)用戶下拉頁面時(shí)，頁面狀態(tài)欄跟內(nèi)容區(qū)中間會(huì)出現(xiàn)“新年快樂”的提示，當(dāng)我松開頁面中間會(huì)出現(xiàn)“推薦中”的動(dòng)態(tài)提示，加載完畢之后中間出現(xiàn)一條“今日頭條推薦引擎有8條更新”的文字提示；這一系列的提示就是我們所說的動(dòng)態(tài)可見原則，如下圖：

案例二

比如安心記加班中關(guān)注和取消圈子功能：當(dāng)用戶點(diǎn)擊關(guān)注按鈕之后，頁面中間會(huì)出現(xiàn)一個(gè)“關(guān)注成功”的提示，停留2S之后消失；類似這種，操作之后的提示也是狀態(tài)可見原則的一中，如下圖：

二、環(huán)境貼切原則

環(huán)境貼切原則簡單來講就是讓功能操作符合用戶的日常使用場(chǎng)景，遵循現(xiàn)實(shí)世界的慣

1. 使用目標(biāo)用戶的語言

這里的語言不僅僅包括文案層面的語言，還包括產(chǎn)品的設(shè)計(jì)語言（圖形、配色和風(fēng)格）。

產(chǎn)品使用的語言應(yīng)該使目標(biāo)用戶能夠清晰理解的。如果用戶不能理解，他們會(huì)感到被忽視和受挫敗，許多人將選擇其他產(chǎn)品完成目標(biāo)。

2.模擬現(xiàn)實(shí)世界的對(duì)象

模仿現(xiàn)實(shí)世界的產(chǎn)品或者使用映射，能夠利用人們現(xiàn)有的知識(shí)，降低學(xué)習(xí)成本，使他們輕松快速的理解界面。

比如微信閱讀打開書的動(dòng)效就像現(xiàn)實(shí)世界的打開一本書一樣、給medium文章進(jìn)行標(biāo)記就像我們現(xiàn)實(shí)中使用馬克筆一樣。

案例一

比如計(jì)算器的軟件界面設(shè)計(jì)基本上跟我們現(xiàn)實(shí)中使用的樣式差不多，下圖左一是現(xiàn)實(shí)中是使用的計(jì)算器，左二、三依次為錘子手機(jī)和蘋果X自帶計(jì)算器軟件的界面，真的是很相似，這樣設(shè)計(jì)能讓用戶很快上手，易于操作，因?yàn)楝F(xiàn)實(shí)生活中用戶已經(jīng)很熟悉計(jì)算器的使用方法了，這就是環(huán)境貼切原則：

案例二

例如新浪微博安卓的中文版和國際版：微博的中文版和國際版的logo和內(nèi)部頁面風(fēng)格、語言、結(jié)構(gòu)布局包括交互方式也不一樣；考慮到國外用戶的使用，軟件的語言默認(rèn)為英文，當(dāng)然還支持各種語言版本，可以根據(jù)所需在設(shè)置中調(diào)整，另外國際版界面的布局使用的設(shè)計(jì)風(fēng)格完全遵守谷歌的設(shè)計(jì)規(guī)范，這就是環(huán)境貼切原則，具體看下圖：

三、可控原則

用戶要能對(duì)當(dāng)前的情況很好地了解和掌控，足夠自由。例如：iPhone的Home鍵，音樂播放的控制，APP頁面跳轉(zhuǎn)的控制等等。這種情況下，我們應(yīng)該把“緊急出口”按鈕做的明顯一點(diǎn)，而且不要在退出時(shí)彈出額外的對(duì)話框。很多用戶發(fā)送一條消息、總會(huì)有他忽然意識(shí)到自己不對(duì)的地方，這個(gè)叫做臨界效應(yīng)；所以最好支持撤銷/重做功能。

案例一

比如微信聊天中的撤回功能：當(dāng)用戶誤操作時(shí)要給用戶提供提供撤銷、取消、重做等相關(guān)功能，比如聊天類產(chǎn)品的信息都可以短時(shí)間內(nèi)撤銷。然后重新編輯發(fā)送，來避免一時(shí)沒想好而錯(cuò)發(fā)消息可能給對(duì)方或者自己造成困擾，這就是用戶可控原則

案例二

谷歌相冊(cè)刪除照片之后的撤銷功能：在使用谷歌相冊(cè)的時(shí)候，我們會(huì)對(duì)照片做一些操作，比如照片的刪除，當(dāng)我在谷歌相冊(cè)中刪除一張照片的時(shí)候，它會(huì)在底部出現(xiàn)一條提示框，框內(nèi)后邊就會(huì)出現(xiàn)撤銷的提示，這也是可控原則的體現(xiàn)

四、一致性原則

對(duì)于用戶來說，同樣的文字、狀態(tài)、按鈕，都應(yīng)該觸發(fā)相同的事情，遵從通用的平臺(tái)慣例；也就是，同一用語、功能、操作保持一致。軟件產(chǎn)品的一致性包括以下五個(gè)方面：

結(jié)構(gòu)一致性

保持一種類似的結(jié)構(gòu)，新的結(jié)構(gòu)變化會(huì)讓用戶思考，規(guī)則的排列順序能減輕用戶的思考負(fù)擔(dān)；例如微信每個(gè)模塊的條目布局：微信中每個(gè)模塊的條目都有統(tǒng)一的“圖標(biāo)+文字信息”的結(jié)構(gòu)樣式，能讓用戶快速了解朋友圈、掃一掃、搖一搖、看一看、搜一搜、附近的人、漂流瓶、購物、游戲及小程序等功能都是做什么的，這就是結(jié)構(gòu)一致性的體現(xiàn)

色彩一致性

產(chǎn)品所使用的主要色調(diào)應(yīng)該是統(tǒng)一的，而不是換一個(gè)頁面顏色就不同；例如網(wǎng)易云音樂的顏色：網(wǎng)易云音樂的圖標(biāo)顏色與界面的主色均為紅色，包括其中一些標(biāo)簽和強(qiáng)調(diào)的文字顏色都是紅色，整個(gè)界面除了圖片的有效信息外，都通過灰、白、紅色來呈現(xiàn)，界面保持了很好的一致性

操作一致性

能讓產(chǎn)品更新?lián)Q代時(shí)仍然讓用戶保持對(duì)原產(chǎn)品的認(rèn)知，減小用戶的學(xué)習(xí)成本；比如安卓版微信、支付寶和釘釘APP中左上角的返回操作：它們?nèi)齻€(gè)安卓版的應(yīng)用內(nèi)返回上一級(jí)操作，都是通過頂部左側(cè)的返回按鈕進(jìn)行的，當(dāng)然也可以通過安卓的物理返回鍵，這就是操作一致性的體現(xiàn)

反饋一致性

用戶在操作按鈕或者條目的時(shí)候，點(diǎn)擊的反饋效果也要保持一致；比如安卓版手機(jī)QQ信息列表的打開方式：它的信息都是列表式結(jié)構(gòu)，不管你點(diǎn)擊那一行條目，下一級(jí)界面都是由右往左滑出，點(diǎn)擊頂部左上角的返回按鈕會(huì)從左往右滑回，體驗(yàn)相當(dāng)一致；這就是反饋一致性的體現(xiàn)

文字一致性

產(chǎn)品中除了風(fēng)格、色彩這些保持一致以外還要保證閱讀的文字大小、樣式、顏色、布局統(tǒng)一；再例如微信幾個(gè)關(guān)鍵界面的字體：下圖我用紅色框框起來的條目部分的文字，三個(gè)主界面不盡相同，但是，字體大小、顏色、布局的樣式都一樣，這樣讓整個(gè)APP視覺上看起來很舒服，這就是字體一致性，因此，我們?cè)谧鲆曈X設(shè)計(jì)的時(shí)候盡量使用同意風(fēng)格的文字。

五、防錯(cuò)&防呆原則

比出現(xiàn)錯(cuò)誤信息提示更好的是更用心的設(shè)計(jì)防止這類問題發(fā)生。在用戶選擇動(dòng)作發(fā)生之前，就要防止用戶容易混淆或者錯(cuò)誤的選擇。特別要注意在用戶操作具有毀滅性效果的功能時(shí)要有提示，防止用戶犯不可挽回的錯(cuò)誤。

案例一

比如安卓版本的知乎登錄操作：當(dāng)用戶在知乎中登錄時(shí)，在沒有填寫完手機(jī)號(hào)碼和密碼前，底部的登錄按鈕是置灰不可點(diǎn)擊的，只有兩項(xiàng)都填寫完整底部的登錄按鈕才會(huì)變?yōu)榭牲c(diǎn)擊狀態(tài)，也就會(huì)藍(lán)色的，這就是日常常見最典型的防錯(cuò)原則一種體現(xiàn)

案例二

比如安卓版微信發(fā)朋圈時(shí)，點(diǎn)擊返回按鈕出現(xiàn)的提示彈窗：彈出框方式會(huì)增加不可逆操作的難度，當(dāng)用戶發(fā)一條動(dòng)態(tài)一半的時(shí)候，因?yàn)檎`操作或者其它退出當(dāng)前狀態(tài)的時(shí)候，使用彈窗是個(gè)不錯(cuò)的選擇，因?yàn)橛脩暨@個(gè)操作會(huì)讓之前辛苦編輯的內(nèi)容刪除找不回，想要再發(fā)只能從頭開始，對(duì)用戶造成損失比較大；

六、協(xié)助用戶記憶原則

盡量減少用戶對(duì)操作目標(biāo)的記憶負(fù)荷，動(dòng)作和選項(xiàng)都應(yīng)該是可見的。用戶不必記住一個(gè)頁面到另一個(gè)頁面的信息。系統(tǒng)的使用說明應(yīng)該是可見的或者是容易獲取的。

案例一

比如谷歌相冊(cè)中的刪除照片操作：用一個(gè)類似垃圾桶的“圖標(biāo)”標(biāo)識(shí)刪除功能，對(duì)于用戶來講是有一定的認(rèn)知負(fù)荷的，且點(diǎn)擊“刪除”之后用戶對(duì)于造成的后果及影響也不清楚，因此，刪除之后出現(xiàn)彈窗提示很有必要，此彈窗清除的寫明了刪除之后的影響、后續(xù)的幫助說明以及操作的選項(xiàng)，彈出框的出現(xiàn)很好的減少了用戶前后的記憶負(fù)荷，這就是易取原則的體現(xiàn)，如下圖：

案例二

比如安卓版愛奇藝更新后的新功能引導(dǎo)：更新完APP之后，當(dāng)用戶觸發(fā)到這些功能時(shí)，會(huì)出現(xiàn)下圖類型的遮罩類的提示，這些提示告訴用戶功能所在的地方以及功能的作用；這種做法在很多APP中都會(huì)出現(xiàn)，這也是易取原則的一種體現(xiàn)，看下圖：

七、靈活高效原則

好的產(chǎn)品需要同時(shí)兼顧新用戶和資深用戶的需求。對(duì)新用戶來說，需要功能明確、清晰，對(duì)于老用戶需要快捷高效使用高頻功能。不可迎合某一種用戶，把不必要的信息占據(jù)重要部分。

1. 提供快捷入口

在首頁放置常用功能，或者提供自定義入口，比如猿題庫的自定義科目

2. 允許用戶重復(fù)操作

對(duì)用戶頻繁使用的功能，提供重復(fù)操作入口或者模板。比如美團(tuán)外賣，可以直接選擇再來一單

3. 提供默認(rèn)選項(xiàng)

通過提供系統(tǒng)默認(rèn)選項(xiàng)，而減少用戶多余的操作。比如美團(tuán)、攜程等當(dāng)?shù)胤?wù)類產(chǎn)品，會(huì)默認(rèn)選擇當(dāng)前定位的城市；購物會(huì)選擇默認(rèn)收貨地址等

案例一

比如安卓版本支付寶中的編輯應(yīng)用功能：支付寶首頁的應(yīng)用是可以根據(jù)自身喜好自定義的，包括定義常用應(yīng)用、排序、刪除、新增等等；這樣用戶可以根據(jù)自己的個(gè)人興趣定制自己適合的應(yīng)用分布方式，這就叫做用戶定制常用功能，也就是靈活高效原則的一種體現(xiàn)

案例二

比如安卓版QQ聊天常用表情模塊：安卓版本的QQ聊天界面表情彈窗中會(huì)有一個(gè)“常用表情”的模塊，它把個(gè)人平時(shí)使用頻率或者次數(shù)最多的表情進(jìn)行歸類，當(dāng)用戶使用的時(shí)候能很快的找到自己喜歡或者常用的表情，提高了聊天效率，體驗(yàn)很好

八、：審美和簡約原則

對(duì)話中不應(yīng)該包含無關(guān)緊要的信息。在段落中每增加一個(gè)單位的重要信息，意味著要減少相應(yīng)的弱化一些其他信息,無論交互還是視覺都應(yīng)該注意這條原則。

案例一

在新版本的蘋果手機(jī)中自帶的軟件中標(biāo)題都屬于字體放大，界面簡潔的設(shè)計(jì)風(fēng)格；在自帶音樂軟件中，段落中的標(biāo)題和正文區(qū)別是很明顯的，標(biāo)題明顯很大，而正文部分相對(duì)較小

案例二

安卓版網(wǎng)易云音樂及QQ音樂播放頁面：網(wǎng)易云音樂和QQ音樂APP音樂播放界面，從視覺及功能布局上面做的相當(dāng)不錯(cuò)，美觀簡約、功能主次分明、用戶體驗(yàn)不錯(cuò)；

九、容錯(cuò)原則

錯(cuò)誤信息應(yīng)該使用簡潔的文字（不要用代碼），指出錯(cuò)誤是什么，并給出解決建議。也就是在用戶出錯(cuò)時(shí)如何為出錯(cuò)的用戶提供及時(shí)正確的幫助？即要幫助用戶識(shí)別出錯(cuò)誤，分析出錯(cuò)誤的原因再幫助用戶回到正確的道路上。如果真的不能幫助用戶從錯(cuò)誤中恢復(fù)，也要盡量為用戶提供幫助讓用戶損失降到最低。

案例一

網(wǎng)易郵箱PC端的注冊(cè)界面：用戶在網(wǎng)易163電腦端注冊(cè)郵箱時(shí)，在輸入出錯(cuò)時(shí)不但會(huì)出現(xiàn)錯(cuò)誤的提示，還會(huì)給出相應(yīng)的建議，幫助用戶進(jìn)行正確的抉擇，這樣就避免用戶出現(xiàn)更大的失誤并且提高了注冊(cè)的效率，這是一種相當(dāng)好的用戶體驗(yàn)，也是容錯(cuò)原則的一種體現(xiàn)，如下圖：

案例二

例如Twitter注冊(cè)頁面的錯(cuò)誤提示：用戶在注冊(cè)Twitter賬號(hào)時(shí)，第一步要輸入名字和手機(jī)號(hào)碼，當(dāng)用戶輸入正確的時(shí)候，輸入框后邊會(huì)有綠色的對(duì)勾圓圈，提示用戶輸入正確，可以進(jìn)入下一步操作了，而當(dāng)用戶輸入錯(cuò)誤的時(shí)候，輸入框會(huì)變?yōu)榧t色并且在下方出現(xiàn)紅色字的錯(cuò)誤提示，這樣讓用戶很清楚的知道用戶輸入錯(cuò)誤以及錯(cuò)誤的原因，這樣用戶就知道怎么修改了

十、人性化幫助原則

即使系統(tǒng)不適用幫助文檔是最好的，但我們也應(yīng)該提供一份幫助文檔。任何幫助信息都應(yīng)該可以方便地搜索到，以用戶的任務(wù)為核心，列出相應(yīng)的步驟，但文字不要太多。

案例一

淘寶APP和知乎APP登錄頁面的幫助入口：在比較重要的功能入口處有必要提供相應(yīng)的幫助入口，來解決用戶在操作功能過程中遇到的問題或者反饋問題的入口，不要讓用戶在出現(xiàn)問題時(shí)手足無措，不知道怎么辦，具體看下圖：

案例二

比如mac上一些常用的大型軟件：原型制作工具Axure RP 8軟件、圖像編輯軟件Photshop CC以及mac上的Safari瀏覽器，在頂部狀態(tài)欄上都有有一個(gè)“幫助”的入口，也體現(xiàn)了幫助文檔的必要性，所以，不管是什么樣的產(chǎn)品都要給用戶提供一個(gè)幫助的入口，用來解決用戶操作過程中遇到的問題