design-review

Audit live sites for visual inconsistencies and fix them with atomic commits.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designer's eye QA identifies visual inconsistencies, spacing issues, hierarchy problems, AI slop patterns, and slow interactions, then fixes them. It iteratively patches issues in source code, commits each fix atomically, and re-verifies 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 suggests improvements when the user mentions visual inconsistencies or wants to polish a live site's look.

Core Features & Use Cases

  • Visual QA pass to detect typography, spacing, hierarchy, and interaction inconsistencies.
  • Iterative fixes with atomic commits and before/after verification screenshots.
  • Plan-mode design review workflow via /plan-design-review for pre-implementation polish.

Quick Start

Start a design-review on the current site to audit visuals and generate a prioritized fix plan.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I audit my live site for visual design inconsistencies and spacing issues?

A visual QA audit identifies typography, spacing, and hierarchy problems on a deployed site, then generates a prioritized stepwise remediation plan with before and after evidence for each fix.

What is the best way to fix UI hierarchy problems and polish interactions automatically?

Fixing UI hierarchy problems and polishing interactions requires iteratively patching source code, committing each fix atomically, and re-verifying the changes with before and after screenshots.

Can I review and polish a design before implementation starts?

Yes, a plan-mode design review workflow evaluates visual polish and interaction design before implementation, generating a prioritized fix plan to address typography and layout issues proactively.

Do I need access to project source code to run a visual QA pass?

Yes, executing the design review workflow requires access to either the project source or the deployed site to patch issues, commit fixes atomically, and capture verification screenshots.

What specific visual issues does a design audit detect on a live website?

A design audit detects visual inconsistencies, spacing irregularities, hierarchy problems, AI slop patterns, and slow interactions across pages to ensure consistent visual quality.

When should I avoid using an automated design review workflow?

Automated design review is not suited for projects lacking accessible source code or a deployed site, as it requires live execution to iteratively patch issues and capture verification screenshots.