navigation_skill

Overview

This skill helps you organize app navigation, structure content hierarchies, and improve findability for SaaS products. It focuses on practical patterns—top bars, sidebars, command palettes, breadcrumbs, and URL conventions—to match user mental models. Use it to design menu systems, labels, and flat vs deep information structures that reduce cognitive load.

How this skill works

I inspect your product surface to map primary and secondary navigation, suggest grouping and labels, and recommend URL patterns that mirror the information architecture. I propose page types (dashboard, list, detail, settings), content hierarchy, and progressive disclosure so users can find tasks without thinking. I also identify search, filter, and breadcrumb needs and flag overly deep nesting or ambiguous labels.

When to use it

• At product inception to set navigation foundations
• When redesigning navigation or improving findability
• Before building menus, routes, or URL schemas
• When users report difficulty finding features or feel lost
• When adding new sections that might increase depth

Best practices

• Match navigation to user tasks and mental models, not internal org charts
• Prefer flatter structures; avoid more than 3 URL depth levels
• Use clear, specific labels; if you must explain a label, change it
• Show breadcrumbs for depth >2 and a page title answering “Where am I?”
• Expose primary actions prominently and use progressive disclosure for advanced options

Example use cases

• Design a sidebar + top-bar hybrid for a complex workspace app
• Convert an existing deep menu into 5–9 clear groups via card-sorting
• Define URL patterns and route names that mirror the IA for SEO and shareability
• Add a global command palette (Cmd/Ctrl+K) for power-user navigation and actions
• Create consistent page templates: dashboard, list, detail, settings, and empty states