蒙版使用场景

在App设计中，我们经常会使用到蒙版。所谓蒙版，顾名思义，就是“蒙在上面的一层板”。一般用黑色或添加品牌色的半透明遮罩效果，遮盖住下层界面，展示蒙版上层内容。那么，什么样的情况下需要用到蒙版呢？

一、引导说明

通常，用户打开一个新产品，或是产品升级后有新功能时，会看到这样的引导提示：在半透明的蒙版隔层上，有简单明了的文字说明与图形，配合着指示性小箭头，醒目活泼的气泡，插画手绘小贴纸，甚至手势动画等等，教用户如何快速上手。其中，黑色蒙版降低了原本界面的可视度，需要说明的功能点高亮并标注，使得用户的注意力能集中在了解新功能和使用方法上，阅读也更清晰。

问题：用户可能会不耐烦，想快速关掉。

方案：1.适当考虑加入关闭按钮，让用户决定是跟随引导还是自己探索。2.尽量简洁，只对核心关键功能着重说明，每次只集中于单个交互动作进行解释引导，让用户更快更容易地知道发生了什么。3.增加趣味性，让体验更愉悦。

二、模态加载

模态加载指的是在单向通行的线性流程中（不可逆路径），阻断式的页面数据加载。在这个加载过程中，不允许用户随意操作触发其他行为，否则极易出现各种分支和异常。比如注册、交易等流程中，较多使用蒙版和加载动画表明加载进程。

问题：漫长等待的同时无所事事，增加了用户焦躁情绪，每等1秒就是一年。

方案：1.减少不必要的模态加载。比如有些电商类APP在启动页就进行模态加载，使用户有种每次见面都有拒之门外的隔阂感。2.设置取消选项，避免弱网环境下一直卡在进程里，只能杀进程而中断。3.设置超时判断提醒，在超过指定时间数据仍未请求成功时，释放蒙版，告知用户结果，缓解挫败情绪（情感化设计）。4.用其他形式代替模态加载。比如分步（局部）加载，这时只显示一部分缓存内容。或者像Linkin，页面没有加载出来并不显示空白的页面，而是显示内容前期的雏形和结构样式。类似的例子还有pinterest，显示图片的主色调。这样用户就不必一直焦灼地看着黑蒙版和转菊花，要全部数据加载完成后才能看到页面，极大缓解了用户的情绪。5.设计加载动画，加载小游戏，打发等待时间。

三、模态弹窗

和模态加载类似，也是在主页面上覆盖蒙版，让主页面处于不可操作的状态，并临时弹出弹窗，在弹窗层进行相应交互后方可返回主页面。比如告知用户进程的状态，数据结果反馈，错误提示，重大操作（不可逆）再确认等等。

问题：对用户操作流可能有干扰。用户可能不需要每次都被提醒。

方案：1.提供无模态反馈，将提示状态直接在页面中显示。并不刻意将用户的注意力强行拉到跳出的模态弹窗上，而是保留在操作的页面上。2.对某些并非每次都需要提醒的弹窗中增加下次不再提醒的选项，减少对用户的干扰。

总之

使用蒙版让用户脱离了原来的页面而转移到蒙版上层的内容，多多少少对用户的操作流和体验有干扰作用，让用户一时无法自由地使用产品。所以一定要慎重使用，并时常停下来想一想是否有更好的方式代替或简化，让用户不丧失对产品的控制权，并在直观易用的使用过程中享有更加愉悦、美好的体验。