What does /draft-ia do?

It designs information architecture with navigation, content hierarchy, sitemap, and taxonomy with rationale per decision.

How do I install /draft-ia?

Install Tonone for Claude Code via tonone.ai/get-started.

AI Information Architecture and Sitemap

Products grow features without growing their IA. New screens get added wherever they fit. The navigation gets a new tab, then a new dropdown, then an overflow menu, then a search-only path because nothing fits in the navigation anymore. Users cannot find what they need; new hires cannot orient; the team adds breadcrumbs and search to compensate for the structure that was never designed.

The /draft-ia skill designs information architecture. Navigation structure, content hierarchy, sitemap, and taxonomy for the product or feature set. Maps where every page lives and how users navigate between them. Produces a Mermaid sitemap with written rationale for every structural decision.

What IA includes

Navigation: primary, secondary, utility. Content hierarchy: how items group and parent. Sitemap: every page placed. Taxonomy: vocabulary for categories, tags, statuses. Rationale: per structural decision so future additions can apply the same logic.

Tonone's /draft-ia skill designs information architecture with navigation, hierarchy, sitemap, and taxonomy plus rationale per decision.

DraftUX Design

/draft-ia

Designs information architecture: navigation structure, content hierarchy, sitemap, and taxonomy for a product or feature set. Maps where every page and section lives and how users navigate between them. Produces a Mermaid sitemap and written rationale for every structural decision.

When redesigning navigation and need a structural …

DraftUX Design

/draft-flow

Maps a user flow as a Mermaid diagram: the sequence of screens and decision points a user moves through to accomplish a specific goal, with error states, branch conditions, and explicit entry and exit points. Grounded in the job the user is trying to accomplish rather than the features being built.

When a feature needs a flow diagram before visual …

DraftUX Design

/draft-wireframe

Produces screen-level wireframes: text-based layouts and Mermaid diagrams showing content hierarchy, component placement, primary and secondary actions, and interaction annotations. Specifies structure and behavior without visual design, so engineering can estimate and Form can design with a shared structural reference.

When a feature needs a lo-fi layout specification …

DraftUX Design

/draft-patterns

Reference guide for UX interaction patterns — forms, navigation, loading states, and empty states. Surfaces do/don't tables with severity ratings and code examples.

When you need best practices for a specific intera…

Install

/draft-ia ships with the Draft agent in Tonone for Claude Code.

1. Add to marketplace

$ claude plugin marketplace add tonone-ai/tonone

2. Install Draft

$ claude plugin install draft@tonone-ai

Frequently asked questions

What does /draft-ia do?: It designs information architecture with navigation, content hierarchy, sitemap, and taxonomy with rationale per decision.
How do I install /draft-ia?: Install Tonone for Claude Code via tonone.ai/get-started.