Skip to content
Development
Skill

/design-review

Review or audit a design/UI across 6 weighted dimensions with Nielsen's 10 heuristics and a prioritized findings table. Use when the user wants a design critique, quality score, heuristic evaluation, or audit of an existing screen, page, or product before/after build.

Boost this skill
@plugin87plugin87@plugin87
From plugin
ux-ui-agent-skills
1.4k19 skills1 agent5 commands2 MCP
Install
$ npx -y skills add plugin87/ux-ui-agent-skills --skill design-review --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/design-review

Context preview

The summary Claude sees to decide when to auto-load this skill.

Review or audit a design/UI across 6 weighted dimensions with Nielsen's 10 heuristics and a prioritized findings table. Use when the user wants a design critique, quality score, heuristic evaluation, or audit of an existing screen, page, or product before/after build.

SKILL.md

design-review.SKILL.md
name: design-review
description: Review or audit a design/UI across 6 weighted dimensions with Nielsen's 10 heuristics and a prioritized findings table. Use when the user wants a design critique, quality score, heuristic evaluation, or audit of an existing screen, page, or product before/after build.
invocation: model

Skill: Design Review

Run a structured, scored review.

Steps

1. Read `workflows/design-review.md` (rubric, scoring guide, Nielsen heuristics, process). 2. Gather context: the screen(s)/flow, target users, platform, constraints. 3. Score the 6 dimensions (Visual Hierarchy 20%, Consistency 20%, Accessibility 20%, Usability 20%, Responsiveness 10%, Performance 10%); compute the weighted overall. 4. Run the accessibility lens with `accessibility/wcag-checklist.md`; use `scripts/contrast.py` for any color-pair doubts. 5. Check against the anti-slop tells in `taste/design-taste.md` (Banned Defaults checklist). 6. Apply Nielsen's 10 heuristics; flag violations by number.

Output

  • The 6-dimension scored table + overall score.
  • A prioritized findings table: # · Severity (Critical → Major → Minor → Enhancement) · Finding · Recommendation.
  • Concrete, token-referenced fixes.
Read it on GitHub ↗
Ships withux-ui-agent-skills

Turn Claude into a senior design architect - DTCG design tokens, 50 components, WCAG 2.2 AA to AAA, 138 design systems, any-framework code, and 38 objective gates that fail the build instead of claiming success. Install as a Claude Code plugin or with npx.

Get the whole plugin
Stats
JavaScriptNodeReactNext.jsTailwind
+7 tags
shadcn/uiHTMLCSSBashGitHubAnthropicFigma
1,439
Stars
140
Forks
Active
Maintenance
JavaScript
Language
MIT
License
15h ago
Last commit
6mo ago
Created

Repo: plugin87/ux-ui-agent-skills

In this plugin
19 skills5 commands2 MCP1 agent
See everything inside

Other skills on ux-ui-agent-skills.

See all 19 skills in ux-ui-agent-skills