skills.rest
richardaum
richardaumCOMMUNITY
Explore all skills by this author →
𝕏@richardaumGitHub

design-review

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

Updated Apr 29, 2026
Search Tags:#design#accessibility#UI#aesthetic#visual review#responsiveness
One-click install
npx skills add https://github.com/richardaum/sporty-group --skill design-review-richardaum
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/richardaum/sporty-group/tree/main/.agents/skills/design-review
Command: npx skills add https://github.com/richardaum/sporty-group --skill design-review-richardaum

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill helps teams perform structured reviews of their user interfaces to ensure visual consistency, responsiveness, and aesthetic fidelity.

Core Features & Use Cases

  • Design Critique & QA: Analyze the built UI against the design brief and aesthetic principles.
  • Screenshot Capture Protocol: Automate capturing screenshots across multiple viewports with dark mode options.
  • Use Case: Run a design review for a new landing page to identify layout discrepancies, inconsistent styling, and accessibility gaps before deployment.

Quick Start

Use the design-review skill to evaluate the current UI by providing the URL and screenshots of the application in various states.

Frequently Asked Questions about design-review

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

FAQPage Schema
How do I review UI design for visual hierarchy and accessibility?▼

You review UI design by evaluating visual hierarchy, consistency, responsiveness, and accessibility against project briefs and style guides. The process requires capturing screenshots across multiple viewports and exploring the codebase for detailed feedback.

Can I automate screenshot capture for responsive design across multiple viewports?▼

Yes, you can automate screenshot capture for responsive design across multiple viewports. The review protocol supports automated screenshot capturing across multiple viewports, including dark mode options, to facilitate thorough aesthetic evaluation.

What is a design critique and how does it improve aesthetic fidelity?▼

A design critique is a structured evaluation of built user interfaces to ensure visual consistency and aesthetic fidelity. It identifies layout discrepancies, inconsistent styling, and accessibility gaps by analyzing the UI against design briefs.

Do I need image capture tools to perform a visual review of my application?▼

Yes, you need image capture tools to perform a visual review. Capturing screenshots of the application in various states and viewports is required to provide thorough design feedback and identify visual discrepancies.

When should I run a design QA to check for layout discrepancies?▼

You should run a design QA to check for layout discrepancies before deploying a new landing page or UI update. This helps identify inconsistent styling, responsiveness issues, and accessibility gaps early in the development cycle.

Related Skills

Explore More Design & Creative Skills→
wordshepherdwordshepherd

manual-qa

Capture desktop, mobile, and dark mode screenshots while checking console and network errors.

Official
Advanced
tanaka-mambingetanaka-mambinge

critique

Identify UX design gaps and produce prioritized critique reports.

Community
Intermediate
erclxerclx
2

claude-ux-audit

Audit UI surfaces against design tokens and wireframes for consistency.

Community
Intermediate
dual-devs0dual-devs0
1

critique

Evaluate UX designs on visual hierarchy, information architecture, and emotional resonance.

Community
Advanced