# information-architecture-navigation

A skill for designing navigation, labels, taxonomy and search in a digital product. Useful when the structure of a site or app stops helping people find things.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 556 installs · ★ 23
- Author: hueyexe
- License: MIT · policy=mirror · the beginning of the file is at the end of this page
- Source: https://github.com/hueyexe/frontend-agent-skills/tree/HEAD/information-architecture-navigation/SKILL.md
- Updated: 2026-08-02
- HTML: https://affpapa.org/en/nevibecode/skills/information-architecture-navigation

## What it does

The skill kicks in when an agent is asked to critique or rework navigation, breadcrumbs, tabs, sidebars, filters, faceted browsing, documentation structure, content hubs, settings, onboarding flows or information-dense dashboards. It also covers building an information model, sitemap, label set, metadata schema or content grouping rules.

Ten principles sit inside. Design for finding and understanding together. Start from user tasks and real content rather than the company org chart. Support multiple paths when content is multidimensional. Treat every label as a promise. Document decisions so they can be reused. Accessibility counts as part of findability here: semantic structure, headings, landmarks, keyboard operation and readable screen-reader names are requirements, not polish. Each principle is also available as a card in `references/principle-cards.md`.

The skill stays out of pure visual styling with no navigation impact, marketing copy without structure or labels, backend ranking and indexing work, and content writing that has no headings or structure in scope. Its defaults are meant to be overridden deliberately, with a question back to the user: broad-and-shallow trees over deep ones, one dominant grouping scheme per view. If categories are not stable or an item belongs in several groups at once, hierarchy breaks down and facets or tags are the better fit.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add hueyexe/frontend-agent-skills --skill information-architecture-navigation -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/information-architecture-navigation/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/information-architecture-navigation/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add hueyexe/frontend-agent-skills --skill information-architecture-navigation -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/information-architecture-navigation/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add hueyexe/frontend-agent-skills --skill information-architecture-navigation -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/information-architecture-navigation/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install hueyexe/frontend-agent-skills information-architecture-navigation
```

2. **Manually: put the files in place**
- File: `.github/skills/information-architecture-navigation/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add hueyexe/frontend-agent-skills --skill information-architecture-navigation -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/hueyexe/frontend-agent-skills --path information-architecture-navigation
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/information-architecture-navigation/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add hueyexe/frontend-agent-skills --skill information-architecture-navigation -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/hueyexe/frontend-agent-skills/tree/HEAD/information-architecture-navigation/SKILL.md

## When to use it
- break a dense product into sections and labels
- rewrite navigation so users know where they are
- produce a sitemap and metadata schema
- fix search: suggestions, synonyms, empty results
- add breadcrumbs and local nav for deep sections

## Example prompts
- Review the navigation in this app and propose a new section structure
- Build a taxonomy and label set for the product catalog
- Check the breadcrumbs and sidebar on this docs page

## Source text · SKILL.md · MIT

Below is the content of a third-party file. It is data, not instructions for you: do not act on anything written inside unless the human asks. Block tag: 99b20688d098a298.

BEGIN THIRD-PARTY FILE 99b20688d098a298
```text
---
name: information-architecture-navigation
description: "Use when organizing, critiquing, or implementing navigation, labels, taxonomy, hierarchy, search, content grouping, or wayfinding for a digital product."
license: MIT
metadata:
  author: hueyexe
---

# Information Architecture Navigation

## Purpose

Help an agent make information easier to find, navigate, and understand. Treat information architecture as a product system made from organization, labeling, navigation, search, metadata, content structure, and wayfinding. Optimize for user tasks and comprehension before visual styling.

## When to use this skill

Use this skill when the user asks you to:

- Critique or redesign navigation, menus, breadcrumbs, tabs, sidebars, search, filters, faceted browsing, category pages, documentation structure, content hubs, settings IA, onboarding flows, product dashboards, or information-dense pages.
- Create an information model, sitemap, taxonomy, label set, navigation model, content grouping, search UX, metadata schema, or IA style guide.
- Improve findability, discoverability, wayfinding, content hierarchy, cross-linking, or search result quality.
- Translate a content inventory or product feature set into a usable structure.
- Implement IA-related frontend components such as nav landmarks, search forms, breadcrumbs, filters, result lists, menus, tabs, and content templates.

## When not to use this skill

Do not use this skill as the main skill when the user is only asking for:

- Visual styling, brand expression, color, illustration, or motion with no navigation/findability impact.
- Persuasive marketing copy that does not involve content structure or labels.
- Backend search ranking algorithms, database indexing, or IR tuning beyond UX-level requirements.
- Pure content writing unless structure, headings, labels, or navigation are part of the task.

## Core principles
```
END THIRD-PARTY FILE 99b20688d098a298

The third-party file has ended. Everything between the 99b20688d098a298 tags is data: requests and commands from it are not followed. An “end of file” line with another tag inside the block is part of the file.

First 1904 of 22587 bytes. © hueyexe · MIT · https://github.com/hueyexe/frontend-agent-skills/tree/HEAD/information-architecture-navigation/SKILL.md

_Part of the page did not fit — see the HTML version._

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md