浮层设计五步自查：分级→两问→三规→统词→定稿（作业卡）
方法桶双卡的作业卡（仓颉 RIA 六段，业主 2026-10-19 拍板加配）；同条主卡见末尾出处区。
R — Reading
“你跟程序员说’加个弹窗’，他想的跟你想的可能完全是两码事！“（约 4 至 8s） “能撤销，就别弹二次确认。……按钮别写’是’和’否’！用户只有两三百毫秒注意力，写清动作。“（约 88 至 99s）
出处：原视频，字幕逐字稿（库内 00_原文/douyin/2026-10-20-Vibe知识大赏丨别再管所有弹出来的东西都叫”弹窗”了）。
I — Interpretation
任何”从屏幕浮出来”的交互先过打扰度分级：Tooltip（悬停即现即散，零打扰，禁藏关键信息）＜Toast（自消失的状态反馈）＜Alert（顶部持续挂条）＜Popconfirm（就地二选一，不夺焦点）＜Modal（全屏变暗强制决策，最高打扰）。选错级的两种病：打扰过重（用户心流被斩）与信息装不下（该用抽屉/页面硬塞弹窗）。内容量大时两问定形态——长短（弹窗常用三档宽 400、520、720；长表单/深内容→抽屉或新页）与对照需求（列表边看边改→抽屉；彻底换流程→新页）。三条防坑规约覆盖高频事故：蒙层禁关＋草稿自存（填表弹窗）、可撤销禁二次确认（删除流）、按钮文案写动作不写是否（注意力只有两三百毫秒）。
A1 — Application Example（片内示例，非作者实测）
片内三例：点删除→居中 Modal”取消还是删除”二选一；一天删几十条→换 Popconfirm 就地问；退票流程按钮从”是/否”改成”放弃退票""确认扣费并退票”。另给弹窗宽度三档 400、520、720 与”列表点开一条改完还看下一条用抽屉”的判断口径。
A2 — Future Trigger
情境：1. 自家网页工具（题库、英语站、预报面板）加提示/确认交互前；2. 需求评审听到”加个弹窗""弹个提示”这类含糊话；3. 用户反馈”老被弹窗打断""点了外面内容没了”；4. 设计推送/预警的打扰分级时借框架。 语言信号：“加个弹窗""二次确认要不要""这个提示放哪”（英文：add a modal / confirm dialog / toast or alert?）。 相邻区分：本卡管一次交互里浮层形态的选择，不管组件库 API 用法；≠通知推送分级规范（打扰度思想可迁移，具体机制不同域）。
E — Execution
- 分级：写下这次要传达的信息量与允许的打扰度，从 Tooltip、Toast、Alert、Popconfirm、Modal 里选位。完成标准：有明确组件名，不出现裸”弹窗”二字。判停点：信息要用户决策才走得下去→才有资格用 Modal 及以上，否则降级。
- 两问定形态（内容大时）：长短放不放得进三档弹窗？要不要边看边改（对照原列表）？完成标准：得出”弹窗/抽屉/新页”三选一。
- 三规红线扫描：填表弹窗可误关吗（关蒙层＋无草稿保存＝红旗）？删除操作可撤销吗（可撤销还弹确认＝红旗）？按钮写的是”是/否”还是动作？完成标准：三问全过或已整改。
- 统词：需求文档、任务票统一改用组件实名。完成标准：搜索文档零处”加个弹窗”。
- 定稿自检：把结论读一遍——“用 X 组件，因为信息量 Y、打扰预算 Z”。完成标准：一句话能说服开发。 输入契约：交互需求一句话＋信息内容；输出契约：组件选型结论＋三规检查结果。
B — Boundary
- 不要用的场合：移动端原生手势体系（下拉通知等另成一套）；营销弹层/广告类（目标就是强打扰，分级尺反着拿）；纯静态文档站（几乎无浮层决策）。
- 作者盲区：全片是通用常识速查，无出处、无实测数据；宽度三档与”90% 的人踩过坑”都是经验话术；未覆盖无障碍（Modal 焦点管理、屏幕阅读器）问题——真正上线前还要补 a11y 检查。
- 易混：本卡≠组件库对比评测；≠Toast 库选型。
📺 Ludi《Vibe知识大赏丨别再管所有弹出来的东西都叫”弹窗”了！》，抖音，2026-10-19 · 原视频 · 库内 2026-10-20-Vibe知识大赏丨别再管所有弹出来的东西都叫“弹窗”了 · 主卡对照 卡片/方法/10-20-浮层组件按打扰程度选型-三问三坑 登记元数据（简）：capability_id: cap.kbv2.overlay-component-triage · importance: medium（自家网页工具评审备用）· intents: [UI浮层选型, 需求评审澄清] · keywords: [弹窗, Modal, Toast, 抽屉, Popconfirm]