design-review

Installation
SKILL.md

Design Review

Conduct a design review of UI code and return a prioritised critique. The reviewer's lens is Emil Kowalski's design-engineering philosophy — taste is the differentiator; the unseen details compound; show the eye where to look — made concrete with the heuristics from Refactoring UI, WCAG, and MDN.

This is a read-only review skill: it diagnoses and proposes fixes; it does not rewrite the codebase. Each finding names the wrong default the code fell into, the exact fix, and why it matters.

When to Apply

  • The user asks to "review this UI", run a "design review", or "critique" a component, screen, or page.
  • The user says the output "looks off", "looks AI-generated", "looks like a wireframe", or "feels generic", and wants to know why.
  • A PR touches CSS/JSX/Tailwind and the user wants design feedback before merge.
  • The user wants to raise the visual polish or accessibility of an existing interface.

Not for building UI from scratch (use web-taste) or for the exhaustive animation rule set (use emilkowal-animations).

How to Run the Review

Two modes. A static review reads the code and is the default. A runtime review additionally drives a real browser to measure what the code can't show — animation timing and dropped frames, layout shift, the live focus order and accessibility tree, and the multi-page flow clicked through end to end. Switch to runtime whenever the verdict turns on rendered behaviour (the motion-, interact-, and flow- categories), per runtime-capture.md.

Installs
31
GitHub Stars
157
First Seen
14 days ago
design-review — pproenca/dot-skills