B端产品设计中，弹窗可以做哪些事情？

此外，对于一些任务来说，虽然信息量大，但大多数场景下用户并不需要去编辑所有的字段，而只是修改你其中一两个。因此，从用户感知来说，相比二级页面，使用弹窗会让他们感觉更快捷、简单。

大多数情况下，用户只需要编辑或修改一两个字段

这里有必要说一下其中比较特殊的弹窗——登录/注册界面。虽然以弹窗的形式来呈现目前仍然很常见，但已经有越来越多的产品在用户点击“登录”时会跳转到新的页面，这样做的好处是可以有更大的空间，用来增加产品slogan和场景图，以达到向用户介绍产品核心功能、烘托产品氛围、宣传品牌理念的目的。

2、简单任务

如选择器、输入验证码、高级搜索、分享、操作权限确认、用户反馈等一些单一、简单的操作。多数情况下，这些弹窗更多的只是整个任务的一个过渡操作、前提设置，或者你可以把它看做仅仅是一个选择器。

用悬停浮层来代替

有一些过渡操作，并不一定要使用传统的模态弹窗，比如下面这种场景：用户点击“打印”时，需要用户来选择打印样式（纵向和横向），最开始我们的设计是让用户点击“打印”后，显示弹窗让用户选择打印样式，用户需要选择并确认（或直接确认默认选项），才能进入打印预览界面。这样看起来符合逻辑和用户心理模型；但结果发现，对那些使用打印功能频繁的用户，每次这样的弹窗“确认”让人觉得 “多余”和“愚蠢”：我基本都是“横向（或纵向）”打印，为什么每次都要让我选择？正是因为这样，我们最终放弃了弹窗，而改用了这种浮层的设计：用户悬停按钮时，就即时显示可选择的选项，如果用户不需要切换选项，直接点击打印就好（这对于绝大多数用户来说如此）。同时也允许用户快速切换到其他选项。通过与真实用户的沟通和观察，我们发现他们很明显更喜欢这种交互。

三、反馈

用户点击按钮、完成任务，或系统状态更新后，需要给用户一个明确的反馈，这是人机交互中的一个至关重要的部分。如果只有输入，没有输出，很容易造成用户的不良情绪，如困惑、怀疑、不信任等。告知用户发生了什么？结果如何？此外，容错是评价一个产品可用性的重要标志之一，我们要在用户可能“犯错”前给予必要的提示、警告。

（1）重要操作确认

确认退出、确认删除、确认提交……需在弹窗中告知用户正在进行的操和可能带来的“危害”，减少用户犯错的可能。有的可使用非模态浮层，但最好能显示在操作触发区域旁边，以防止用户忽略提示。

（2）告知操作结果

告知结果和影响，并引导用户接下来可进行的任务；

如果只是普通的告知用户操作成功（如申请成、删除成功、提交成功……），这里建议使用toast提示即可，让用户“了解”即可，而不需要特别用户关注和点击关闭。如果是操作失败，在告知结果同时，还需要告知用户失败的原因、需要做什么。

诸如导入等相对复杂、不可控和出错率较高的任务，在操作失败时还需要告知用户具体出错的位置，帮助用户快速定位原因并找到解决方案。

（3）页面异常

断网、数据出错、系统崩溃等。

（4）下线通知

页面登录超时，强制下线重新登录；账号被挤下等。

（5）其他反馈类弹窗

四、小结

在B端web设计中，弹窗的视觉样式可以是多种多样的（本文也并未过多涉及这方面），但从功能上来说，无外乎以上所述信息展示、任务、反馈三大类型。一般来说，如果可以替代，我们应慎重和少使用弹窗。但了解弹窗的各种应用场景，可以方便我们更好地权衡设计方案：是否可用弹窗？是否只能用弹窗？用二级页面、浮层、甚至toast提示是否会更好……从另一个角度来说，了解弹窗的各种功能，对于我们梳理和规范现有产品框架、制定和完善设计交互及视觉规范来说，也是大有裨益的。

日常设计小结，如有不足，欢迎拍砖指正！

（编辑：上饶站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!