critique

Evaluate interface designs using heuristic scoring, persona testing, and automated anti-pattern detection.

Updated Feb 22, 2026
One-click install
npx skills add https://github.com/metang/imganalyzer --skill critique-metang
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: critique
Source: https://github.com/metang/imganalyzer/tree/main/.agents/skills/critique
Command: npx skills add https://github.com/metang/imganalyzer --skill critique-metang

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Design reviews are often subjective, inconsistent, and miss systematic usability issues. This Skill provides a structured, repeatable process for evaluating interfaces that combines expert design judgment with deterministic automated detection, producing quantified scores and prioritized actionable fixes. ## Core Features & Use Cases - Dual Independent Assessments: Runs an LLM design review and an automated anti-pattern detector separately to avoid bias, then synthesizes findings into one report. - Quantified Scoring: Scores all 10 Nielsen usability heuristics (0-4 each, 40 total) plus an 8-item cognitive load checklist, giving an objective design health rating. - Persona-Based Testing: Walks the interface through relevant user archetypes (power user, first-timer, accessibility-dependent, stress tester, mobile user) to expose failure modes. - Use Case: A developer finishes a new dashboard page and asks for a design review. The Skill inspects the code and live page, flags AI-slop patterns, scores heuristics, identifies P0-P3 priority issues, and recommends specific follow-up commands to fix them. ## Quick Start Ask the assistant to critique the design of your page or component, for example: review the checkout flow and give me a scored design critique with prioritized fixes.

Frequently Asked Questions about critique

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

FAQPage Schema
How do I get a UX design review of my web page?▼

Invoke the critique skill with the target area, such as a page, feature, or component. It runs two independent assessments, an LLM design review and an automated detector, then synthesizes a scored report with prioritized issues and fixes.

What does the automated design anti-pattern detector check?▼

The detector flags 25 specific patterns including AI slop tells and general design quality issues. Run it via npx impeccable --json on HTML, JSX, TSX, Vue, or Svelte files, or use the live browser overlay mode for viewable pages.

How is the design health score calculated?▼

Each of Nielsen's 10 usability heuristics is scored 0-4 for a 40-point total. Scores of 36-40 are excellent, 28-35 good, 20-27 acceptable, 12-19 poor, and 0-11 critical, with most real interfaces scoring 20-32.

Can the critique evaluate accessibility and mobile usability?▼

Yes, persona-based testing includes an accessibility-dependent user checking keyboard navigation, focus indicators, and contrast, plus a mobile user checking thumb-zone actions, touch targets, and state persistence.

What file types can the design detector scan?▼

The CLI scan accepts HTML, JSX, TSX, Vue, and Svelte files or directories containing markup. CSS-only files should not be passed, and URLs require the browser-based live detection server instead.

When should I use --fast mode for design scanning?▼

Use --fast for large directories with 200 or more scannable files. It runs regex-only detection and skips jsdom parsing, trading some detection depth for speed. For 500+ files, narrow the scope first.