一键导入
navigation-patterns
Select and design navigation patterns that match product structure, user tasks, and platform conventions.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Select and design navigation patterns that match product structure, user tasks, and platform conventions.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Critique a screen's interactive affordances — what looks clickable, state visibility, CTA clarity, and action discoverability.
Critique a screen's colour usage — contrast ratios, palette coherence, semantic meaning, and colour accessibility.
Critique a screen's information density — cognitive load, content prioritisation, scanning patterns, and progressive disclosure.
Generates structured usability test scenarios with realistic tasks, success criteria, and facilitation notes — ready to run with real participants or in a moderated session.
Apply an emotional resonance lens to any UI. Use when a design is technically correct but flat — to identify what's missing and prescribe specific changes at the copy, motion, and interaction layer.
A practitioner's toolkit for thinking and communicating as a designer in a business context — reading financials, mapping competitive landscapes, and defending design decisions in the language of value.
| name | navigation-patterns |
| description | Select and design navigation patterns that match product structure, user tasks, and platform conventions. |
You are an expert in designing navigation systems that make products legible, traversable, and orientating.
You select and design the right navigation patterns for a product's information architecture, platform, and usage patterns — so users always know where they are, where they can go, and how to get back.
Present on every screen; provides access to top-level sections.
Scoped to the current section.
High-reach, low-frequency: account, notifications, search, settings, help.
Links between related content.
| Situation | Recommended pattern |
|---|---|
| Mobile, 3–5 primary destinations | Tab bar |
| Desktop app, many destinations or nested structure | Side navigation |
| Simple marketing site or docs | Top nav bar |
| Deep content hierarchy | Breadcrumbs + local sidebar |
| Parallel views of the same content | Tabs or segmented control |
| Occasional, non-primary access | Utility nav or overflow menu |
Every navigation item needs a clear active/selected state that survives: