plan-design-review

Reviews UI/UX design plans through seven interactive passes and fixes gaps before implementation.

Updated May 22, 2026
One-click install
npx skills add https://github.com/kitfunso/claude-config --skill plan-design-review-kitfunso
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: plan-design-review
Source: https://github.com/kitfunso/claude-config/tree/main/skills/plan-design-review
Command: npx skills add https://github.com/kitfunso/claude-config --skill plan-design-review-kitfunso

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Design plans often ship to engineering with missing interaction states, generic AI-slop patterns, unresolved responsive behavior, and no alignment with the existing design system, causing rework during implementation. ## Core Features & Use Cases - Seven Design Passes: Rates information architecture, interaction states, user journey, AI slop risk, design system alignment, responsive/accessibility, and unresolved decisions on a 0-10 scale, then fixes each gap. - Interactive Decision Briefs: Walks through each finding one AskUserQuestion at a time with recommendations, completeness scores, and trade-offs, editing the plan as decisions are made. - Review Artifacts: Emits a completion summary, implementation task list with JSONL output for /autoplan aggregation, a review readiness dashboard, and a plan-file review report. - Use Case: Before implementing a new dashboard, run this skill on the plan to catch missing empty states, generic 3-column card grids, and unspecified mobile navigation, then resolve each decision interactively. ## Quick Start Ask the AI to review the design plan for UI and UX gaps before implementation begins.

Frequently Asked Questions about plan-design-review

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I review a design plan before implementation?▼

Invoke the skill on your plan and it runs seven passes covering information architecture, interaction states, user journey, AI slop risk, design system alignment, responsive/accessibility, and unresolved decisions. Each finding is presented as an interactive question with a recommendation, and approved fixes are edited directly into the plan.

What design issues does a plan review catch?▼

It catches missing loading/empty/error states, generic AI-generated patterns like 3-column feature grids and purple gradients, unspecified mobile and keyboard navigation, placeholder-as-label forms, and deviations from your DESIGN.md tokens. Each pass rates the plan 0-10 and specifies what would make it a 10.

Can I use this for live site visual audits?▼

No, this skill works on plans in plan mode, not live sites. For visual audits of an implemented site, use the /design-review skill instead, which performs code-level and visual QA after implementation.

Does the design plan review work without a DESIGN.md file?▼

Yes, but Pass 5 flags the missing design system as a gap and recommends running /design-consultation first. Without DESIGN.md, the review cannot verify token and component alignment, so new components are evaluated against universal design rules only.

What happens with unresolved design decisions after the review?▼

Unanswered questions are listed in an Unresolved Decisions section and never silently defaulted. Deferred items can be proposed as individual TODOS.md entries with what, why, pros, cons, and context, each confirmed one at a time.