What is the plan-design-review skill?
The gstack plan-design-review skill is an interactive designer's review of a plan, not of a live site. It rates each design dimension from 0 to 10, explains what would make it a 10, then fixes the plan to get there. It works in plan mode and starts by confirming what to review.
plan-design-review casts the AI coding agent as a senior product designer reviewing a plan, not a live site. SKILL.md says the job is to find missing design decisions and add them to the plan before implementation.
Its stated output is a better plan, not a document about the plan. It rates each design dimension from 0 to 10, explains what would make it a 10, and then edits the plan to get there.
How a review starts
- A scope gate comes first and overrides everything else in the skill.
- The first tool call is AskUserQuestion, to confirm what to review.
- Choices are the current branch diff, a plan or design doc, or a specific page, file or path.
- In plan mode it skips the question, auto-selects the active plan and announces the target in one line.
How the review runs
- A pre-review audit reads the git log, the plan, CLAUDE.md and DESIGN.md, and exits early if the plan has no UI scope.
- Step 0 rates the plan's overall design completeness from 0 to 10, checks DESIGN.md status and asks which areas to focus on.
- Step 0.5 generates visual mockups with the gstack designer when it is available and the plan has UI.
- Seven design passes follow, each rated 0 to 10, with one AskUserQuestion per issue before any edit.
Principles it reviews against
- Empty states are features, so each needs warmth, a primary action and context.
- Specificity over vibes: name the font, the spacing scale and the interaction pattern.
- Accessibility must be specified in the plan, or it will not exist.
- Subtraction is the default: an element that does not earn its pixels gets cut.
Who the plan-design-review skill is for
Best for
- Teams with a written plan that has UI or UX parts and needs review before building.
- Reviewers who want numbered scores and a clear picture of what a 10 looks like.
- Plan mode sessions, where the skill selects the active plan on its own.
- Plans that still need a visual direction, which design shotgun can explore first.
Not for
- Live site visual audits. SKILL.md sends those to /design-review, covered by the design review skill.
- Building a design system from nothing. SKILL.md recommends /design-consultation first when no DESIGN.md exists, which gstack design consultation covers.
- Making code changes. The skill states it makes none and does not start implementation.
Use it with UiChemy
If the screens are built in Figma, UiChemy Figma to WordPress converts the file into editable WordPress pages. Click Get Started on uichemy.com.
How to install gstack Plan Design Review Skill: Score a UI Plan 0 to 10
git clone --single-branch --depth 1 https://github.com/garrytan/gstack.git ~/.claude/skills/gstack && cd ~/.claude/skills/gstack && ./setupMeet the requirements
The README names Git, Bun v1.4.2 or newer (setup refuses Bun older than 1.3.3), Claude Code, and Node.js on Windows only.
Install gstack
Run the clone and setup command above. plan-design-review is one of the skills in that collection and arrives with it.
Choose agents
Plain ./setup covers Claude Code. Run ./setup --host auto, or --host codex, then ./setup --status to list each install.
Run the review
Type /plan-design-review with your plan open, and answer the scope question. Copilot and Antigravity CLI use the prefixed name /gstack-plan-design-review.
Check that it loaded
Open a short plan that includes a settings screen and run /plan-design-review. It should ask what to review, wait for your pick, rate the plan from 0 to 10, and ask one question per issue before editing the plan.
Key features
- Review of a plan, not a siteThe skill reviews a plan and not a live site. The description separates it from /design-review, which handles visual audits of a running page.
- Scores from 0 to 10Each design dimension gets a rating from 0 to 10, with an explanation of what would make it a 10, so the gap to good is concrete.
- Fixes the planAfter scoring, it fixes the plan to close the gaps. SKILL.md says its output is a better plan, not a document about the plan.
- Hard stop scope gateA gate runs first and overrides everything else. It asks what to review through AskUserQuestion and waits for your answer before any tool runs.
- Three review targetsThe gate offers the current branch diff, a plan or design doc you paste or point to, or a specific page, file or path.
- Plan mode auto-selectionIf the host signals plan mode, the skill auto-selects the active plan, announces the target in one line, and lets you name a different one.
- One decision per issueEvery gap gets its own recommendation and its own question. DESIGN.md supplies the recommendation, but never the approval, so obvious fixes still need your yes.
- Initial completeness ratingStep 0 rates the whole plan from 0 to 10, as in a 3 out of 10 because it never specifies what the user sees, and explains what a 10 looks like for that plan.
- Mockups by defaultWhen the gstack designer is available and the plan has UI, it generates mockups without asking. It skips them if the designer is unavailable, the plan has no UI scope or you ask for text only.
- Show me what 10/10 looks likeWhen a dimension rates below 7 and the design binary is ready, it offers a mockup of the improved version to make the gap visible.
Frequently asked questions
What is the gstack plan-design-review skill?
It is an interactive designer's review of a plan, in the gstack collection. It rates each design dimension from 0 to 10, explains what would make it a 10, and edits the plan, all before any implementation starts. It makes no code changes itself.
How do I install plan-design-review?
Install gstack. Run the README clone command, which places the repo in ~/.claude/skills/gstack, then run ./setup in that folder. The skill is part of the collection, so the same install gives you /plan-design-review next to the other gstack skills. The README says setup took 31 seconds on a 4-vCPU Linux cloud machine.
What does plan-design-review ask first?
It asks what to review, through AskUserQuestion, and stops until you answer. Options are the current branch diff, a plan or design doc, or a specific page, file or path. In plan mode it skips the question and announces the active plan instead.
How is it different from design-review?
plan-design-review checks a plan before implementation and edits the plan itself. SKILL.md sends live site visual audits to /design-review instead. The README describes /design-review as the same audit, followed by fixes to the code, with atomic commits and before and after screenshots.
What happens in plan mode?
If the host signals plan mode, the skill skips the question, auto-selects the active plan or the plan just drafted, and announces the choice in one line. You can interrupt, and a target you name wins over the auto-selected one.
Which agents does gstack support?
The README table lists Claude Code at the full tier. Codex CLI, OpenCode, Cursor, Factory Droid, Kiro, GitHub Copilot CLI and Antigravity CLI are experimental, while OpenClaw, Hermes, Slate and GBrain are instruction-only, meaning setup installs nothing and prints what to copy. Pick a host with the --host flag.
Which phrases trigger plan-design-review?
The frontmatter lists design plan review, review ux plan and check design decisions. The description adds review the design plan and design critique, and says to suggest it proactively when a plan has UI or UX parts that need review before implementation.
What license does gstack use?
The repository is MIT licensed. The README describes gstack as twenty-three specialists and eight power tools, all slash commands, all Markdown, all free, MIT license. plan-design-review is one of those skills, so it ships under the same MIT terms as the rest of the collection.