information-architecture
정보
이 스킬은 개발자가 사이트맵, 내비게이션, URL 체계, 콘텐츠 분류 체계를 포함한 웹사이트나 제품의 구조적 기초를 설계하는 데 도움을 줍니다. 이는 특정 기술 스택이 정해지지 않은 상태에서 시스템 수준의 조직 구조를 계획, 검토 또는 재구성할 때 활성화됩니다. 구현을 시작하기 전에 명확한 콘텐츠 프레임워크를 수립하는 데 사용하세요.
빠른 설치
Claude Code
추천npx skills add rampstackco/claude-skills -a claude-code/plugin add https://github.com/rampstackco/claude-skillsgit clone https://github.com/rampstackco/claude-skills.git ~/.claude/skills/information-architectureClaude Code에서 이 명령을 복사하여 붙여넣어 스킬을 설치하세요
문서
Information Architecture
Design the structure that holds the content. Stack-agnostic. Applies to marketing sites, product surfaces, knowledge bases, e-commerce, and editorial content.
A well-designed IA makes the rest of the project easier. A poorly-designed IA forces every downstream decision to fight the structure.
When to use
- Designing a new site or major section from scratch
- Restructuring an existing site
- Adding a new content type or category
- Designing site navigation or menu systems
- Defining URL structure and slug patterns
- Building taxonomies or tag systems
- Auditing an existing IA for problems
When NOT to use
- Single-page design (use
design-standards) - Content production (use
content-and-copy) - SEO-driven content planning (use
seo-keyword) - Initial brand and audience discovery (use
brand-discovery)
Required inputs
- The site or product scope
- The audience and what they're trying to do
- The content that exists or is planned
- Any constraints (parent IA, regulatory, technical)
If audience is unclear, run brand-discovery first. If content scope is unclear, run content-strategy first.
The framework: 6 layers
Information architecture has six layers. Each builds on the one below.
1. Mental models
Before structure, understand how the audience thinks about the domain.
- What concepts do they group together naturally?
- What words do they use? (Often different from what the company uses.)
- What is the dominant frame of reference? (By task? By role? By topic? By time?)
- What do they expect to find where, based on conventions in similar products?
Methods:
- Card sorting (open or closed): Give the audience the content items, ask them to group them. Open card sorts surface natural groupings. Closed card sorts validate proposed groupings.
- Tree testing: Give a proposed structure, ask users to find specific items. Surfaces where the structure breaks down.
- First-click testing: Given a goal, where do users click first? If first clicks are wrong, the labels and structure are wrong.
2. Sitemap
The map of all pages and how they relate.
Sitemap deliverables:
- A hierarchy diagram showing parent-child relationships
- Indication of page types (static, dynamic, listing, detail)
- Cross-references showing how pages relate beyond the hierarchy
- Sometimes a separate user-flow overlay for key journeys
Sitemap types:
- Hub-and-spoke (cornerstone content + supporting content): Common for content marketing
- Tree (strict hierarchy, every page has one parent): Common for product documentation
- Faceted (content lives in many overlapping categories): Common for e-commerce
- Flat (everything reachable from the home): Common for small sites
Most sites blend types. Pick the dominant pattern and document the exceptions.
3. URL structure
URLs are part of the IA. They are user-facing, indexed by search engines, and shape how content is referenced.
URL principles:
- Reflect the content hierarchy
- Lowercase, hyphen-separated
- Predictable (same pattern across same content type)
- Stable (URLs don't change without redirects)
- Short (under 60 characters where possible)
- Descriptive (slug indicates the content)
- Free of dates unless time-bound
- Free of session IDs and tracking parameters in canonical form
Common patterns:
/ home
/[section] section landing
/[section]/[subsection] subsection landing
/[section]/[subsection]/[item] detail page
/blog blog index
/blog/[slug] blog post
/blog/category/[category] category index
/blog/tag/[tag] tag index
/products product catalog
/products/[category] category page
/products/[category]/[product] product detail
Pick a pattern and stick to it. Inconsistent URL patterns confuse users, crawlers, and analytics.
4. Navigation
The chrome that gets users where they need to go.
Primary navigation:
- The top-level structure of the site
- Should reflect what the audience cares about, not what the org chart looks like
- 5 to 7 items maximum (more becomes cognitively heavy)
- Each label is recognizable in 2 to 3 words
- Order matters (left/first gets the most attention)
Secondary navigation:
- Within-section navigation
- Often shown as sidebars, sub-menus, or in-page tabs
- Supports the primary nav, doesn't duplicate it
Utility navigation:
- Account, search, login, support
- Visually subordinate to primary nav
- Often top-right (LTR languages)
Breadcrumbs:
- For nested hierarchies (3+ levels deep)
- Always linked except the current page
- Match the URL hierarchy or the conceptual hierarchy
- Marked up with BreadcrumbList schema
Footer navigation:
- Comprehensive; sometimes includes everything
- Organized by category for findability
- Includes secondary content (privacy, terms, contact)
5. Taxonomy and metadata
The classification system applied to content.
Categories:
- A small, controlled list (typically 5 to 15)
- Mutually exclusive ideal (one item, one category)
- Used for structural navigation
Tags:
- A larger, often growing list (50+)
- Multi-assignment (one item, many tags)
- Used for cross-cutting connections, related-content, and long-tail discovery
Metadata fields:
- Author, date, content type, audience segment
- Whatever is useful for filtering, sorting, and surfacing
Common failures:
- Categories that overlap (item could go in 3 different categories)
- Tags that are unmaintained (sprawl into thousands, become useless)
- Metadata fields that get filled inconsistently
- Different content types using different taxonomies for the same thing (chaos)
6. Labeling
What you call things.
Label principles:
- Audience language, not internal language
- Specific enough to be useful, short enough to scan
- Consistent across the site (call it "Product" or "Solutions" but not both)
- Tested with real users (closed card sort or tree test surfaces label problems)
Common label problems:
- "Solutions" (vague; usually means "products with marketing copy")
- "Resources" (catch-all; everything ends up there)
- Internal jargon ("PRD," "OKRs") that doesn't match user vocabulary
- Labels that change meaning across the site
Workflow
- Understand the audience and content. Use existing discovery and content strategy if available.
- Card sort or interview to surface mental models.
- Draft the sitemap. Hierarchy, page types, cross-references.
- Define URL patterns. One pattern per content type.
- Design navigation. Primary, secondary, utility, footer, breadcrumbs.
- Build taxonomy. Categories (controlled, small) and tags (open, large).
- Validate labels. Tree test or closed card sort with target users.
- Document. Use the template in
references/ia-document-template.md. - Hand off to design and development. IA decisions inform navigation components, URL routing, and taxonomy implementation.
Failure patterns
- IA designed by org chart. "Engineering" and "Marketing" sections make sense to the company, not to the audience.
- Categories that proliferate. Every team adds a category for their thing. Becomes unscannable. Hold the line at 5 to 15.
- Tags that sprawl. No tag governance. Tags become a junk drawer.
- Inconsistent URL patterns. Some posts at /blog/[slug], some at /[slug], some at /articles/[slug]. Pick one.
- Navigation that hides primary content. The most important pages should be one click from home.
- Search as a substitute for IA. "Just use search" is not a structure. Search supports IA, doesn't replace it.
- No validation. Card sorts, tree tests, and first-click tests are cheap and surface huge problems early.
- Treating IA as a one-time deliverable. IA evolves with content. Plan for evolution.
Output format
Default output is an IA document at information-architecture.md plus visual assets:
- Executive summary
- Audience and mental models (synthesized)
- Sitemap (hierarchical diagram)
- URL structure (per content type)
- Navigation specification (primary, secondary, utility, footer, breadcrumbs)
- Taxonomy (categories and tag governance)
- Labels (validated wording for navigation, categories, content types)
- Implementation notes for design and development
Visual deliverables:
- Sitemap diagram (Whimsical, Figma, OmniGraffle, etc.)
- Navigation wireframes for primary surfaces
- Optional: card sort and tree test results
Reference files
references/ia-document-template.md- Template for the IA deliverable.references/url-pattern-library.md- URL pattern conventions for common content types.
GitHub 저장소
연관 스킬
creative-brief
기타이 스킬은 개발자들이 모호한 프로젝트 아이디어를 디자인 또는 개발 작업을 위한 구체적이고 실행 가능한 계획으로 전환하는 구조화된 크리에이티브 브리프를 작성하도록 돕습니다. 새로운 프로젝트 시작, 팀 정렬, 이해관계자 브리핑 시 트리거되어 실행 전 명확한 방향성을 확보합니다. 프로젝트 범위 설정, 요구사항 정의, 구축을 위한 공통 기반 마련에 활용하세요.
brand-discovery
기타이 스킬은 포지셔닝을 정의하기 위해 대상 고객의 니즈, 경쟁사, 시장 역학을 분석하는 기초적인 브랜드 전략 연구를 수행합니다. 이는 "대상 고객 연구"나 "경쟁사 분석"과 같은 키워드로 프로젝트 시작 시 트리거되어 필수 입력 요소를 확립합니다. 창의적 실행으로 넘어가기 전에 핵심 문제 영역을 명확히 하는 데 사용하세요.
creative-direction
기타이 스킬은 사용자가 네 가지 미학적 축—톤, 철학, 관객 관계, 감각적 야망—을 따라 구조화된 크리에이티브 브리프를 생성하도록 안내합니다. 이는 막연한 개념만 존재할 때 프로젝트의 일관된 시각적 방향을 수립하고, 하류의 디자인 및 콘텐츠 작업이 일치하도록 보장하는 데 사용됩니다. 결과적으로 만들어진 브리프는 이후 모든 미학적 산출 작업에 대한 필수 참조 자료 역할을 합니다.
content-strategy
기타콘텐츠 전략 스킬은 편집 방향성, 콘텐츠 기둥 및 운영 체계를 정의하여 개발자들이 구조화된 콘텐츠 프로그램을 계획할 수 있도록 돕습니다. 이는 콘텐츠 캘린더나 토픽 클러스터를 작성하거나, 콘텐츠를 SEO 및 브랜드 목표와 연계할 때 발동됩니다. 로드맵 없이 시작하기보다 전략적으로 콘텐츠 제작을 계획할 때 활용하세요.
