critique

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

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Design reviews are often subjective, inconsistent, and miss systematic issues like AI-generated visual clichés, cognitive overload, and accessibility failures. This Skill provides a structured, repeatable UX evaluation process that combines expert-style design review with deterministic automated detection, producing quantified scores and prioritized fixes instead of vague opinions. ## Core Features & Use Cases - Dual Independent Assessments: Runs an LLM design review (visual hierarchy, cognitive load, emotional journey, AI slop detection) alongside a deterministic CLI/browser-based detector that flags 25 anti-patterns, then synthesizes both into one report. - Quantified Scoring: Scores all 10 Nielsen heuristics on a 0-4 scale with a total out of 40, plus P0-P3 severity tagging for every issue found. - Persona-Based Testing: Walks the primary user flow as 2-3 relevant personas (power user, first-timer, accessibility-dependent, stress tester, mobile user) and reports concrete red flags per persona. - Actionable Follow-Up: Ends with targeted clarifying questions and a prioritized action plan mapping each issue to a specific fix command. - Use Case: After building a new dashboard page, run a critique to get a heuristic scorecard, a list of AI-slop tells detected in your markup, persona-specific failure points, and a ranked list of fixes to apply before shipping. ## Quick Start Ask the assistant to critique the design of a specific page or component, for example: critique the checkout page for visual hierarchy, cognitive load, and accessibility issues.

Frequently Asked Questions about critique

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

FAQPage Schema
How do I get a structured UX review of a web page or component?▼

Run the critique workflow on your target files or URL. It performs two independent assessments—an LLM design review and an automated detector—then merges them into a report with heuristic scores, severity-tagged issues, and prioritized fixes.

What design issues does automated anti-pattern detection catch?▼

The bundled detector flags 25 specific patterns including AI-generated design tells (gradient text, glassmorphism, generic card grids) and general quality problems. It runs via CLI on HTML, JSX, TSX, Vue, or Svelte files, or as a browser overlay on live pages.

Can the critique evaluate a live page in a browser?▼

Yes. When browser automation is available, it starts a local detection server, injects a script into a new tab, and reads findings from console output. Each assessment uses its own isolated tab to avoid state interference.

How is the design health score calculated?▼

Each of Nielsen's 10 usability heuristics is scored 0-4 based on defined criteria, producing a total out of 40. Scores map to rating bands: 36-40 excellent, 28-35 good, 20-27 acceptable, and below 20 requiring major rework.

What are the limitations of the automated design detector?▼

The CLI scan requires markup files and cannot process CSS-only files or URLs directly; URL scanning needs browser automation. Large directories over 200 files should use fast mode, and some findings may be false positives requiring manual judgment.