Stats
Actions
Tags
From aidd-dev
Generates technical implementation plans from requirements, defines frontend component behavior as state machines, and extracts structured component inventories from design images.
How this skill is triggered — by the user, by Claude, or both
Slash command
/aidd-dev:01-planopusplannerThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Produces implementation plans from requirements, state machines for component behavior, and structured component inventories from design images.
Produces implementation plans from requirements, state machines for component behavior, and structured component inventories from design images.
Spawn the planner agent to execute this skill. For tools that do not support context: fork frontmatter: invoke the planner agent explicitly with this skill's content as the prompt.
| # | Action | When to use |
|---|---|---|
| 01 | plan | Turn requirements into a technical implementation plan saved to a task file |
| 02 | components-behavior | Define a frontend component's behavior as a state machine (Mermaid) |
| 03 | image-extract-details | Analyze a design image into a hierarchical component inventory |
The planner auto-adapts to the INPUT - do not ask the user to choose. Detect the input type and route; do NOT always fall to action 01.
03-image-extract-details (then feed the inventory into planning).02-components-behavior.01-plan.Actions may chain (e.g. extract from image, then plan). Read and follow each selected action file.
@actions/01-plan.md@actions/02-components-behavior.md@actions/03-image-extract-details.mdnpx claudepluginhub ai-driven-dev/frameworkTransforms text plans into interactive visual plans with diagrams, file maps, annotated code, and open questions. Use for multi-file, ambiguous, or UI-heavy work where a wrong direction is costly.
Creates structured visual planning documents with inline diagrams, code walkthroughs, file trees, and wireframes for multi-file or ambiguous work before implementation.
Generates production-ready frontend task breakdowns from UX design handoffs, Figma links, screenshots, or PRDs. Includes component inventory and state matrices for planning frontend work.