之前在一篇文章里抛出来一个关于弹窗与浮层的问题,当时的背景是这样的,微信和京东在关于密码错误时采用的提示方式是完全不同的。微信采用的是警告框,而京东采用的则是浮层,由于当时自己也是心存疑惑,所以后来查看了一些资料和文章,于是就有了这篇文章。
警告框常见的使用场景为:
二次确认;
重复操作;
操作反馈;
权限获取等。
常见的警告框的方式为一个按钮或者两个按钮,其中一个按钮的警告框通常只是起到了通知的作用,而未能赋予用户对当前状态的控制能力,一般情况下警告框的样式也是可以进行定制的,见下图。
对于两个按钮的弹窗中,【取消】按钮到底是放在左边,还是放在右边,曾经我也纠结了好久,后来发现在iOS 9人机界面指南中是给出了建议的:
如果这个按钮不会造成损害性结果,又是用户最有可能会选择的操作,那么它应该放在右边,取消按钮则应该放在左边;
如果这个按钮会造成损害性后果,又是用户最有可能会选择的操作,那么它应该被放在左边,取消按钮应该放在右边。
通常情况下,对于这样的弹窗也会利用视觉上的差异来突出重要操作,或者说突出我们想要用户进行的操作,有时候也会故意利用用户的误操作,见下图。
2操作列表
操作列表展示了与用户操作直接相关的一系列的选项,通常情况下从界面的底部或者以弹出层的形式出现。
操作列表:
由用户的某个操作行为触发;
包含两个及两个以上的按钮。
操作列表通常提供了一系列的选项来帮助用户完成任务,并且操作列表不会永久的占用页面的空间,通常情况下操作列表包括两种,一种是模态的,一种是非模态的。
模态的操作列表通常会给出取消按钮,并且会用红色标注出来具有破坏性的操作,另外模态的操作列表通常也会采用一些图标或者采用定制化的菜单。
3问题对话框
问题对话框是用于向用户提问的窗口,主要有选择和填空两种方式,问题对话框适用于回答单一的问题,如果涉及多个问题时,建议优先使用跳转到新的页面视图的方式。
选择方式的问题对话框在iOS中通常是用列表视图来进行选择的。
二. 浮层
浮层是指当用户初次进入页面或者在当前页面进行交互时,页面出现的临时视图,该视图用来显示提示信息。而浮层的分类则更加没有什么统一的标准了,形式也更加的多样了。
这里借用新浪UED的一个分类标准,将浮层分为三类,分别是高优先级、中优先级与低优先级。其中高优先级和中优先级的浮层都是采用模态的形式,而低优先级的则是采用非模态的形式。
1高优先级
高优先级的浮层是指用户只有点击操作按钮或者关闭按钮才能够关闭浮层,常见于运营活动、新手引导等。
3低优先级
低优先级的浮层一般都是采用非模态的方式,其中低优先级的浮层又分为自动消失和手动消失。
自动消失的浮层多见于操作的反馈,通常也被称为Toast,一般停留1-3秒后就自动消失了,常见的位置为页面中间或者页面的顶部。
相关资源:漂浮截图工具-教育工具类资源
声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!