design-review

Audit UI visuals for inconsistencies, spacing, and hierarchy issues.

1|Updated Feb 25, 2026
One-click install
npx skills add https://github.com/alexandervashurin/semaphore --skill design-review-alexandervashurin
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/alexandervashurin/semaphore/tree/main/.claude/skills/design-review
Command: npx skills add https://github.com/alexandervashurin/semaphore --skill design-review-alexandervashurin

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps designers and developers identify and fix visual inconsistencies, spacing issues, and hierarchy problems in user interfaces, ensuring polished, consistent design across pages.

Core Features & Use Cases

  • Visual QA audit: find visual inconsistencies, spacing issues, hierarchy problems, AI slop patterns, and slow interactions.
  • Iterative fixes with traceable commits: fix issues in source code, commit atomically, re-verify with before/after screenshots.
  • Plan-design-review workflow: for plan-mode design review (before implementation), use /plan-design-review.
  • Use cases include requests to audit the design, perform visual QA, check if it looks good, or polish an active live site.

Quick Start

Run a visual QA pass on your target site to identify issues, then apply suggested fixes and verify results with before/after screenshots.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I perform a visual QA audit on a live website?

Visual QA audits on live sites identify visual inconsistencies, spacing issues, and hierarchy problems across dynamic pages. The process evaluates desktop and mobile interfaces to detect UI polish opportunities and AI slop patterns for iterative source code fixes.

Can I review UI design and apply fixes directly in the project codebase?

Yes, UI design reviews apply atomic fixes directly in the project codebase. This requires codebase or live site access to resolve visual inconsistencies, commit changes iteratively, and verify polished results using before and after screenshots.

What is the best way to check for spacing and hierarchy problems before implementation?

Pre-implementation design checks use a plan-design-review workflow to evaluate spacing and hierarchy problems before coding begins. This approach audits proposed designs against visual consistency standards to catch UI issues early in the development process.

Does visual QA work for both desktop and mobile UI components?

Yes, visual QA works across both desktop and mobile UI components. The audit process evaluates responsive layouts and dynamic page elements to ensure consistent visual hierarchy, spacing, and UI polish regardless of the target device viewport.

Why do I need before and after screenshots for design polish?

Before and after screenshots provide visual verification for design polish by documenting the interface state before and after atomic code fixes. This traceable evidence confirms that visual inconsistencies, spacing issues, and hierarchy problems are actually resolved.

What types of visual inconsistencies can an automated design review detect?

An automated design review detects visual inconsistencies including spacing errors, hierarchy problems, and AI slop patterns. It scans live sites and dynamic components to locate UI polish issues and slow interactions that degrade the overall user experience.