滴滴产品总监:如何合理设计弹窗以保证流畅的用户体验?
iPrideRoCK?滴滴打車 產品總監 :
如何在產品設計的過程中,盡可能不出現任何彈窗和提示,而讓用戶流暢的使用完所有流程?圖中所示的是非常不好的錯誤案例。
▍Daisy_MA?謀職 產品經理
不一定需要“完全避免”,要看打擾用戶的程度,犯錯誤的幾率,是否提高用戶效率等等。
有些提示也許是目前更好的方法,但是有些彈窗設計確實可以避免,試著答一下:
1、最好的方法就是完全規避掉錯誤,犯錯零幾率(只讓用戶做他會做對的,傻瓜設計)
復雜的,就牽扯到規則設置
比如不可以按的鍵,就灰色顯示
比如這個例子中,頻繁驗證,就驗證碼鍵盤,過了一定時間才可以點擊,之前灰色顯示
比如密碼六位,就六個空
手機號碼如果錯誤高,就手機位數(但也許會操作不便,不確定ing)
以下亂猜測下(可能想的很不合理,大家批):
比如電商根據庫存,當庫存小于某個數值的時候,不可以下單或單位時間,僅容許多少下單
比如火車票訂票(當然現在的12306“也許”更合理),根據單位時間購票率(當列當次單位時間購票率),當剩余票數小于此數值時,點擊預購即算購買,單位時間僅對前若干位開放預購功能(等于剩余票量的)
2、變容易錯誤的填空,為沒有錯誤的選擇(和1差不多)
比如,電影票選座(賣出去的,就不讓選)
如果錯誤無法避免
1、錯誤早提示
2、重復輸入修正(在一定程度可以歸為3)
3、二次確認(重要功能或信息,或者重要流程中斷)
▍博文^_^?中云普華 產品總監
我的觀點是:對話框作為一項獨特的交互界面,在App設計中有著不可替代的重要作用。合理使用對話框對于一個設計者來說是必備技能。而為什么提出盡量避免使用對話框的問題,主要是因為很多設計者不懂得合理使用導致濫用影響到用戶體驗,問題的點應該在“如何不濫用”層面上。
1,首先看看iOS、Android的設計指南對對話框設計的建議:
iOS
Model contexts章節里提到:為不影響用戶體驗,應盡量減少Model窗出現的次數,但是在以下情況應考慮使用:
①讓用戶高度注意時
②有必須錄入的數據時(這種情況也可以選擇用Model View的形式替代Alert)
Temporary Views章節里提到:這些情況下,對話框是可以避免使用的--
Android
在Material Design中,對話框作為最高層級的控件存在,為整個設計體系的一個重要組成部分。
在Components-Dialogs章節中,提出對話框對操作流程的打斷降低了操作體驗的問題,在設計過程中盡量減少對操作流程的打斷。將對話框進行了分類,分別介紹其使用規范。同時給出了在錯誤提醒、信息提示的更多的控件選擇:比如Snackbar、Simple menu、helper text和error text。
2,再分析一下移動APP中常見的出現對話框的時機:
錯誤反饋時(錄入格式不正確、用戶密碼錯誤)
App更新提示時(Android)
進度條(如數據加載中、登陸中)
顯示快捷菜單時
重要功能提示時
信息反饋時
退出時(Android)
3,分析上述時機中,哪些對話框是可以盡可能省略的:
① 錯誤反饋
類似登陸注冊的數據錄入畫面,格式錯誤或數據錯誤反饋提示,很顯然可以用體驗更好的方式替代。
②App更新(Android)
App版本更新功能,為引導用戶點擊更新,一般都會以對話框的形式實現。如果要提供更好的用戶體驗,也可以利用Snackbar實現。
③進度條
根據iOS和Android的設計規范,建議不使用對話框。
④快捷菜單
Android的ActionBar、Snackbar、以及長按彈出Menu的功能可以提升操作體驗,蘋果有Toobar控件可以實現類似功能但考慮要支持新款小屏設備不建議使用。
⑤重點功能提示
無論是業務層面還是功能層面,重要性很高的功能放在醒目的對話框里無可厚非。比如廣告,比如新增功能,比如引導信息。
⑥信息反饋提示
用戶某些操作的信息反饋根據信息的重要程度可以選擇使用對話框、Toast或者其它方式,選擇怎樣的方式全憑設計者對功能的理解了。
⑦退出時(Android)
安卓的退出App對話框的設計,也是很有考究的。直接體現了設計者的功(lian)力(pi)。
4,最后說說利用對話框能更好的幫助實現哪些產品目標:
①對用戶有嚴重影響的重要提醒,必須用對話框。例如:
②引導用戶使用新功能、參與新活動,利用對話框效果最好。當然也可以無恥的直接把廣告放到對話框里。
③安卓系統設計功能時鼓勵使用ActionBar、SnackBar,提升操作體驗。
(部分超鏈接請點擊原文鏈接打開)
▍flyish?Feel-運動社區 PM
題主的問題里也說了盡可能避免,其實題主也是認可彈窗和提示是屏幕交互類產品里比不可少的交互了。確定了這點我就可以放心的說了(因為實在沒有辦法完全不用彈窗和提示),怎么來避免或者盡可能減少不友好的彈窗和提示?
1、盡可能分解流程,避免過多的分支和選擇
在需求建模和流程設計的時候就有一個很好的產品設計考慮,避免在一個流程當中有過多的異常分支,通常這些異常的分支在頁面交互的體現就是彈窗,這里能夠規避大部分的彈窗。
2、盡可能的區分狀態,多使用狀態表達控件
在一個獨立頁面中,不同的交互順序可能產品不同的接口,這些結果中只有一個是正向流程,其他的可能都是有異常警告的。所以多使用一些狀態表達控件在不同的狀態下給予不同的狀態反饋。避免用戶的誤操作
3、給予異常操作的預告提示而不是操作后給予警告
對于以上兩種還是無法避免的。那就列提示牌,前方高能,請勿靠近。哈哈,開個玩笑,這種類似提示線下生活場景用的太多了。那么產品設計上也是可以考慮的,總比用戶一腳踩進雷區然后來一個警告嚇壞用戶的小心臟要好。
這里沒有過多的理論分析(怕答非所問),上面的實用方法都是個人總結。實際上來講,應該有這樣的一個思考過程:彈窗和提示的交互目的是什么?為什么會產生這樣的交互?各類彈窗和提示的需求場景和優先級對比?然后才是怎么規避?好吧回答一個問題,拋出三個問題……
戳?閱讀原文?去社區提問,就有機會和一線產品大咖探討產品
總結
以上是生活随笔為你收集整理的滴滴产品总监:如何合理设计弹窗以保证流畅的用户体验?的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 你所知道的都是错的!产品经理的十大认知错
- 下一篇: 活动 | 优步首席产品官Jeff Hol