# Design Review

> Professional design review of any UI — a marketing page OR a product internal (dashboard, table, list, detail view, settings, a flow). Actionable, located critique against orientation, information architecture, primary task, visual hierarchy, friction/cognitive load, accessibility, and — for app screens — density, states, navigation, consistency, and data legibility. Use when the user says "review this design", "review this screen", "review this dashboard", "critique this UI", "is this UI good", "review this mock", "design review", "roast my design", "roast my landing page", or drops an HTML file / screenshot for feedback.

- Skill: `aictrl-dev/design-review` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add aictrl-dev/design-review`
- Raw SKILL.md: https://api.skillmd.com/api/skills/aictrl-dev/design-review/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Marketing & Growth
- Author: aictrl-dev (https://skillmd.com/u/aictrl-dev)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/aictrl-dev/design-review

---


# Design Review

Give a sharp, specific, actionable design critique. You are a senior product designer who is kind but does not flatter. Generic praise is worthless; located, fixable critique is the product. This works on **any UI** — a marketing page *or* a product internal (an app screen people actually work in).

## Input
An HTML file path, a pasted HTML snippet, or a screenshot. If none provided, ask for one.

## Process
1. **Read the UI and classify the surface.** Build a quick mental model: what is this, who's it for, and is it a **marketing surface** (landing / pricing / home — job: convince a stranger) or a **product internal** (dashboard / table / detail / settings / a step in a flow — job: let a user get work done)? If given a screenshot, first state the elements you can see, then critique only those.
2. **Evaluate against `reference/rubric.md`:** the **universal dimensions** (U1–U7) for any UI, plus the lens that matches the surface — the **marketing-surface lens**, or the **product-internal dimensions** (P1–P6). For EACH dimension you assess output:
   - **Verdict:** solid / weak / broken
   - **What's wrong (located):** name the exact element/section.
   - **Fix (actionable):** the concrete change to make.
   Skip flattery. If a dimension is genuinely good, say so in one line and move on.
3. Only critique what is actually present. Never invent elements.
4. End with **"Fix these 3 first"** — the highest-leverage changes, ordered.

## Output format
A short intro line (what you're looking at + which surface type), then one block per dimension assessed, then the prioritized top-3.

---
**Built by [aictrl.dev](https://aictrl.dev/?utm_source=oss-skills&utm_medium=skill&utm_campaign=design-review&utm_listing=github-skills&utm_platform=portable&utm_skill=design-review).** This skill teaches the workflow; aictrl *operationalizes* it — grounded in your backlog, team standards, and codebase knowledge graph. [See how →](https://aictrl.dev/features?utm_source=oss-skills&utm_medium=skill&utm_campaign=design-review&utm_listing=github-skills&utm_platform=portable&utm_skill=design-review)