Navigation Patterns

This gives Claude a solid framework for choosing and designing navigation patterns across platforms. It covers the main types (global, local, utility, contextual) with specific examples like tab bars, sidebars, and breadcrumbs, plus a decision matrix for matching patterns to situations. The real value is in the opinionated guidance: don't hide primary navigation in hamburger menus on desktop, keep active states accessible beyond just color, validate labels with first-click tests before you build. It treats navigation as an IA problem first and a UI problem second, which is the right order. Useful if you're designing a multi-screen product and need to think through navigation systematically rather than wing it screen by screen.

Install to Claude Code

npx -y skills add owl-listener/designer-skills --skill navigation-patterns --agent claude-code