design-review

Evaluate UI designs against design standards and output severity-based feedback.

1|Updated Mar 8, 2026
One-click install
npx skills add https://github.com/ProfFroggo/froggo-mission-control --skill design-review-proffroggo
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-review
Source: https://github.com/ProfFroggo/froggo-mission-control/tree/main/.claude/skills/design-review
Command: npx skills add https://github.com/ProfFroggo/froggo-mission-control --skill design-review-proffroggo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Systematic evaluation of UI designs against design standards to generate clear, actionable feedback that accelerates high-quality, accessible interfaces.

Core Features & Use Cases

  • Provides a structured checklist covering visual hierarchy, spacing, color/typography, accessibility (WCAG AA), responsive behavior, and dark mode.
  • Produces severity-based feedback and a concise design-to-dev handoff checklist for engineers.
  • Ideal for pre-launch design reviews, accessibility audits, implementation reviews, and QA handoffs.

Quick Start

Review a design asset (Figma file or implemented UI) against the standard checklist and generate a design-review feedback report.

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 UI design review on a Figma file before launch?

A UI design review evaluates a Figma file against a structured checklist covering visual hierarchy, spacing, color, typography, and WCAG AA contrast to generate actionable feedback. It outputs severity-based issues and a design-to-dev handoff checklist for engineers.

What is included in a design-to-dev handoff checklist?

A design-to-dev handoff checklist captures accessibility audit findings, responsive behavior requirements, and dark mode specifications. It translates UI design standards into severity-based feedback and concrete implementation steps for engineers.

Can I use this for an accessibility audit checking WCAG AA contrast?

Yes, an accessibility audit checks WCAG AA contrast alongside visual hierarchy and typography. It produces severity-based feedback on implemented UI or Figma files, ensuring web apps meet accessibility standards before launch.

Does this design review evaluate dark mode and responsive behavior?

Yes, the design review evaluates dark mode and responsive behavior as core dimensions. It assesses implemented UI or Figma designs against these standards, generating structured feedback to ensure consistent web app experiences.

What is the best way to structure feedback from a UI design review?

The best way to structure UI design review feedback is by using severity levels for each issue found. This approach prioritizes visual hierarchy, spacing, and color problems, producing a concise checklist that accelerates developer handoffs.

Can I review implemented UI or only Figma files?

You can review both implemented UI and Figma files. The design review process applies its evaluation checklist to either format, producing severity-based feedback and handoff checklists for web apps.