一、什么是弹窗

弹窗又称为对话框，是App与用户进行交互的常见方式之一。

 我们常说的用户的认知能力与系统的反馈，这里的反馈很多时候会用到弹窗组件

弹窗常用于中断用户当前操作对其作出补充，或中断用户当前操作对其作出反馈；其价值在于提示重点内容，完成业务流程的简单必要操作或给用户提供实时反馈。

弹窗的使用一定要克制，它带来视觉上的中断，打扰用户完成业务流程；再加上弹窗视觉面积较小，承载信息有限，应当尽量减少弹窗使用。

二、弹窗的分类

弹窗分为模态弹窗和非模态弹窗两种，两者的区别在于需不需要用户对其进行回应。

模态-Dialog对话框

当用户进行了敏感操作，或者当App内部发生了较为严重性的状态改变，这种操作和改变会带来影响性比较大的行为结果，在该结果发生前以Dialog对话框的弹窗形式告知用户且让用户进行功能选择，还有一类是强制让用户看到的，比如功能更新小红点、优惠券弹窗等功能操作，

          

模态-Actionbar功能框

Actionbar一般被设计用来向用户展示多个功能按钮选择。

在iOS中，Actionbar的样式比较常见的是文字列表框，它出现在页面底部，以简洁的功能描述性文字展示功能按钮，敏感的功能操作一般用红色字体标出（也可以设计其它颜色以突出某个功能按钮）。

    

模态-Popover气泡弹出框

Popover（气泡弹出框/弹出式气泡/气泡）是由一个矩形和三角箭头组成的弹出窗口，箭头指向的地方通常是导致Popover弹出的控件或区域。通过Popover内的按钮或非Popover的屏幕其他区域可关闭Popover。

某控件或区域弹出Popover后，Popover出现在使其触发的控件附近，箭头的指向很好的表达了Popover和触发控件的潜在关系，用户的注意力能马上被吸引过来。而且把手指或鼠标指针从触发控件移动到Popover的距离很近，操作非常顺手、效率高。

      

非模态-Toast提示框

弹出一个小信息，作为提醒或消息反馈来用，一般用来显示操作结果，或者应用状态的改变。

最常见的Toast提示框为一句简短的描述性文字。这种样式的弹窗可以出现在页面的任何位置，可设置成在页面顶部、中部或者在底部出现（但一般都是出现在页面的中轴线上），具体的显示位置根据页面的整体设计进行设置。该种Toast在安卓App上十分常见。

还有一种Toast弹窗由简单的图形和简短的文字组成，显示位置一般位于页面正中央。这种Toast在iOS和安卓上都可以经常见到。

      

非模态-Snackbar对话提示框

Snackbar 是一种针对操作的轻量级反馈机制，通常出现在手机屏幕或者桌面端左下方，以浮动弹出框的形式存在。

与Toast相同，Snackbar也会出现屏幕所有层的最上方，包括浮动操作按钮；短暂出现后，会主动消失。

但Snackbar带有一定的交互性，用户触摸屏幕其他地方后自动消失，也可以在屏幕上滑动关闭。

而且Snackbar有时候可以带有一个操作，如撤销。对于一些可能会有不好后果的操作，并且可撤销，可以以Snackbars 的形式告知并提供撤销按钮。

总结

弹窗虽然看似一个简单、常见的功能，但是其承载的作用也是很重要的，因此，我们对于弹窗的设计仍然要从弹窗的本身价值出发，然后结合用户体验，达到体验和价值的完美平衡。

弹窗的价值就是提示重点内容，给与用户一个实时的反馈，当然也有部分是用来做运营的强关联操作，大概有如下几条规则可以遵守和灵活运用。

第一不要打扰用户：控制好频率、节点（如只有节日可以弹大的全屏弹窗，平常尽量不要弹）；控制好弹出的位置和大小，不要给用户太多的交互负担。

第二要清晰直接：文案要简短明了、配合一定的示意图、重点内容要突出；虽然有些产品经常忽悠用户，如送1000元这种可能分解了20个券，但是请不要赤裸裸的欺骗。

第三交互：按钮有主次之分，虽然有些产品故意把取消按钮置灰使之不明显，但是要适度，因人、因产品而不同。

第四要客观设计：要有关掉弹窗的入口，不要让用户懵逼，当然，如果你要强推、强弹，你的地盘你做主。

第五，如果有多种内容同时需要在一个弹窗弹出，怎么办？一是要做好多种内容的排序，二是不同类的内容尽量分开场景设计弹窗，不然会显得不伦不类；还有一种情况，多个弹窗同时出现的时候，页面的弹窗叠加在一起，无论是视觉还是感受都会非常差，建议慎重使用。

-----------------------

这是一个神奇的男人，你完全猜不出他什么时候会写出什么，他自己也不知道。

-----------------------