skills.rest
rshelekhov
rshelekhovCOMMUNITY
Explore all skills by this author →
GitHub

plan-design-review

Audit live websites for visual design gaps and generate a prioritized DESIGN.md report.

Updated Nov 11, 2025
Search Tags:#typography#design-system#spacing#visual-design#design-review#UX-audit#live-site-audit
One-click install
npx skills add https://github.com/rshelekhov/dotfiles --skill plan-design-review-rshelekhov
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: plan-design-review
Source: https://github.com/rshelekhov/dotfiles/tree/main/claude/skills/gstack/plan-design-review
Command: npx skills add https://github.com/rshelekhov/dotfiles --skill plan-design-review-rshelekhov

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designer's eye review of a live site to identify visual inconsistencies, spacing issues, hierarchy problems, and slow-feeling interactions. It produces a prioritized design audit with annotated screenshots and measurable grading, and can infer a design system while offering to export as DESIGN.md. This is report-only and does not modify code; for the fix loop, use /qa-design-review.

Core Features & Use Cases

  • Visual audit of live sites and dashboards for layout, typography, color, and interaction quality.
  • Prioritized design recommendations with annotated screenshots and letter grades.
  • Design-system inference and optional export to DESIGN.md for documentation.

Quick Start

Run a full-site design audit on the live project to generate a comprehensive report in DESIGN.md.

Frequently Asked Questions about plan-design-review

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

FAQPage Schema
How do I run a visual design audit on a live website?▼

To run a visual design audit on a live website, use this Skill to identify layout, typography, and hierarchy problems, generating a prioritized report with annotated screenshots and letter grades.

Can I extract a design system from an existing live dashboard?▼

You can extract a design system from a live dashboard by running this audit to infer visual design rules, spacing, and typography, optionally exporting the documented specifications to a DESIGN.md file.

What is the best way to review UI consistency before a rebrand?▼

Reviewing UI consistency before a rebrand involves performing a live-site design audit to identify visual inconsistencies and slow-feeling interactions, producing measurable letter grades to guide redesign decisions.

Does this live-site design audit modify my source code?▼

This live-site design audit does not modify your source code or production assets, delivering a read-only report with visual design recommendations and an export-ready DESIGN.md file instead of applying fixes.

How do I fix the visual design gaps identified during a site audit?▼

To fix the visual design gaps identified during a site audit, use the /qa-design-review workflow, as this audit Skill focuses on reporting, grading, and design-system extraction rather than code modification.

What does a UX audit report include for live websites?▼

A UX audit report for live websites includes prioritized design recommendations, annotated screenshots, measurable letter grades, and inferred design-system documentation exported as a read-only DESIGN.md file.

Related Skills

Explore More Design & Creative Skills→
Ronin15Ronin15
14

hammer-benchmark-regression

Compare SDL3 HammerEngine metrics against baselines to flag performance regressions.

Community
Intermediate
cogine-aicogine-ai
3

site-design-audit

Audit live-site design quality without modifying source code.

Official
Advanced
gouravsingh311gouravsingh311

design-md

Analyze Stitch project assets and codify design tokens into DESIGN.md files.

Community
Intermediate
etewiahetewiah
635

theme-evaluation

Evaluate theme palettes for WCAG contrast and accessibility compliance.

Community
Advanced