市面上關(guān)于“非模態(tài)反饋”的文章很少，以下我將結(jié)合我個(gè)人的看法并舉例一些產(chǎn)品實(shí)例，來談?wù)勈裁词欠悄B(tài)反饋充择，非模態(tài)反饋的意義和如何設(shè)計(jì)非模態(tài)反饋取胎。
什么是非模態(tài)反饋展哭？
艾倫·庫珀在《about face》第十五章中提到過“富視覺非模態(tài)反饋”（rich visual modeless feedback，RVMF）可能是最重要的一種非模態(tài)反饋方式了闻蛀。它的“富”在于能夠深入全面的信息匪傍，讓人了解一個(gè)進(jìn)程的狀態(tài)或者屬性，或者當(dāng)前應(yīng)用程序的對象觉痛。它的“視覺”是指按習(xí)慣方式利用屏幕上的像素（通常是動態(tài)的）役衡。它的“非模態(tài)”在于信息能及時(shí)輕松地顯示出來，即不需要用戶做特殊動作或者轉(zhuǎn)換模式薪棒，就能看到和理解這些反饋手蝎。（參考http://flylib.com/books/en/2.153.1.174/1/）
從淘寶的訂單頁我們可以看出幾個(gè)“富視覺非模態(tài)反饋”實(shí)例。
反饋1：正在進(jìn)行的交易俐芯，框框用淺藍(lán)色表示棵介，已完成或關(guān)閉的用灰色。
反饋2：客服在線與不在線的狀態(tài)反饋吧史。
反饋3：用icon明確所售商品的性質(zhì)的反饋邮辽。
反饋4：當(dāng)鼠標(biāo)移至第一個(gè)條目時(shí)，反饋用戶，還有更多操作（轉(zhuǎn)發(fā)與標(biāo)記）吨述。
反饋5：鼠標(biāo)移至“備注”icon時(shí)岩睁，顯示非模態(tài)彈窗，告知用戶詳細(xì)內(nèi)容锐极。
反饋6：第三個(gè)訂單有修改過價(jià)格笙僚。
反饋7：這個(gè)訂單是在手機(jī)上下單的。
以上通過顏色灵再、圖標(biāo)及詳細(xì)的文字等信息告知用戶某一訂單的所有狀態(tài)和屬性肋层。這雖然能夠讓用戶掌控所有訂單情況，但是在視覺讀取上需要耗費(fèi)用戶很大的能量翎迁，并且一些某些反饋需要手動操作才行栋猖。因此這種“富視覺非模態(tài)反饋”需要一定的學(xué)習(xí)成本，它更適用于更多的后臺系統(tǒng)中的汪榔。
上面兩個(gè)圖都是為了提醒用戶輸入有誤蒲拉，左圖非模態(tài)反饋，信息提示幾秒后便消失痴腌，并不妨礙用戶正常的操作行為雌团。右圖為模態(tài)反饋，中斷了用戶的操作士聪，需用戶手動確認(rèn)后方可進(jìn)行后續(xù)操作锦援。
我的定義，非模態(tài)反饋（modeless feedback）是一種有效的信息提示的表達(dá)方式剥悟，這種信息的反饋不會影響到用戶正常的操作灵寺，更不會打斷用戶的行為，它能夠在關(guān)鍵時(shí)刻提醒用戶任務(wù)的狀態(tài)是什么区岗，是完成了還是失敗了還是出錯(cuò)了甚至是操作提示略板，這就是非模態(tài)反饋。
模態(tài)是指界面中只有提醒彈框才具有可交互行為慈缔，其他一切都不可操作叮称；非模態(tài)不會把提醒做成彈框，可能會處理成List Notification, Toast list等方式來提醒用戶
非模態(tài)反饋的意義藐鹤？
上一段中瓤檐，從我對“非模態(tài)反饋”的定義中，就不難得出其意義的所在教藻。
存在的意義在于，幫助用戶更加有效的完成任務(wù)右锨±ǖ蹋“有效”包含了提供有用的信息反饋，提高任務(wù)的操作效率。
有用的信息反饋：1.明確告訴用戶任務(wù)所處的狀態(tài)悄窃，讓用戶感受到一切都在掌握之中讥电。2.及時(shí)的提醒用戶下一步需要做什么，這一步哪些地方操作有誤轧抗。
提高任務(wù)的操作效率：1.在不打斷用戶行為操作的前提下提供反饋恩敌。2.在用戶“犯錯(cuò)”之前及時(shí)制止，而不是“犯錯(cuò)”后告訴他横媚。
程序必須假裝用戶始終是正確的纠炮，并不意味著用戶實(shí)際上總是正確的。用戶出錯(cuò)可能不是程序的故障灯蝴，但是程序有責(zé)任恢口。而非模態(tài)反饋的意義在于審核用戶的操作，然后給出相應(yīng)的判斷穷躁，但不能“自以為是”地糾正用戶的錯(cuò)誤耕肩。
如何設(shè)計(jì)非模態(tài)反饋？
上文中问潭，說到“富視覺非模態(tài)反饋”的應(yīng)用猿诸，更多的在于后臺系統(tǒng)中的行為。而“非模態(tài)反饋”則是簡單的用戶輸入信息或操作狡忙，系統(tǒng)給出相應(yīng)的答復(fù)梳虽，在設(shè)計(jì)這個(gè)答復(fù)的信息界面時(shí)，我們則需要從用戶的角度出發(fā)去枷，以有效的幫助用戶完成任務(wù)為目標(biāo)設(shè)計(jì)怖辆。
上文中提到的案例，這其實(shí)并不是一個(gè)很好的“非模態(tài)反饋”設(shè)計(jì)案例删顶，為什么竖螃？如左圖，第一逗余，它需要用戶“提交申請”后才能反饋特咆，并不能在用戶犯錯(cuò)之前及時(shí)制止。第二录粱，這種反饋搶占了視覺信息的中心腻格，而用戶的這種犯錯(cuò)并不是一個(gè)嚴(yán)重的不可挽救的行為。第三啥繁，這種反饋出現(xiàn)的位置占據(jù)了用戶的輸入信息框菜职，一定程度上阻礙了用戶輸入信息的操作。
因此更好的“非模態(tài)反饋”是如右圖旗闽，在用戶跳過金額或快遞直接輸入單號時(shí)酬核，及時(shí)的在用戶提交之前反饋用戶那些遺漏的輸入蜜另，并以一種更和諧不打斷用戶操作的方式進(jìn)行。
下面我將列舉一些具體的場景嫡意，舉例說明一些“非模態(tài)反饋”案例举瑰。
**一、明確并告知用戶任務(wù)狀態(tài) **
chrome瀏覽器中打開一個(gè)新的頁面蔬螟，將已加載好的內(nèi)容呈現(xiàn)給用戶此迅，同時(shí)標(biāo)簽欄中有個(gè)小轉(zhuǎn)頭提示用戶頁面并未全部加載完成。
qq郵箱發(fā)送郵件的過程同時(shí)允許用戶繼續(xù)瀏覽內(nèi)容旧巾。
Gmail是第一個(gè)把刪除的模態(tài)彈框設(shè)計(jì)成List Notification這種方式的耸序，提醒用戶撤銷剛才的刪除操作，這種非模態(tài)的處理菠齿，讓刪除的流程更加順暢和輕松自如佑吝。
ins發(fā)布一條動態(tài)時(shí)绳匀，以非模態(tài)的形式告知用戶上傳進(jìn)度同時(shí)不影響用戶對其他內(nèi)容的繼續(xù)瀏覽芋忿。而下方某APP在上傳歌曲時(shí)以模態(tài)彈窗反饋用戶進(jìn)度，不僅打斷了用戶的后續(xù)操作同時(shí)無取消按鈕疾棵，上傳成功后依舊采用模態(tài)對話框戈钢，嚴(yán)重干擾到了用戶操作流程。
QQ在界面加載時(shí)是尔，如左圖導(dǎo)航欄下面有個(gè)進(jìn)度條反饋加載情況殉了。
QQ在綁定手機(jī)號碼后，如右圖會自動進(jìn)入到匹配通訊錄的任務(wù)拟枚，并告訴用戶程序在干什么薪铜。
**二、及時(shí)的操作及特殊情況反饋提醒恩溅，包括成功隔箍、失敗和提示。 **
大家一直用的word辦公軟件脚乡，N多年之前關(guān)于錯(cuò)誤單詞提醒反饋就做的很棒蜒滩，它不會跳出一個(gè)彈窗告訴用戶“您有個(gè)單詞拼錯(cuò)了”，而然在用戶輸完這個(gè)單詞準(zhǔn)備下一個(gè)單詞前及時(shí)的奶稠、友好的將錯(cuò)誤信息以非模態(tài)形式反饋給用戶俯艰，在用戶犯錯(cuò)之前制止。至于用戶改不改锌订，就不是程序該關(guān)心的事了竹握。
QQ在發(fā)送好友邀請后會以非模態(tài)的形式反饋用戶操作成功并自動返回消息界面，并不會balabala的彈出一個(gè)個(gè)對話框讓用戶確認(rèn)這確認(rèn)那辆飘。
如右圖啦辐，是QQ綁定手機(jī)時(shí)手機(jī)填寫錯(cuò)誤的提示污秆。
QQ在無網(wǎng)絡(luò)狀態(tài)下，會在消息條目上面以非模態(tài)形式反饋給用戶昧甘，而不是蹦出一個(gè)警告彈窗。
雖然QQ在非模態(tài)反饋中處理的非常出色了战得，但這里還存在一個(gè)問題充边。如右圖，當(dāng)我評論附近的人的新鮮事時(shí)常侦，只有當(dāng)我準(zhǔn)備發(fā)送評論時(shí)才提醒我沒有權(quán)限浇冰。解決方案：當(dāng)我打開鍵盤時(shí)即提示，不然辛辛苦苦打了幾百字不能發(fā)會是一種怎么樣的體驗(yàn)聋亡？
案例1：版本升級提示
軟件版本迭代是家常便飯肘习，讓我們看看印象筆記是如何處理的。每次你打開不會跳出彈窗讓你立刻升級坡倔，因?yàn)橛脩羰遣幌矚g完全聽從程序的安排漂佩，而且打開軟件必定是當(dāng)前有任務(wù)需要處理，想想那些每次打開軟件求好評的彈窗罪塔，何不在我完成任務(wù)后再提醒升級呢投蝉？
印象筆記這中非模態(tài)反饋，不僅沒有打擾到用戶正常的操作征堪，同時(shí)還在時(shí)刻提醒用戶軟件需要升級瘩缆。 再看看下面sketch和春秋的升級提醒 是不是不太友好？佃蚜？
案例2：聲音調(diào)節(jié)提示
場景：用戶用APP觀看視頻庸娱，發(fā)現(xiàn)聲音聽不清，需要調(diào)節(jié)音量谐算。
ios端：音量調(diào)節(jié)提示框居中熟尉，且較大，極大影響用戶開頭觀影體驗(yàn)氯夷，可能造成用戶從頭觀看臣樱。
安卓端：音量調(diào)節(jié)提示框在頂部，且較大腮考，雖如圖不影響觀影體驗(yàn)雇毫，但全屏后開頭觀影體驗(yàn)較差。
INS APP：音量調(diào)節(jié)提示框在頂部踩蔚，且較小棚放，無論是否全屏均不影響觀影體驗(yàn)。
分析：
①用戶觀看視頻馅闽，關(guān)注點(diǎn)在于視頻內(nèi)容飘蚯，對于用戶的操作雖然需要給出相應(yīng)的反饋馍迄，但是前兩個(gè)示范卻嚴(yán)重的干涉了用戶的主任務(wù)，并且音量調(diào)節(jié)不屬于一個(gè)“突然”或“特殊”的情況局骤，因此提示沒必要過分突顯攀圈。
②從聲音的本質(zhì)分析，其屬于聽覺范圍的體驗(yàn)峦甩，相比明確的文字或圖片視覺反饋提示赘来，不如用戶直接用耳朵在聽覺上感受音量變化來的更直接更有效。
其他一些非模態(tài)的處理案例：
網(wǎng)易云音樂PC端
瀏覽器搜索功能
非模態(tài)的處理更多的是應(yīng)用于游戲當(dāng)中
以上就是我對“非模態(tài)反饋”的一些總結(jié)與思考凯傲，總體來說QQ在這方面的處理是同類軟件中比較出色的犬辰。謝謝大家耐心看完，第一次發(fā)文冰单，可能有些地方表述不對幌缝，歡迎大家指出。
本文首發(fā)于PMcaff http://www.pmcaff.com/article/index/662378093466752?from=profile
