design-review

Name: design-review
Availability: InStock
Author: nocnoc

Audit live websites for visual inconsistencies and produce commit-ready fixes.

Updated Mar 21, 2026

Search Tags:#typography #design audit #visual QA #before-after #live-site #interaction polish

Ready to run

npx skills add https://github.com/nocnocgroup/gstack --skill design-review-nocnocgroup

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/nocnocgroup/gstack/tree/main/design-review
Command: npx skills add https://github.com/nocnocgroup/gstack --skill design-review-nocnocgroup

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The design-review skill helps designers and frontend engineers perform rigorous live-site visual audits, identifying visual inconsistencies, spacing issues, typographic problems, and slow interactions, and applying fixes with atomic commits and before/after verification.

Core Features & Use Cases

End-to-end visual QA: audit live sites, surface layout and typography problems, and propose concrete, implementable fixes.
Plan-mode design review: provide guidance before implementation to ensure design intent is preserved.
Before/after verification: capture screenshots, compare states, and verify improvements.

Quick Start

Navigate to the target URL and begin a structured visual audit, then implement fixes and re-verify with before/after captures.

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 on a live site involves navigating to the target URL to audit layout, typography, and interaction polish, then proposing concrete fixes. You can run full-site audits or focus on specific pages using a structured plan-design-review workflow.

Can I verify visual fixes with before and after screenshots on live pages?▼

Yes, before/after verification captures screenshots to compare states and verify improvements on live pages. This ensures that applied spacing, typography, and interaction fixes actually resolve the identified visual issues.

What is the best way to fix spacing and typography inconsistencies in a live site?▼

The best way is to audit live sites to surface spacing and typography problems, then apply fixes with atomic commits. This Skill produces actionable fixes that can be committed directly to source control with optional references to support the corrections.

Do I need a design system to audit visual inconsistencies on live pages?▼

A design system is not strictly required, but the audit includes design-system alignment checks to ensure consistency. Providing optional references and assets helps generate more accurate, implementable fixes for the identified visual problems.

Can visual design audit fixes be committed directly to source control?▼

Yes, the design review produces actionable fixes that can be committed to source control with atomic commits. This allows frontend engineers to implement visual polish corrections and verify them with before/after captures seamlessly.