skills.rest
hschne
hschneCOMMUNITY
Explore all skills by this author →
Website𝕏@hschnedlitzGitHub

design-review

Critique web interfaces against design briefs and WCAG standards.

1|Updated Apr 14, 2026
Search Tags:#design review#design brief#visual validation#responsive testing#ui critique#accessibility check#design qa
One-click install
npx skills add https://github.com/hschne/pi-stuff --skill design-review-hschne
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/hschne/pi-stuff/tree/main/skills/design-review
Command: npx skills add https://github.com/hschne/pi-stuff --skill design-review-hschne

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates inconsistent, ad-hoc design reviews that miss critical visual bugs, accessibility gaps, and deviations from the original design brief, ensuring built interfaces match the intended user experience before launch.

Core Features & Use Cases

  • Structured Design Critique: Systematically evaluates built UI against the design brief across visual hierarchy, consistency, responsiveness, accessibility, and aesthetic fidelity.
  • Mandatory Visual Validation: Captures screenshots across desktop, tablet, and mobile breakpoints to catch rendering issues, layout bugs, and visual mismatches that code review alone misses.
  • Prioritized Action Items: Generates a clear, severity-ranked list of refinements (must-fix, should-fix, could-improve) to streamline post-review work. Use case: For example, after building a new landing page, run this skill to validate it matches the design brief, catch mobile layout overflow issues, and ensure color contrast meets accessibility standards before shipping.

Quick Start

Use the design-review skill to run a full design critique of the new onboarding flow I just built, checking it against the .design/onboarding-flow/DESIGN_BRIEF.md file.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I run a structured design critique on a built web interface?▼

A structured design critique evaluates built UI against a design brief by capturing screenshots across desktop, tablet, and mobile breakpoints to identify visual, accessibility, and consistency issues before launch.

What is visual validation in a pre-launch design QA pass?▼

Visual validation in a design QA pass captures screenshots of a running application across responsive breakpoints to catch rendering bugs and layout mismatches that code review alone misses.

How do I check if my landing page meets WCAG accessibility standards?▼

To check WCAG compliance during a design review, the interface is evaluated against accessibility standards to catch issues like insufficient color contrast before shipping.

Can I use a design brief to validate UI consistency during post-build review?▼

Yes, you can validate UI consistency during a post-build review by systematically comparing the built interface against the project design brief across visual hierarchy, responsiveness, and aesthetic fidelity.

What is the best way to prioritize UI issues found during a design review?▼

The best way to prioritize UI issues found during a design review is to generate a severity-ranked list of refinements categorized as must-fix, should-fix, and could-improve to streamline post-review work.

Do I need a running application instance to perform responsive testing and UI critique?▼

Yes, you need a running application instance for screenshot capture to perform responsive breakpoint testing and mandatory visual validation of the built web interface.

Related Skills

Explore More Design & Creative Skills→
richardaumrichardaum

design-review

Evaluate UI design implementation for visual hierarchy, consistency, responsiveness, and accessibility.

Community
Advanced
augustoheissaugustoheiss

agency-accessibility-auditor

Audit web interfaces for WCAG failures using automated scans and assistive-technology testing.

Community
Advanced
fm-dev-mxfm-dev-mx

testing

Implement automated tests for the Celebra-me project using Jest, React Testing Library, and Playwright.

Community
Intermediate
Montte-erpMontte-erp
6

wcag-audit-patterns

Audit web pages for WCAG 2.2 violations with automated and manual checks.

Official
Intermediate