{ "_description": "本文件由 data/ 生成：请改动来源文件，不要改这里。各字段的证据边界见接入指南。", "schemaVersion": "1.0.0", "kind": "entry", "locale": "zh-CN", "id": "coach-marks", "name": { "zh": "蒙层引导", "en": "Coach Marks" }, "page": "https://designvocabulary.com/zh/entries/coach-marks/", "self": "https://designvocabulary.com/zh/entries/coach-marks.json", "alternates": { "zh-CN": "https://designvocabulary.com/zh/entries/coach-marks.json", "en": "https://designvocabulary.com/en/entries/coach-marks.json" }, "site": { "catalogSchemaVersion": "0.1.0", "entries": 158, "index": "https://designvocabulary.com/zh/entries/index.json", "query": "https://designvocabulary.com/api/query?lang=zh", "guide": "https://designvocabulary.com/zh/agents/", "llms": "https://designvocabulary.com/llms.txt" }, "provenance": { "sourceBacked": [ "entry.definition" ], "editorial": [ "entry.boundary", "entry.signature", "entry.when", "entry.when_not", "entry.tradeoff", "entry.comparison", "entry.rules", "entry.relations", "entry.implementationNote", "entry.behavior" ], "scope": "定义参考以上来源；数字界面示例、选择建议、条件关系及配方由本样例编辑，尚未经用户研究验证。", "editorialStatus": "drafted", "specimenData": "fictional", "specimenNote": "示例为原创虚构界面；定义附来源，用法与配方为编辑建议。", "sources": [ { "id": "coachmarks-nng-overlay", "url": "https://www.nngroup.com/articles/mobile-instructional-overlay/", "title": "Nielsen Norman Group · Instructional Overlays and Coach Marks for Mobile Apps (Aurora Harley, 2014-02-16)", "checkedAt": "2026-10-20", "archive": { "status": "unconfirmed", "confirmed": false, "url": null, "capturedAt": null, "lookupUrl": "https://web.archive.org/web/20261020*/https://www.nngroup.com/articles/mobile-instructional-overlay/" } }, { "id": "coachmarks-nng-tutorials-contextual", "url": "https://www.nngroup.com/articles/onboarding-tutorials/", "title": "Nielsen Norman Group · Onboarding Tutorials vs. Contextual Help (Page Laubheimer, 2023-02-12)", "checkedAt": "2026-10-20", "archive": { "status": "unconfirmed", "confirmed": false, "url": null, "capturedAt": null, "lookupUrl": "https://web.archive.org/web/20261020*/https://www.nngroup.com/articles/onboarding-tutorials/" } } ], "lists": [], "ordered": false, "listDisclaimer": "席位号是编辑位置，不是评分、排名或人气统计；清单未收满时保持原样，不补足。" }, "entry": { "id": "coach-marks", "type": "interaction", "name": { "zh": "蒙层引导", "en": "Coach Marks" }, "aliases": [ "Instructional Overlay", "Coach Mark", "UI Hint Overlay", "新手蒙层", "功能指引" ], "granularity": "component", "intents": [ "discover-capabilities", "inform" ], "tags": [ "新手引导", "蒙层", "提示", "首次使用", "功能发现" ], "definition": "在真实界面上方盖一层半透明蒙层，把某个控件或区域挖空高亮，并在旁边用一两句话和箭头说明它的用途；用户看完关闭蒙层后才回到界面操作。", "boundary": "蒙层引导是叠在真实界面上的注释，指向的就是用户眼前的那个控件；它不是渐进式披露——渐进式披露把次要内容收起来、等用户需要时再展开，改变的是界面本身给出多少信息，而蒙层引导不隐藏也不展开任何内容，只是对已有控件加注解。它也不是引导教程（onboarding tour）：教程是一连串按顺序推进的讲解页或步骤，通常在首次启动时整体播放；单个蒙层引导只解释一处交互，最好在用户即将用到它时出现。把多个蒙层串成一组连续播放，就已经变成了教程，并会带上教程的问题。它也不同于悬停提示（tooltip）：tooltip 由用户主动悬停或聚焦触发，不遮挡界面其余部分。", "signature": [ "半透明蒙层覆盖界面，只把目标控件挖空或高亮", "简短文字加箭头或圆圈，直接指向界面上的真实元素", "蒙层本身不可操作，关闭后才回到界面" ], "when": [ "某个手势或控件位置不直观，用户第一次遇到时很可能找不到", "界面新增了一个重要功能，需要在不改动布局的前提下指出它", "可以在用户即将用到该功能的时刻触发，而不是在启动时统一播放" ], "when_not": [ "界面本身就需要靠说明才能看懂，应先改设计而不是加注解", "一次要解释很多处，蒙层被串成一长串连续步骤", "每次打开都重复出现，或关闭后再也找不回来", "注解的样子与真实按钮太像，用户试图点击注解本身" ], "tradeoff": "蒙层引导能在不改动布局的情况下把注意力引到一个具体控件上；代价是它打断用户、要求用户先记住说明再去操作，而多数人会尽快关掉它。一次解释的东西越多，记住的就越少，界面也越显得复杂。", "comparison": { "focus": "在真实界面上指出一处不直观的交互", "mechanism": "半透明蒙层高亮目标控件并附简短注解", "cost": "打断操作、依赖记忆，常被直接关掉" }, "sources": [ { "id": "coachmarks-nng-overlay", "title": "Nielsen Norman Group · Instructional Overlays and Coach Marks for Mobile Apps (Aurora Harley, 2014-02-16)", "url": "https://www.nngroup.com/articles/mobile-instructional-overlay/", "claim": "该文把 coach mark 描述为常在首次启动时出现、以透明叠层解释界面某部分的 UI 提示；指出用户很少阅读说明，一次展示太多提示会加重记忆负担，连续弹出的提示会让用户更快地关掉它们并觉得应用复杂，提示还可能被误认为可点击的界面元素；建议每条提示只讲一个交互、在合适的时刻逐条出现、以图为主少用文字，并在视觉上与真实界面区分。本词条的定义、适用条件与规则据此转述。", "checkedAt": "2026-10-20", "archive": { "lookupUrl": "https://web.archive.org/web/20261020*/https://www.nngroup.com/articles/mobile-instructional-overlay/", "status": "unconfirmed", "checkedAt": "2026-10-20T07:58:33.535Z", "error": "save-request-failed" } }, { "id": "coachmarks-nng-tutorials-contextual", "title": "Nielsen Norman Group · Onboarding Tutorials vs. Contextual Help (Page Laubheimer, 2023-02-12)", "url": "https://www.nngroup.com/articles/onboarding-tutorials/", "claim": "该文区分由系统决定时机推送的\"push revelations\"（如引导教程）与在用户此刻需要时出现的上下文帮助（\"pull revelations\"），认为教程常被跳过、难以在需要时回忆，并强调帮助必须易于关闭、也易于再次找回，还建议配合渐进式披露、避免要求用户记住多步说明。本词条据此区分单个蒙层引导与引导教程，并给出\"在用到时出现、关闭后可找回\"的建议。", "checkedAt": "2026-10-20", "archive": { "lookupUrl": "https://web.archive.org/web/20261020*/https://www.nngroup.com/articles/onboarding-tutorials/", "status": "unconfirmed", "checkedAt": "2026-10-20T07:58:35.638Z", "error": "save-request-failed" } } ], "relations": [ { "target": "progressive-disclosure", "kind": "alternative", "condition": "界面上有用户暂时不需要、但之后会用到的功能", "reason": "渐进式披露通过收起与展开调整界面本身的信息量，蒙层引导则保持界面不变、在上面加注解；能用前者让功能自然出现时，通常不必再加一层说明。", "basis": "editorial" }, { "target": "empty-state", "kind": "alternative", "condition": "用户第一次进入一个还没有内容的页面", "reason": "空状态本身就是解释该页用途、给出第一步操作的位置，不需要再盖一层蒙层去讲同一件事。", "basis": "editorial" }, { "target": "cognitive-load", "kind": "informs", "condition": "一次要介绍多个功能", "reason": "用户要先记住说明再去操作，提示越多越难记住，因此每次只讲一处。", "basis": "editorial" }, { "target": "nagging", "kind": "misused_as", "condition": "蒙层在用户关闭后反复出现，或被用来推广与当前任务无关的功能", "reason": "解释交互的注解一旦变成反复打断的推广，就成了骚扰式提醒。", "basis": "editorial" } ], "rules": [ { "when": "需要介绍多处交互", "instruction": "每次只用一个蒙层讲一处，在用户即将用到它的时刻出现，不要串成连续播放的一组。", "strength": "recommend", "basis": "editorial" }, { "when": "蒙层出现时", "instruction": "提供明显的关闭方式，关闭后不再自动重复，并在帮助入口里保留再次查看的方式。", "strength": "recommend", "basis": "editorial" }, { "when": "设计注解的外观", "instruction": "让注解在样式上与真实控件明显不同，避免用户把说明当成按钮去点。", "strength": "recommend", "basis": "editorial" } ], "behavior": { "states": [ "hidden", "shown", "dismissed" ], "a11y": [ "蒙层出现时焦点移到说明文字上，关闭后回到被高亮的控件", "说明内容可被读屏读出，关闭按钮可用键盘触发并支持 Esc", "不只依赖箭头与挖空的视觉位置，文字中写明所指控件的名称" ], "motion": "蒙层淡入淡出即可；尊重减少动态效果的系统设置" }, "demo": null, "version": "0.1.0", "editorialStatus": "drafted", "requirements": [], "demoCapabilities": [], "implementationNote": "本词条尚无可操作示例；插画为编辑示意，展示蒙层挖空高亮单个控件并附简短注解，不代表已验证的实现。应用到产品前仍须实测关闭后的焦点去向、再次查看的入口，以及注解是否会被误当作可点击元素。", "image": { "src": "/images/coach-marks.webp", "alt": "一张名为 FIELDNOTES 的虚构手机界面示意：整个界面被一层半透明深色蒙层覆盖，只有右下角一个圆形按钮被挖空照亮，旁边一条手绘风格的弯曲箭头指向它，箭头尾端是几条灰色占位文字和一个关闭标记。" }, "searchTerms": [ "onboarding", "overlay", "hint", "first use", "feature discovery" ] } }