消息弹窗、广告弹窗、通知弹窗等

弹窗一般分为模态弹窗和非模态弹窗。弹窗就是为了给用户回馈，需要主动的交互操作触发。非模态弹窗一般被设计者用来告诉用户信息内容，而模态弹窗除了告诉用户信息内容外还需要用户进行功能操作。用通俗的两句话来总结下：

模态弹窗会打断用户的操作行为，强制用户必须进行弹窗上的操作，否则不可以进行其他操作。

非模态弹窗不会影响用户操作，用户可以不予以回应，通常由时间显示，会出现一段时间内自动消失

Alerts/Dialog:警告框与对话框

Actionbar操作栏、操作列表、活动视图

Popover/Popup：浮出框/浮层弹窗

Toast/HUD：提示框（iOS没有Toast，只有HUD）

Snackbar：底部弹窗

弹窗分为两大类：模态弹窗与非模态弹窗，两者的区别在于是否打断用户操作，用户是否必须回应才能进行下一步操作。模态弹窗作为强提示，会打断用户操作，非模态弹窗作为轻提示，对用户影响比较小。

1、Toast 提示框

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

2、Dialog 对话框

Dialog对话框是一种模态弹窗。当用户进行了敏感操作，或者当App内部发生了较为严重性的状态改变，这种操作和改变会带来影响性比较大的行为结果，在该结果发生前以Dialog对话框的弹窗形式告知用户且让用户进行功能选择。比如退出App、进行付费下载等功能操作。

3、Actionbar 功能框

Actionbar功能框可以看成是Dialog的一种延伸设计，两者都是模态弹窗，用户必须进行回应，否则弹窗不会消失，用户无法继续其它操作。

4、Snackbar 提示对话框

Snackbar提示对话框是安卓系统的特色弹窗之一（安卓平台在开发的时候可以直接调用Snackbar类生成该弹窗，iOS好像也可以进行定制化设计开发），它也是一种非模态弹窗，同时拥有Toast和Dialog的特点，不会打断用户正常的操作流程，它除了可以告诉用户信息内容，还可以与用户进行对话交互（用户可以点击功能按钮进行回应）。

弹窗分为两种类型：模态弹窗与非模态弹窗（有些地方可能翻译为无模式窗口）。

模态弹窗

用户需要先与其进行交互，才能继续操作。也就是说它是强制性的，用户无法忽视它的存在。确保人们收到关键信息，并在必要时采取心动。

非模态弹窗

存在一定的时间限制，通常用于系统反馈，用户无需对其进行回应。

弹窗是我们平时在设计APP时候绕不开的一个元素，选择合适的弹窗形式，是我们需要多加思考的地方，避免变成只会完善产品原型的线框美工。

弹窗是我们与机器界面进行互动的一扇窗，它是一种用户与产品直接对话的方式，它可以传达信息，反馈状态以及引导用户操作。弹窗分为两种类型：模态弹窗与非模态弹窗（有些地方可能翻译为无模式窗口）。

什么是弹窗?

弹窗又称为对话框，是App与用户进行交互的常见方式之一。弹窗分为模态弹窗和非模态弹窗两种，两者的区别在于需不需要用户对其进行回应。模态弹窗会打断用户的正常操作，要求用户必须对其进行回应，否则不能继续其它操作;非模态弹窗则不会影响用户的操作，用户可以不对其进行回应，非模态弹窗通常都有时间限制，出现一段时间后就会自动消失。

无论是模态还是非模态，弹窗都是位于当前页面的最顶层。模态弹窗常常都还会伴随半透明的遮罩来吸引用户的视觉焦点，以突出弹窗的信息内容。非模态弹窗一般被设计成用来告诉用户信息内容，而模态弹窗除了告诉用户信息内容外还需要用户进行功能操作。

常见的弹窗分类用下面这个图就可以解释清楚啦~

(麻麻说自己做的图要写上大名)1. Dialog(Alerts)

需要用户对弹窗进行操作后才能执行其他操作。优势在于提醒明显，能够对用户行为进行定向性预测。

(图片来自网络)2. Actionbar(Action Sheets、Acitivity Views)

提供用户多种选择的弹窗，此为用户主动发出操作。优势在于可以承载多种选项，实现多应用之间操作。

(图片来自网络)

(图片来自网络)3. Popover

用户单击某个控件或页面某个区域后出现的临时复层，通常可以再次隐藏。优势在于用户操作时页面逻辑清晰，当前页面因隐藏多项低频操作使得界面简洁。

(图片来自网络)4. Toast/HUD

信息给予用户及时反馈，确保用户知晓自己所处的状态，并做出相应的措施。优势在于提示轻盈，不会对用户操作带来太大阻碍。

(图片来自网络)

(图片来自网络)5. Snackbar

向用户反馈信息，可以交互。优势可以弱化提醒的同时，增加操作。

(图片来自网络)

对于UI设计师而言，理论上的分类清晰还远远不够，还需要针对视觉、文案、以及其他商业需求进行权衡。常见的有以下方面:

【视觉方面】

1. 弹窗文案简洁，表意清晰无歧义

比如，弹窗提醒文字为“是否要删除该项?”，操作为“是”和“否”会让用户犹豫不清是删除还是不是删除，若换成“删除”和“取消”就不会有歧义了。

2. 设计风格尽量简约

3. 弹窗的设计风格可以根据应用设计风格进行重塑

比如，微博Toast弹窗就根据微博整体风格进行设计。

4. 可进行诱导性设计

常见的如希望用户点击的按钮放在右边，放大点击按钮弱化关闭按钮等。

5. 危险操作需警示

如删除时需要将“删除”操作警示。

【交互方面】

1. 弹窗的出现尽量不干扰用户使用

2. 具有同种层级的弹窗使用相同的样式

3. 同种Toast弹窗位置保持相同

4. 注意弹窗频率

今天先整理些理论，明天的文章会从可操作的方法讲述弹窗如何制作。

消息弹窗、广告弹窗、通知弹窗等