skills.rest
I194
I194COMMUNITY
Explore all skills by this author →
GitHub

design-review

Audit live websites for visual inconsistencies and hierarchy problems.

9|3|Updated Jan 29, 2022
Search Tags:#typography#spacing#design-review#before-after#ui-polish#visual-audit
One-click install
npx skills add https://github.com/I194/PMTools_2.0 --skill design-review-i194
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/I194/PMTools_2.0/tree/main/.claude/skills/gstack/design-review
Command: npx skills add https://github.com/I194/PMTools_2.0 --skill design-review-i194

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designers and engineers often struggle to spot visual inconsistencies, spacing issues, and hierarchy problems on live sites. This Skill provides a structured audit workflow to identify and fix these issues, then verify progress with before/after artifacts and atomic commits.

Core Features & Use Cases

  • Visual QA: audit pages for typography, spacing, color, and hierarchy alignment.
  • Fix & Verify: implement changes in source with atomic commits and re-check with updated visuals.
  • Plan-mode design review: prepare reviews before implementation and track progress over time.

Quick Start

Point design-review at your site URL, set scope and depth, and begin the audit to generate fixes and verifications.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I audit live websites for visual inconsistencies and spacing issues?▼

You can run a visual QA audit by pointing the tool at your site URL, setting scope and depth, and beginning the audit to identify typography, spacing, and hierarchy problems across pages.

How does visual QA verify UI polish fixes after implementation?▼

Visual QA verifies UI polish fixes by generating before and after artifacts, re-checking updated visuals, and integrating with source control to commit fixes atomically for clear progress tracking.

Can I scope a visual audit to specific pages like checkout or settings?▼

Yes, you can apply the visual audit to a focused scope such as the homepage, settings, or checkout pages, allowing targeted UI polish and hierarchy alignment across specific site sections.

What is a plan-mode design review for UI polish?▼

A plan-mode design review prepares visual audits before implementation, guiding designers and developers through structured plan and review steps to track progress over time and ensure systematic fixes.

Do I need source control integration to fix spacing and typography issues?▼

Source control integration is used to commit fixes atomically, ensuring that spacing and typography adjustments are tracked and verified with before and after artifacts during the visual audit workflow.

Related Skills

Explore More Design & Creative Skills→
curielmccurielmc

design-review

Audit live UI for visual consistency, spacing, hierarchy, and interaction latency.

Community
Advanced
zzxtbetazzxtbeta

design-review

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

Community
Advanced
marcioaltoemarcioaltoe
14

gesttione-design-system

Applies Gesttione brand colors, typography, and metric tokens to UI components.

Community
Intermediate
zinohomezinohome
1

visual-regression-tester

Capture and compare UI screenshots with Playwright and Chromatic.

Community
Advanced