尼爾森是一名人機互動學博士，通過總結分析200多個可用性問題，1995年提出了尼爾森十大可用性原則，不論在Web設計還是移動端設計，掌握了這十項原則，都能有效提升產品使用者體驗度。今天就以例項跟大家聊聊尼爾森十大原則。
雅各布.尼爾森簡介
雅各布·尼爾森（Jakob Nielsen）是畢業於哥本哈根的丹麥技術大學的人機互動博士，他擁有79項美國專利,專利主要涉及讓網際網路更容易使用的方法。尼爾森在2000年6月，入選了斯堪的納維亞互動媒體名人堂，2006年4月，並被納入美國計算機學會人機互動學院，被賦予人機互動實踐的終身成就獎。他還被紐約時報稱為“Web 易用性大師”，被 Internet Magazine 稱為 “易用之王”。他提出的10大可用性原則（10 Usability Heuristics），被廣泛運用於人機互動的各個領域（多在C端為主）。
10大可用性原則
1. 系統狀態可見性（狀態可見原則）
系統應始終通過合理時間內的適當反饋，讓使用者瞭解正在發生的事情。--尼爾森
1.1 系統狀態可見性-位置可見
相比於C端產品，B端產品在頁面層級往往更為複雜。因此，讓使用者明確當前所處的位置尤為重要，這也就突顯出了導航的重要性。系統平臺中常見的有橫向導航、縱向導航和組合導航這3種。
1.2 系統狀態可見性-數量可見
系統支援對任務欄位進行自定義配置，在「新增欄位」的彈窗中，當使用者勾選了欄位後，下方的「確定」按鈕上會顯示已選數量，方便檢查核對。
1.3 系統狀態可見性-狀態可見
在企業管理後臺將某個任務欄位鎖定後，再次進入「新增欄位」彈窗，被鎖定的欄位後面帶有表示已鎖定的icon，告訴使用者該欄位不可編輯。（多選超出選擇數量後核取方塊置灰或隱藏也屬於狀態可見原則）
2. 貼近使用者的真實環境（環境貼切原則）
系統應該說使用者習慣的語言，比如：使用者熟悉的單詞、短語和概念，而不是系統導向的術語。遵循現實世界的約定，使資訊以自然且合乎邏輯的順序出現。
——尼爾森
一個B端管理平臺中整合了眾多使用者許可權，比如：功能性模組和系統管理模組等。在首頁中，用到的語言通俗易懂，無需特定的專業背景即可理解。而在系統管理頁面中，用到的語言則是較為專業的開發術語，比如「程式碼庫」、「程式碼組」、「許可權管理」等，因為系統管理的主要使用者群體是開發或運維人員，以上這些詞語是開發人員習慣和熟悉的。
3. 使用者有控制和來去自由的權利（使用者可控原則）
當使用者錯誤地選擇了的某個功能後，系統需要提供一個明確的「緊急出口」，來讓使用者離開其不想要的狀態，而且無需額外的對話方塊。支援撤銷和重做。
——尼爾森
3.1 使用者有控制和來去自由的權利-關閉與返回
在某些系統中，一個任務下可建立多個子任務，子任務從屬於父任務。因此，在子任務彈窗中，同時具有「返回上級」和「關閉」按鈕，對應的操作分別是返回父任務彈窗，或者直接關閉彈窗。（多用於功能浮窗，麵包屑導航也屬於使用者可控原則）
由於B端系統的複雜性，有些功能的層級會比較深。彈窗A中的某個操作可能會觸發彈窗B的彈出，如果彈窗A和B承載的功能具有父級和子級的關係，同樣需要考慮「返回」的功能。
（PS：實際專案中其實應該儘量避免多層級彈窗）
3.2 使用者有控制和來去自由的權利-撤銷與重做
在「任務欄位型別配置」的頁面中，當使用者更改了預設的初始配置後，右上角會出現「恢復為預設配置」的按鈕。這是一種支援高效重做的設計思路。（我們系統中經常會在資訊錄入，系統設定中增加“重置”）
4. 系統的一致性（一致性原則）
我們不應當讓使用者去懷疑不同的語句、狀態或操作是否在表達同一件事。設計需遵循平臺的慣例。——尼爾森
4.1 系統的一致性-樣式一致
以平臺中的彈出提示為例，在位置上，提示統一出現在頁面的左下角，經過一樣長的時間後自動漸出消失；在形式上，都是icon加上文字的形式，且右上角具有關閉按鈕；在顏色上，操作成功用綠色，操作失敗和報錯用紅色，功能推送用藍色；如果提示中存在文字按鈕，則文字按鈕的顏色統一用藍色。
4.2 系統的一致性-功能一致
當具備排序功能時，以相同的icon表示，並且在功能操作上也保持了一致：通過拖拽來調整排序。
5. 避免錯誤（防止錯誤原則）
比報錯提示更好的方法是，通過嚴謹的設計來防止錯誤的發生：要麼消除容易出錯的情況，要麼把這些容易出錯的情況找出來，並在使用者採取行動之前提供確認選項。——尼爾森
5.1 防止錯誤-預警與確認
在任務選單中，當滑鼠懸停在非危險操作上時，底色會變成淺灰色；但是，當滑鼠懸停在「移到回收站」上時，底色會變成紅色，通過醒目的顏色來提示使用者，這是一個危險操作，從而降低使用者誤操作的可能。而當使用者點選「移到回收站」時，二次確認的彈窗會彈出，進一步防止使用者錯誤操作。（未儲存關閉、刪除、更改資料等操作都需要做預警提示）
5.2 防止錯誤-置灰
通常情況下，按鈕置灰表示對應功能或操作無法使用，這也是防止錯誤的一條有效途徑，因為使用者通過按鈕樣式就可獲知其狀態，省去了點選的試錯成本。那麼，是不是隻要功能或操作無法使用時，就應該將對應的按鈕置灰呢？（其實更好的做法是填寫玩標題後按鈕不置灰，點選完成按鈕後定位或高亮必填項，讓使用者更容易識別錯誤點）
6. 系統識別勝過使用者記憶（易取原則）
通過將物件、操作和選項進行視覺化，最大限度地減輕使用者的記憶負擔。使用者不需要記住對話方塊中某一部分到另一部分的資訊。系統操作的指示資訊需要易於被使用者發現和獲取。——尼爾森
6.1 系統識別勝過使用者記憶-保留歷史
提及保留歷史，最為常見的就是為使用者保留歷史搜尋和歷史瀏覽。某些平臺功能中有「近期專案」模組，會按專案開啟時間由近至遠排序，方便使用者快速進到自己需要處理的專案中。（常用的office工具）
6.2 系統識別勝過使用者記憶-視覺化呈現
在worktile的看板配置彈窗中，當勾選了右側的欄位後，左側的預覽區會實時展示欄位顯示在卡片中的位置和樣式。因為看板的單張卡片區域比較有限，但有時又需要在卡片中囊括較多的任務資訊，這時通過勾選欄位後實時地預覽，可以讓使用者反覆對卡片呈現效果進行配置和除錯，很大程度上減輕了記憶負擔。
6.3 系統識別勝過使用者記憶-指示資訊易取
worktile任務開啟方式有3種，分別是：彈窗、側邊滑出、全屏。但如果僅僅是3個名詞，還是有些抽象，不夠直觀。因此將3種開啟方式做成了對應的3個GIF圖，當滑鼠懸停在上面時，GIF圖就開始播放。當使用者需要進行選擇時，必定會將滑鼠移動到對應的開啟方式上，也就必然會發現GIF圖中涵蓋的指示。（這樣子設計，不僅讓開啟方式直觀，而且易於被使用者發現和獲取）
7. 靈活易用的使用體驗（靈活高效原則）
一些快捷操作的功能，雖然會被新手使用者忽略，但可能為專家使用者所使用並幫助提升其使用效率，因此，系統需要同時滿足新手使用者和專家使用者的需求。允許使用者頻繁地操作。 ——尼爾森
7.1 靈活易用的使用體驗-靈活配置
以worktile的任務欄位為例，可以對任務欄位型別進行配置，包括新增欄位、刪除欄位、將欄位設為必填等。另外支援對自定義欄位進行編輯，包括欄位的名稱、型別、預設值和提示文案。任務欄位的配置僅對當前所在專案生效，因此，不同的專案可具備不同的欄位配置，使得專案管理更加靈活。（多見於任務或內容釋出）
7.2 靈活易用的使用體驗-各取所需
以文件為例，如需對文字格式進行編輯，可以有多種方式。當使用者需要對文字進行加粗時，在選中文字後，可以點選上方工具欄中的加粗按鈕，也可以按快捷鍵，或者使用Markdown語法。以上這3種方式都可以達到加粗的效果，但面對的使用者群體卻不太一樣。新手使用者可能會選第1種，熟練使用者或專家使用者可能會用第2種，習慣於用Markdown寫作的使用者則更傾向於第3種。因此，在設計功能時，最好能考慮到不同層次使用者的需求，以此來讓使用者「各取所需」（需要平臺有多型別使用者）
7.3 靈活易用的使用體驗-允許頻繁操作
在某些場景下，使用者可能會進行一些頻繁或重複的操作，因此需考慮：如何設計才能讓這些頻繁的操作更加方便。比如，在建立任務時，會有「儲存」和「完成並建立下一個」這2個按鈕，「完成並建立下一個」其實就為那些需要一次建立多個任務的使用者提供了便利。另外，在建立子任務時，點選「儲存」後，下方會自動彈出下一個子任務的文字框，使用者可選擇繼續建立或點選「取消」按鈕結束建立，這樣設計同樣是為了提升頻繁操作的效率。
8. 美觀且簡約的設計（優美且簡約原則）
對話方塊中不應包含無關或很少用到的資訊。在對話方塊中每增加一個資訊，就意味著降低了主要資訊的相對可見性。 ——尼爾森
在任務看板中，當任務狀態為「已完成」時，對應的卡片以置灰的方式呈現，從而突出了「待處理」和「進行中」的任務卡片。當任務的優先順序為「緊急」時，卡片左側會以橙色進行標記，而優先順序為「普通」或「較低」的任務，卡片左側就不會用顏色標記。這個案例通過弱化(置灰)和去除(去掉標記顏色)，從而讓頁面簡潔，且使得重要資訊得以突顯。
9. 幫助使用者識別、診斷和從錯誤中恢復原則
報錯資訊應該用通俗易懂的語言表達（而不是用程式碼），準確地反應問題，並且提出可行的解決方案。 ——尼爾森
9.1 幫助使用者識別、診斷、並從錯誤中恢復-識別並從錯誤中恢復
當某個自定義任務欄位在企業管理後臺被鎖定後，在「編輯自定義欄位」的彈窗中，不僅通過置灰讓使用者明確不可編輯，還提示了原因所在（欄位被鎖定），而且也告知了解決方案（被誰鎖定，可以找誰）。
如果報錯資訊用到的是難以理解的語言或程式碼，那起到的效果將會大打折扣。上圖中這個報錯提示出現的場景是：在任務彈窗中新增附件併發布時出錯。從「引數有誤: attachments」這句文案中，使用者獲知的僅僅是：附件問題導致釋出不成功。但，「引數有誤」是什麼意思？附件格式不對？還是附件超出大小限制？還是不知道出錯的原因，就更別提解決方案了。
10. 幫助文件-幫助和提示原則
儘管，能讓使用者無需閱讀文件就會使用是最好的方式，但大多情況下，可能還得提供幫助文件。幫助文件的資訊應該易於被搜尋，聚焦於使用者的任務，並列出具體的步驟，而且，不能太龐大。 ——尼爾森
10.1 幫助文件-浮窗提示
在平臺中，如果是簡短且和簡單操作直接相關的幫助提示，則大多是浮窗的形式：當滑鼠懸停時出現；
10.2 幫助文件-文字提示
對於很難用幾句話解釋清楚的幫助資訊，則配置連結，點選後可跳轉到幫助中心的對應位置。
總結
在設計B端產品時，對尼爾森10大可用性原則的運用可從以下方面進行考慮，但不僅限於以下這些。
- 系統狀態的可見性：位置可見、數量可見、狀態可見。
- 貼近使用者的真實環境：用到的語言應該是使用者所習慣的。
- 使用者有控制和來去自由的權利：關閉與返回、撤銷與重做。
- 系統的一致性：樣式一致、結構與互動一致、功能一致。
- 防止錯誤：預警和確認、置灰。但置灰在有些情景下並不適合，需結合具體情況考量。
- 系統識別勝過使用者記憶：保留歷史、視覺化呈現、指示資訊易取。
- 靈活易用的使用體驗：靈活配置、各取所需、允許頻繁操作。
- 美觀且簡約的設計：通過弱化和去除不重要的資訊，讓重要資訊突顯。
- 幫助使用者識別、診斷，並從錯誤中恢復：問題需準確，方案要可行，勿用程式碼。
- 幫助文件：根據幫助資訊的長短與型別，綜合使用浮窗提示、文字提示、跳轉幫助中心等形式。
交流群
