滴滴产品总监:如何合理设计弹窗以保证流畅的用户体验?

本文讨论了在APP设计中如何减少弹窗和提示以提升用户体验的方法。包括通过合理的规则设置避免错误发生、采用状态表达控件反馈信息等手段,并分析了何时可以省略弹窗提示。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >


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、给予异常操作的预告提示而不是操作后给予警告

对于以上两种还是无法避免的。那就列提示牌,前方高能,请勿靠近。哈哈,开个玩笑,这种类似提示线下生活场景用的太多了。那么产品设计上也是可以考虑的,总比用户一脚踩进雷区然后来一个警告吓坏用户的小心脏要好。

这里没有过多的理论分析(怕答非所问),上面的实用方法都是个人总结。实际上来讲,应该有这样的一个思考过程:弹窗和提示的交互目的是什么?为什么会产生这样的交互?各类弹窗和提示的需求场景和优先级对比?然后才是怎么规避?好吧回答一个问题,抛出三个问题……


戳 阅读原文 去社区提问,就有机会和一线产品大咖探讨产品

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值