菜单
Use when designing in-app contextual help: tooltips, help icons, links to docs, embedded video. Covers when to use each, the placement, and how to add help without cluttering.
默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。
决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/x3allamerican/design-skills-fleetsafety --skill contextual-help-design命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
Use when designing 404 pages and the broader empty-state pattern library. Covers tone, illustration, search recovery, and the difference between 'no data yet' and 'this URL doesn't exist'.
Use when designing A/B tests. Covers hypothesis-driven testing, sample-size calculation, the test-design template, and the cultural rituals that make testing productive.
Use when shipping any user-facing UI. Covers the non-negotiable accessibility baseline: contrast, focus states, semantic HTML, keyboard navigation, screen-reader support, motion preferences. The minimum to avoid embarrassment and ADA risk.
基于 SOC 职业分类
正在显示 SKILL.md
| name | contextual-help-design |
| description | Use when designing in-app contextual help: tooltips, help icons, links to docs, embedded video. Covers when to use each, the placement, and how to add help without cluttering. |
Help should be available without being intrusive.
Hover over '?' icon shows short explanation. Max 1 sentence. Link to docs for more.
Below the field, gray, 12px. For form labels that need clarification.
Persistent in app header / nav. Opens help in side drawer (better than new tab — doesn't lose context).
30-90 second product videos embedded inline. For complex features only.
Help text 5 paragraphs long. No help where it's needed. Help link buried in settings. Tooltips on EVERY field (noise).
Applied across the X3 Compass design system.