design-review

Automate visual QA and iterative fixes for design layouts.

Updated Mar 29, 2026
One-click install
npx skills add https://github.com/Santiagoisper/BOPE_VERSION_DEFINITIVA --skill design-review-santiagoisper
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/Santiagoisper/BOPE_VERSION_DEFINITIVA/tree/main/.agents/skills/gstack/design-review
Command: npx skills add https://github.com/Santiagoisper/BOPE_VERSION_DEFINITIVA --skill design-review-santiagoisper

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Bash, Read, Write, Edit, Glob, Grep, AskUserQuestion, WebSearch, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the quality assurance and fixing of visual inconsistencies, spacing issues, hierarchy problems, and performance bottlenecks in design work.

Core Features & Use Cases

  • Visual QA: Identifies and corrects visual issues in design layouts.
  • Performance Optimization: Identifies and fixes slow interactions and AI-generated slop patterns.
  • Iterative Fixes: Commits fixes atomically and re-verifies with before/after screenshots.
  • Plan-Mode Review: Offers a plan-mode review option for designs before implementation.
  • Use Case: When a designer needs to audit the design, perform visual QA, check if the design looks good, or polish the look of a live site.

Quick Start

Run the /design-review skill with the target URL and scope, e.g., /design-review https://example.com full.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I automate visual QA and fix design inconsistencies on a live site?

You can automate visual QA by running a design review against a target URL and scope to identify and fix visual inconsistencies, spacing, and hierarchy problems. The process commits fixes atomically and re-verifies them using before and after screenshots.

What is design review for performance optimization and visual consistency?

Design review for performance optimization is the automated process of identifying and fixing slow interactions and AI-generated slop patterns to ensure visual consistency. It audits design layouts to correct visual issues and polish the overall look of a live site.

Can I review a design in plan-mode before implementing visual fixes?

Yes, you can review a design in plan-mode before implementation to evaluate visual consistency and performance bottlenecks. This option allows you to audit the design and plan fixes before applying any actual changes to the live site.

Does automated design QA support iterative fixes with before and after screenshots?

Yes, automated design QA supports iterative fixes by committing changes atomically and re-verifying the results with before and after screenshots. This ensures that visual consistency and performance optimizations are accurately validated after each correction.

How do I check if my design looks good and fix AI-generated slop patterns?

To check if your design looks good and fix AI-generated slop patterns, run an automated design review on the target URL. It identifies visual issues, slow interactions, and slop patterns, then applies iterative fixes to polish the site.