design-review

Audit and fix visual design issues in source code with before/after verification.

Updated Mar 25, 2026
One-click install
npx skills add https://github.com/henriquemeireles7/zeny-app --skill design-review-henriquemeireles7
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/henriquemeireles7/zeny-app/tree/main/.claude/skills/gstack/design-review
Command: npx skills add https://github.com/henriquemeireles7/zeny-app --skill design-review-henriquemeireles7

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designer's eye QA: finds visual inconsistency, spacing issues, hierarchy problems, AI slop patterns, and slow interactions — then fixes them. Iteratively fixes issues in source code, committing each fix atomically and re-verifying with before/after screenshots. For plan-mode design review (before implementation), use /plan-design-review. Use when asked to "audit the design", "visual QA", "check if it looks good", or "design polish". Proactively suggest when the user mentions visual inconsistencies or wants to polish the look of a live site.

Core Features & Use Cases

  • Visual QA audit and polish of UI designs, with atomic commits for each issue.
  • Iterative fixes in source code, verified by before/after screenshots.
  • Plan-mode workflow support via /plan-design-review for pre-implementation reviews.
  • Proactive design polish suggestions when visual quality or consistency is subpar.

Quick Start

Run the design-review skill to audit the current design on a live site and start fixing issues with atomic commits.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I run a visual QA audit to fix UI design inconsistencies?

To polish UI visuals, the skill audits your live site or plan-mode designs to find visual inconsistencies, spacing issues, and typographic hierarchy problems. It then iteratively applies source-code fixes, committing each change atomically and verifying the result with before-and-after screenshots.

What is the best way to polish UI typography and spacing before implementation?

The /plan-design-review workflow enables you to audit and polish visual designs before implementation. It identifies typographic hierarchy and spacing issues early, allowing you to resolve design problems in the planning phase rather than patching a live site retroactively.

Can I use this to fix AI slop patterns and slow interactions on a live site?

Yes, you can audit and polish visuals on a live site. When asked to check if it looks good or fix visual inconsistencies, the skill identifies AI slop patterns and slow interactions, then corrects them directly in the source code with before-and-after verification.

How does the design review process verify UI fixes?

The design review process verifies UI fixes by capturing before-and-after screenshots. It iteratively fixes issues in source code, making an atomic commit for each change, and then re-verifies the visual output to ensure the spacing and typographic problems are completely resolved.

Do I need any external dependencies to audit and fix UI visual issues?

No external dependencies are required to audit and fix UI visual issues. The skill operates independently to identify visual inconsistencies, spacing problems, and AI slop patterns, applying source-code changes and atomic commits without needing additional components or libraries.