本文作者將嘗試對非模態反饋進行下定義，并提及了如何設計非模態反饋，以及舉一些案例進行分析。

什么是非模態反饋？

艾倫·庫珀在《about face》第十五章中提到過“富視覺非模態反饋”（rich visual modeless feedback，RVMF）可能是最重要的一種非模態反饋方式了。它的“富”在于能夠深入全面的信息，讓人了解一個進程的狀態或者屬性，或者當前應用程序的對象。它的“視覺”是指按習慣方式利用屏幕上的像素（通常是動態的）。它的“非模態”在于信息能及時輕松地顯示出來，即不需要用戶做特殊動作或者轉換模式，就能看到和理解這些反饋。（參考http://flylib.com/books/en/2.153.1.174/1/）

從淘寶的訂單頁我們可以看出幾個“富視覺非模態反饋”實例。

• 反饋1：正在進行的交易，框框用淺藍色表示，已完成或關閉的用灰色。
• 反饋2：客服在線與不在線的狀態反饋。
• 反饋3：用icon明確所售商品的性質的反饋。
• 反饋4：當鼠標移至第一個條目時，反饋用戶，還有更多操作（轉發與標記）。
• 反饋5：鼠標移至“備注”icon時，顯示非模態彈窗，告知用戶詳細內容。
• 反饋6：第三個訂單有修改過價格。
• 反饋7：這個訂單是在手機上下單的。

以上通過顏色、圖標及詳細的文字等信息告知用戶某一訂單的所有狀態和屬性。這雖然能夠讓用戶掌控所有訂單情況，但是在視覺讀取上需要耗費用戶很大的能量，并且一些某些反饋需要手動操作才行。因此這種“富視覺非模態反饋”需要一定的學習成本，它更適用于更多的后臺系統中的。

上面兩個圖都是為了提醒用戶輸入有誤，左圖非模態反饋，信息提示幾秒后便消失，并不妨礙用戶正常的操作行為。右圖為模態反饋，中斷了用戶的操作，需用戶手動確認后方可進行后續操作。

我的定義，非模態反饋（modeless feedback）是一種有效的信息提示的表達方式，這種信息的反饋不會影響到用戶正常的操作，更不會打斷用戶的行為，它能夠在關鍵時刻提醒用戶任務的狀態是什么，是完成了還是失敗了還是出錯了甚至是操作提示，這就是非模態反饋。

模態是指界面中只有提醒彈框才具有可交互行為，其他一切都不可操作；非模態不會把提醒做成彈框，可能會處理成List Notification, Toast list等方式來提醒用戶

非模態反饋的意義？

上一段中，從我對“非模態反饋”的定義中，就不難得出其意義的所在。

存在的意義在于，幫助用戶更加有效的完成任務?！?b>有效”包含了提供有用的信息反饋，提高任務的操作效率。

有用的信息反饋：

1. 明確告訴用戶任務所處的狀態，讓用戶感受到一切都在掌握之中。
2. 及時的提醒用戶下一步需要做什么，這一步哪些地方操作有誤。

提高任務的操作效率：

1. 在不打斷用戶行為操作的前提下提供反饋。
2. 在用戶“犯錯”之前及時制止，而不是“犯錯”后告訴他。

程序必須假裝用戶始終是正確的，并不意味著用戶實際上總是正確的。用戶出錯可能不是程序的故障，但是程序有責任。而非模態反饋的意義在于審核用戶的操作，然后給出相應的判斷，但不能“自以為是”地糾正用戶的錯誤。

如何設計非模態反饋？

上文中，說到“富視覺非模態反饋”的應用，更多的在于后臺系統中的行為。而“非模態反饋”則是簡單的用戶輸入信息或操作，系統給出相應的答復，在設計這個答復的信息界面時，我們則需要從用戶的角度出發，以有效的幫助用戶完成任務為目標設計。

上文中提到的案例，這其實并不是一個很好的“非模態反饋”設計案例，為什么？如左圖，第一，它需要用戶“提交申請”后才能反饋，并不能在用戶犯錯之前及時制止。第二，這種反饋搶占了視覺信息的中心，而用戶的這種犯錯并不是一個嚴重的不可挽救的行為。第三，這種反饋出現的位置占據了用戶的輸入信息框，一定程度上阻礙了用戶輸入信息的操作。

因此，更好的“非模態反饋”是如右圖，在用戶跳過金額或快遞直接輸入單號時，及時的在用戶提交之前反饋用戶那些遺漏的輸入，并以一種更和諧不打斷用戶操作的方式進行。

一些“非模態反饋”案例

下面我將列舉一些具體的場景，舉例說明一些“非模態反饋”案例。

1、明確并告知用戶任務狀態

chrome瀏覽器中打開一個新的頁面，將已加載好的內容呈現給用戶，同時標簽欄中有個小轉頭提示用戶頁面并未全部加載完成。

qq郵箱發送郵件的過程同時允許用戶繼續瀏覽內容。

百度云盤把保存的模態彈框設計成List
Notification這種方式的，提醒用戶保存成功并可立即查看，這種非模態的處理，讓流程更加順暢和輕松自如。

ins發布一條動態時，以非模態的形式告知用戶上傳進度同時不影響用戶對其他內容的繼續瀏覽。而下方某APP在上傳歌曲時以模態彈窗反饋用戶進度，不僅打斷了用戶的后續操作同時無取消按鈕，上傳成功后依舊采用模態對話框，嚴重干擾到了用戶操作流程。

QQ在界面加載時，如左圖導航欄下面有個進度條反饋加載情況。

QQ在綁定手機號碼后，如右圖會自動進入到匹配通訊錄的任務，并告訴用戶程序在干什么。

2、及時的操作及特殊情況反饋提醒，包括成功、失敗和提示

大家一直用的word辦公軟件，N多年之前關于錯誤單詞提醒反饋就做的很棒，它不會跳出一個彈窗告訴用戶“您有個單詞拼錯了”，而然在用戶輸完這個單詞準備下一個單詞前及時的、友好的將錯誤信息以非模態形式反饋給用戶，在用戶犯錯之前制止。至于用戶改不改，就不是程序該關心的事了。

QQ在發送好友邀請后會以非模態的形式反饋用戶操作成功并自動返回消息界面，并不會balabala的彈出一個個對話框讓用戶確認這確認那。

如右圖，是QQ綁定手機時手機填寫錯誤的提示。

QQ在無網絡狀態下，會在消息條目上面以非模態形式反饋給用戶，而不是蹦出一個警告彈窗。

雖然QQ在非模態反饋中處理的非常出色了，但這里還存在一個問題。如右圖，當我評論附近的人的新鮮事時，只有當我準備發送評論時才提醒我沒有權限。

解決方案：當我打開鍵盤時即提示，不然辛辛苦苦打了幾百字不能發會是一種怎么樣的體驗？

（1）案例1：版本升級提示

軟件版本迭代是家常便飯，讓我們看看印象筆記是如何處理的。每次你打開不會跳出彈窗讓你立刻升級，因為用戶是不喜歡完全聽從程序的安排，而且打開軟件必定是當前有任務需要處理，想想那些每次打開軟件求好評的彈窗，何不在我完成任務后再提醒升級呢？

印象筆記這中非模態反饋，不僅沒有打擾到用戶正常的操作，同時還在時刻提醒用戶軟件需要升級。 再看看下面sketch和春秋的升級提醒 是不是不太友好？？

（2）案例2：聲音調節提示

• 場景：用戶用APP觀看視頻，發現聲音聽不清，需要調節音量。
• ios端：音量調節提示框居中，且較大，極大影響用戶開頭觀影體驗，可能造成用戶從頭觀看。
• 安卓端：音量調節提示框在頂部，且較大，雖如圖不影響觀影體驗，但全屏后開頭觀影體驗較差。
• INS APP：音量調節提示框在頂部，且較小，無論是否全屏均不影響觀影體驗。

分析：

1. 用戶觀看視頻，關注點在于視頻內容，對于用戶的操作雖然需要給出相應的反饋，但是前兩個示范卻嚴重的干涉了用戶的主任務，并且音量調節不屬于一個“突然”或“特殊”的情況，因此提示沒必要過分突顯。
2. 從聲音的本質分析，其屬于聽覺范圍的體驗，相比明確的文字或圖片視覺反饋提示，不如用戶直接用耳朵在聽覺上感受音量變化來的更直接更有效。

（3）其他一些非模態的處理案例

網易云音樂PC端

非模態的處理更多的是應用于游戲當中。

以上就是我對“非模態反饋”的一些總結與思考?？傮w來說，QQ在這方面的處理是同類軟件中比較出色的。謝謝大家耐心看完，第一次發文，可能有些地方表述不對，歡迎大家指出。

本文由 @劉東晨?原創發布于人人都是產品經理。未經許可，禁止轉載。