Skip to main content
skill CX Codex

information-architecture · owl-listener — Claude Code skill: content structure

A skill that designs content structure: sitemap, navigation model, taxonomy and content types. Useful when you need to organise what already exists.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add Owl-Listener/designer-skills --skill information-architecture -a claude-code
Open on GitHub

What information-architecture does

The skill covers the structure underneath a product: how content and features are categorised, labelled and linked. Deliverables include a sitemap with screen and content-type hierarchy, a navigation model split into global, local, utility and contextual links, a taxonomy built from user vocabulary, and a content model listing types with their attributes and relationships.

The process runs in five steps: audit existing content, research with card sorts and tree testing, sketch candidate hierarchies, validate with target users, then document the sitemap and content model for the team. Heuristics cover findability, discoverability, wayfinding, scent, and depth versus breadth. The skill advises keeping primary content to three levels and favours moderate depth over wide flat structures.

This one is scoped to organising what exists. For the interface that exposes the structure, the description points to a separate navigation-patterns skill in interaction-design; for grouping evidence from users it points to card-sort-analysis in design-research. If you are designing a structure from scratch rather than sorting existing content, expect to install those separately.

What it helps with

  • sort existing content into sections and levels
  • build a sitemap with content types and relationships
  • test category labels against real user vocabulary
  • spot orphaned pages and redundant paths
  • write a content model the team can work from

Example prompts for the agent

  • map our site structure and produce a sitemap
  • review the navigation model for wayfinding gaps
  • propose a taxonomy for articles and products

How to install information-architecture

1Skills CLI (Vercel)

npx skills add Owl-Listener/designer-skills --skill information-architecture -a claude-code

2Manually: put the files in place

~/.claude/skills/information-architecture/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/information-architecture/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about information-architecture

How do I install information-architecture in Claude?

Run npx skills add Owl-Listener/designer-skills --skill information-architecture -a claude-code. The skill file lands at ~/.claude/skills/information-architecture/SKILL.md.

What does information-architecture do?

It designs content structure: sitemap, navigation model, taxonomy and content types. It helps you organise existing content and check findability before navigation gets built.

How is information-architecture different from navigation-patterns?

This skill handles structure — what lives where and what it is called. navigation-patterns from interaction-design covers the interface that exposes that structure.

Source text

SKILL.md · MIT
---
name: information-architecture
description: Design content structure, hierarchy, labelling, and the navigation model. Use when organising what exists. For the UI that exposes it use `navigation-patterns` (interaction-design); for user-generated grouping evidence use `card-sort-analysis` (design-research).
---
# Information Architecture
You are an expert in organizing information so users can find what they need and understand where they are.
## What You Do
You design the underlying structure of a product — how content and features are categorized, labeled, and connected — and produce the deliverables that communicate that structure to teams.
## Core IA Deliverables
### Sitemap / Content Inventory
- Hierarchical map of all screens, sections, and content types
- Shows parent/child relationships and navigation depth
- Distinguishes primary navigation from utility navigation
- Flags orphaned content, redundant paths, and dead ends
### Navigation Model
- **Global navigation**: present everywhere (header nav, bottom tab bar)
- **Local navigation**: contextual to the current section (sidebar, tabs, breadcrumbs)
- **Utility navigation**: account, settings, help — high reach, low frequency
- **Contextual links**: inline links between related content
### Taxonomy & Labeling
- Category names derived from user vocabulary (card sort data, interview language)
- Consistent labeling across navigation, headings, search, and empty states
- Avoid internal jargon — test labels with users, not colleagues
### Content Model
- Define content types (article, product, event, profile…)
- Attributes of each type (title, author, date, category, media…)
- Relationships between types (article belongs to category, event has speakers…)
## IA Heuristics
- **Findability**: can users locate any item in under 3 clicks from any entry point?
- **Discoverability**: do users encounter relevant content they weren't explicitly seeking?
- **Wayfinding**: do users always know where they are, how they got there, and how to get back?
- **Scent**: do navigation labels and category names accurately predict what's inside?
- **Depth vs breadth**: prefer shallower hierarchies (3 levels max for primary content); wide flat structures are harder to navigate than moderate depth with clear labels
## Process
1. **Audit**: inventory existing content and map current structure
2. **Research**: card sort (open for new structures, closed for validation), tree testing
3. **Draft**: sketch candidate hierarchies; evaluate against findability and user mental models
4. **Validate**: tree test the draft IA with target users before building navigation components
5. **Document**: produce sitemap and content model for the team
## Common Mistakes
- Building IA around org structure rather than user tasks
- Conflating navigation structure with URL structure
- Designing IA from the homepage outward — design from tasks inward
- Assuming search substitutes for IA — search fails when users don't know the right terms
## Best Practices
- Conduct open card sorts before designing new structures; closed card sorts to validate
- Tree test early — it's cheap and reveals findability failures before they're built
- Revisit IA as content volume grows; structures that work at launch often break at scale
- Label from user vocabulary; measure with first-click tests on key tasks

© Owl-Listener · MIT · Owl-Listener/designer-skills

Similar skills

Everything for Design →

information-architecture by other authors comes first.

information-architecture julianoczkowski Defines product structure and navigation before visual design begins. Bridges the gap between a design brief and actual frontend code. CX Codex +1 5,900installs information-architecture dembrandt Keeps a large app navigable: what to call each entity, how screens map to the data model, and when to ask before a destructive action. CX Codex +1 889installs information-architecture aj-geddes Structures content, sitemaps, and taxonomies for web apps and documentation hubs. It guides your AI agent through a four-stage process from card sorting to tree testing. CX Codex +1 634installs information-architecture-navigation hueyexe 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. CX Codex +1 556installs organize ghaida Designs information architecture, navigation models, and taxonomy systems. Helps when users get lost or struggle to locate features. CX Codex +1 2,700installs site-architecture coreyhaines31 Plans a site's page hierarchy, navigation, URL patterns and internal links. Useful before you build, or when visitors can't find their way around. CX Codex +1 122,900installs wireframing manutej A skill for interface design work: it walks from rough sketches and screen structure to a layout close to the final design. CX Codex +1 566installs renaissance-architecture bencium A skill that pushes the agent toward first-principles design instead of "X but for Y". Useful when you plan features, pick a stack or review UI. CX Codex +1 3,300installs ui-context-and-scope dembrandt Defines rules for user orientation in deep navigation layouts: breadcrumbs, visual section borders, and persistent impersonation banners. CX Codex +1 842installs

From the same set109

diary-study-plan Walks you through designing a diary study: prompts, cadence, duration, participant criteria and an analysis frame. CX Codex +1 2,100installs a-b-test-design Walks you through planning an A/B test: hypothesis, variants, primary metric and sample size. Useful when a change can be measured quantitatively. CX Codex +1 2,100installs form-design Designs forms end to end, covering field order, grouping, validation, and accessibility. Useful when building anything from single inputs to multi-step flows. CX Codex +1 1,900installs aesthetic-usability Applies the Aesthetic-Usability Effect when visual polish affects perceived ease of use and trust. Use it to diagnose functional designs that still make a poor first impression. CX Codex +1 1,900installs critique-composition Critiques balance, negative space, visual rhythm, and gestalt grouping on rendered screens. Useful when layout hierarchy is solid but the spatial composition still feels off. CX Codex +1 1,900installs service-blueprint Maps how a service is delivered to users and behind the scenes. Use it to trace gaps between visible interactions, operations, and supporting systems. CX Codex +1 1,800installs critique-brand-consistency Compares a rendered screen against mood.md, voice.md and tokens.md, then points out where styling and copy drifted from the brand. CX Codex +1 1,800installs navigation-patterns Helps select and design navigation patterns such as tab bars, sidebars, and breadcrumbs. Useful when mapping user journeys across mobile and desktop interfaces. CX Codex +1 1,800installs

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor