메뉴
Senior Designer review of any feature plan or mockup. Rates each design dimension 0-10, explains what a 10 looks like, detects AI slop. Interactive — asks PD one question per design choice.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Builds production-grade Claude Projects and CustomGPTs, improves AI output quality using meta-thinking prompts, and architects self-improving AI systems. Use proactively when a founder wants to build a reliable AI workflow, automate a repeatable task with AI, improve the quality of AI outputs they're getting, feels stuck with generic AI responses, or wants to build internal tools powered by Claude. Trigger for "build a Claude project", "my AI outputs are generic", "how do I make Claude more specific", "build an AI workflow", "automate this with AI", or "my prompts aren't working".
One-command review pipeline. Chains CEO review → design review → eng review automatically. Surfaces only taste decisions for PD approval. Everything else runs autonomously.
Performance baseline measurement. Captures page load times, Core Web Vitals, and resource sizes. Compare before/after on every PR.
Playbook for bootstrapped and early-stage SaaS founders based on proven case studies ($0 to $5M ARR with 6 people, and creator-to-business flywheel models). Use proactively when a founder is bootstrapped or capital-efficient, needs to grow without paid acquisition, is facing a churn crisis, wants to build a freemium or usage-based model, or asks "how do I grow without VC money". Also trigger for "PLG", "inbound-led outbound", "creator-led growth", "build in public", or "how did [bootstrapped company] grow".
Real browser automation for testing, QA, and demo verification. Provides Playwright-based browser control for navigating the live app, clicking elements, filling forms, taking screenshots, and verifying visual state.
Post-deploy monitoring. After release-engineer pushes to production, canary watches the live site for errors, performance regressions, and page failures.
| name | plan-design-review |
| description | Senior Designer review of any feature plan or mockup. Rates each design dimension 0-10, explains what a 10 looks like, detects AI slop. Interactive — asks PD one question per design choice. |
| used_by | ["ui-designer","build-quality-auditor"] |
For every feature with UI, evaluate:
| Dimension | Score | What a 10 looks like | Current gap |
|---|---|---|---|
| Visual Hierarchy | /10 | User's eye follows the intended path. Primary CTA is unmissable. | |
| Information Density | /10 | Every pixel earns its place. No wasted space, no clutter. | |
| Consistency | /10 | Follows design-system/MASTER.md exactly. Zero token violations. | |
| Accessibility | /10 | WCAG AA. Keyboard navigable. Screen reader tested. Colour contrast 4.5:1+. | |
| Responsiveness | /10 | Works at 375px, 768px, 1024px, 1440px. No horizontal scroll. | |
| Loading States | /10 | Skeleton screens, not spinners. Content-shaped placeholders. | |
| Error States | /10 | Helpful, specific, actionable. Not "Something went wrong." | |
| Empty States | /10 | Guides user to take action. Not a blank page. | |
| Micro-interactions | /10 | Hover, focus, active states feel responsive. 60fps transitions. | |
| AI Slop Detection | /10 | No generic placeholder text. No "Lorem ipsum." Real content, real context, domain-specific. |
For each dimension scoring below 7, ASK PD one specific question: "[Dimension] is currently a [score]. To reach 10, we would [specific action]. Should I proceed with this change?"
Wait for PD answer before moving to the next dimension. Do NOT batch all questions.
Write to docs/plan-reviews/[feature]-design-review-[date].md
Post to Slack BUILD: "DESIGN REVIEW: [feature] — Average score: [X]/10 — [top 3 gaps]"
