Convert design specs into implementation plans with checklists and code snippets.
npx skills add https://github.com/abdias98/DevFlow --skill devflow-plan
Please help me install this Agent Skill. Skill: devflow-plan Source: https://github.com/abdias98/DevFlow/tree/main/.agents/skills/devflow-planner Command: npx skills add https://github.com/abdias98/DevFlow --skill devflow-plan
Reads a design spec and breaks it down into atomic implementation tasks with checkboxes, file maps, complete code snippets, and pre-written commit messages. For UI features, generates an HTML wireframe mockup before writing the plan. Produces a plan document in docs/devflow/plans/. USE WHEN: create implementation plan, break down tasks, task planning, devflow plan phase, create checklist from spec.
Provide a design spec path or describe the feature to plan, and let the Planner generate a complete plan and mockups in docs/devflow/plans.
High-intent search queries and answers about installing and using this skill.
To generate UI wireframe mockups from a design spec, describe the UI feature you need to plan. The system automatically produces an HTML wireframe mockup to guide implementers before generating the detailed task breakdown and file maps.
To create ready-to-paste commit messages for implementation tasks, process your design spec through the planner. It automatically generates per-task checkpoints and pre-written commit messages alongside the structured task breakdown for traceability and review.
To generate UI wireframe mockups from a design spec, describe the UI feature you need to plan. The system automatically produces an HTML wireframe mockup to guide implementers before generating the detailed task breakdown and file maps.
The best way to break down architecture alignment into atomic tasks is to input your design spec. The system creates a structured task breakdown with dependencies, milestones, and complete code snippets, outputting a comprehensive plan document.
You do not need a specific tech stack to create a devflow plan from a spec. The planner applies to feature planning and TDD-driven implementation across common tech stacks, generating file maps and code snippets without requiring specific dependencies.
haidonglethqbGenerate structured implementation plans and roadmaps from brief task descriptions.
AndrewChang-cpuLoad and review implementation plans, then execute tasks with verifications.
leessjuRender live HTML mockups in a browser for visual UI layout brainstorming.
royhenengelGenerate spec-driven implementation plans for software development tasks.
