编辑导语:模态框和非模态框在设计的过程中经常会被使用到,但是很多人仍然没有搞懂应该在什么场景下合理的去使用,本文作者结合自己的经验,为我们做了总结。

最近在整理系统的组件规范,收集各个场景下的组件应用,在搜集应用控件时,弹窗的套用、混用、乱用情况挺多的。
主要是模态框和非模态框的使用:
- 模态框:一般会有一层黑色透明的蒙板,它打断用户所属的主流程,不能进行下去,只能到完成模态框的操作,才能返回到主流程中去,这个操作很明确,不会被误解;
- 非模态框:一般没有那一层蒙板,不会影响所属的主流程,也不用担心原有进度会停止,仍然可以持续操作,即打开非模态也能看见底层的主流程。
概述:模态or 非模态,统称为弹窗。
样式上可以理解为类似卡片,能够帮助用户快速定位获取关键信息和进行操作,它的内容是灵活的,一般情况下包含文字、图标、按钮。弹窗的设计是给用户传递与当前场景需要的操作相关的内容。

场景使用:会根据业务的需要、场景要求,衍生出其他类多种形态。大多情况下先对弹窗分类,再对应到场景中使用。而实际上产品设计会从实际业务出发,从使用方式考虑,倒推来使用什么样的弹窗符合要求。
基本设计原则:层次要分明,突出重点。
遵循基本的界面设计原则,在多种场景下通过信息分层、字体的粗细、大小等方式展现出明显的视觉层次,结合业务场景需要再按照阅读顺序惯例来布局,标题使用对象的名字,目的是帮助用户聚焦每一个关键信息上。

一、悄无声息的,你在不在乎它,它都会出现的
全局提示:一般由系统主动发起,不是用户请求的,大体分为进度提醒、通知提醒、公告提醒。
闽ICP备13000641号-4