起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識后臺產品的容錯性設計：設計要點與設計方法淺析
由于后臺產品往往具有復雜交互邏輯，因此相比于前端產品更容易發生操作錯誤，所以其容錯性設計就顯得更為重要。
容錯性是什么？
容錯這個詞嚴格來說應當是計算機領域的詞匯，如果以比較標準化的描述來定義的話，容錯指的是：
“當計算機由于種種原因在系統中出現了數據、文件損壞或丟失等等其他故障問題的時候，系統能夠自動將這些損壞或丟失的文件和數據恢復到發生事故以前的狀態，使系統能夠連續正常運行的一種技術?！?/p>
這個聽著有點繞口，其實簡單來說，就是當計算機故障發生或者存在的情況下，計算機系統依然可以正常工作的能力，這就是計算機的容錯能力。容錯性其實就是可用性之中細分的一個模塊，是專門針對用戶在使用產品的過程中如何避免出錯以及一旦出錯如何盡快有效的糾錯的研究和設計。
容錯包含產品防止錯誤的程度和幫助用戶從錯誤中恢復。防止錯誤是通過頁面的設計、重組或特別安排，防止用戶出錯。比出現錯誤信息提示更好的是更用心的設計防止這類問題發生。糾錯設計就是當錯誤發生時，人們看到的界面，并且提出一個建設性的解決方案。就像對付不該發生的錯誤一樣，容錯性設計的關鍵在于“做好防御”。產品設計者們必須不斷尋找可能造成用戶困惑和不滿的出錯點。好的防御性設計決定用戶體驗的好壞。
為什么強調后臺產品的容錯性設計 ?
后臺產品和前端產品存在很大的差異性。后臺多為復雜型交互邏輯，有多分支功能頁面多功能交互能力，后臺產品更加注重的是業務邏輯的清晰和功能的實現，而前端產品對視覺設計和交互設計有更高的要求。
一個完備的后臺可能會包括多種類型或者不同權限的用戶，在不熟悉業務情況下會產生已知未知錯誤或誤操作等行為。很多后臺功能復雜 功能之間很多時候并非完全割裂互相交織的，粗暴的將功能堆積在一起自然不太合適，影響用戶的操作體驗。
容錯性的設計分析：
1、操作前-提醒防錯
1）詳盡的說明文字且引導和提示，突出表現
主要是針對新用戶，目的是為了正確引導用戶學習使用。引導和提示要突出表現，從而引起用戶關注，確保用戶在操作前能注意到引導或提示信息。
輸入框填寫說明可以讓用戶很容易清晰的識別具體填寫內容。
2）當結果不可逆的時候，詢問用戶讓其知道操作的后果
在用戶操作前即給出正確且有效地引導和提示，有助于減少錯誤發生的可能性。如 對于比較重要的操作，需要通過二次確認減少錯誤的發生。
2、操作中-實時提示&實時反饋
1）給用戶的操作進行提醒
在后臺眾多需要填寫表單當中，當鼠標聚焦在某一個操作區域時如果沒有明確的預提醒，則容易引起誤操作。
2）對用戶的信息輸入進行視覺化呈現，并提供回饋
數據錄入是后臺交互設計中最為重要的元素之一。對用戶輸入的信息進行實時檢驗，并給用戶傳遞回饋，在下面這個案例中，當用戶輸入自己的郵件信息之后，即被告知用戶這個動作的含義，到底是輸入正確還是輸入錯誤。
拿1688評價功能來舉例，輸入評價內容時評價所允許字數會隨著輸入內容逐個減少，實時的聯動表達狀態并提供反饋，并且這個操作也提升了用戶直接的操作感，然后讓用戶看到自己的操作結果。
3）適當限制用戶的某些交互操作
可以對一些可能造成錯誤的操作入口設置障礙或直接禁止操作，以避免錯誤的發生。舉個例子：填寫完一個模塊內容，展開另一模塊的同時收起上一個模塊。填寫過程限制用戶某些操作這樣始終讓用戶聚焦在當前內容。
3、操作后-結果反饋&糾正引導
1）錯誤發生時，即使反饋錯誤并提供糾錯幫助
反饋錯誤及時就能保證用戶每個階段的操作都能得到回饋，避免因為一個小的錯誤就要修改相關聯的一系列內容的情況，提高成功完成任務的效率；反饋不僅要指出有錯，還要指出錯在哪里。錯誤反饋文案要清晰、準確，這樣便于用戶了解錯誤的原因，方便下一步的修改。
2）允許用戶犯錯，并使操作者能夠撤銷以前的指令
Phone手機的還原功能，可以在用戶出錯時將多種功能設置快速還原到原始狀態。
用戶選購完商品后完成下單，可以通過“關閉交易”取消該訂單。
3）不僅要反饋出錯更要給用戶解答，給予用戶適當指引和建議
在發布供應產品中完成發布信息的編輯添加，點擊“商品發布”按鈕，如果有錯誤發生 會在發布導航中提醒用戶并告知用戶導致發布不成功的原因。再比如：檢測發布商品質量時，會提示該offer的質量星級以及給用戶優化的內容指引與建議等。
4）允許用戶犯錯，且幫助糾正錯誤
當用戶操作出現錯誤時允許用戶犯錯，且幫助將錯誤的信息糾正同步給用戶。拿1688搜索來舉例：用戶想搜索“連衣裙”這類商品，但輸入時用戶輸入成“連衣”，系統允許用戶輸入錯誤并且幫助用戶糾正為正確字段。
除了上面講的設計點以外其他重要的設計方法
1、 費茨定律
Fitts定律其實很容易理解的。顯然，指點設備的當前位置和目標位置相距越遠，我們就需要越多的時間來移動；而同時，目標的大小又會限制我們移動的速度，因為如果移動得太快，到達目標時就會停不住，因此我們不得不根據目標的大小提前減速，這就會減緩到達目標的速度, 延長到達目標的時間。
目標越小，就需要越早減速，從而花費的時間就越多。通俗點講：任意一點移動到目標中心位置所需時間與該點到目標的距離和大小有關，距離越大時間越長，目標越大時間越短。
菲茨定律的啟示：
- 按鈕等可點擊對象需要合理的大小尺寸。
- 屏幕的邊和角很適合放置像菜單欄和按鈕這樣的元素，因為邊角是巨大的目標，它們無限高或無限寬，你不可能用鼠標超過它們。即不管你移動了多遠，鼠標最終會停在屏幕的邊緣，并定位到按鈕或菜單的上面。
- 出現在用戶正在操作的對象旁邊的控制菜單（右鍵菜單）比下拉菜單或工具欄可以被打開得更快，因為不需要移動到屏幕的其他位置。
2、提供非模態的反饋，不打斷任務流
模態是指界面中只有提醒彈框才具有可交互行為，其他一切都不可操作；非模態不會把提醒做成彈框，可能會處理成List Notification, Toast list等方式來提醒用戶。
3、 視覺情感化
心理學把情感定義為：
“人對客觀現實的一種特殊反映形式，是人對于客觀事物是否符合人的需要而產生的態度的體驗”。
而設計的目標則是在用戶接觸和使用產品的過程中，激發用戶的正向情感，比如愉快，信任，滿足；避免用戶產生負向情感，比如失望，挫折感，痛苦。正向的情感會使用戶更樂于使用產品，遇到使用過程的一些小問題也更加包容。
舉個例子：網絡問題導致加載數據失敗404頁面，通過友情提示動畫的情感表達，這種情感化的語言也能舒緩出錯時給人帶來的失望，挫折感。
作者：何文銓
來源：U一點
平臺運營官
很好玩，棒