The Problem

I got tired of generic AI feedback in UX work. Same vague suggestions, same heuristics without context, same visual solutions that don't actually solve anything.

So I built 5 Claude skills on a strict framework: no vague feedback, no invented data, no aesthetic-first decisions. Each one covers a different stage of the design process — from strategic research to final component states.

— 01 · UX AUDIT

You spend too much time auditing screens by intuition.

This skill checks contrast with exact hex values, validates touch targets against WCAG 2.1, and flags hierarchy and affordance issues with precise fixes.

No "consider improving contrast" — you get real numbers: "#747474 → 4.60:1 ✓" and "Padding vertical 8px → 16px. Target: 44×48px ✓".

No "consider improving contrast" — you get real numbers: "#747474 → 4.60:1 ✓" and "Padding vertical 8px → 16px. Target: 44×48px ✓".

• Contrast ratio with exact hex pairs (WCAG AA / AAA)

• Touch target sizes against WCAG 2.5.5 minimum

• Visual hierarchy and affordance issues

• Precise correction with before / after values
  
  

Real output: WCAG contrast and touch target validation with exact corrections.

Real output: WCAG contrast and touch target

validation with exact corrections.

UX AUDIT on GitHub

— 02 · DESIGN CRITIQUE

Generic feedback doesn't change anything.

This skill works like a code review for design: what's wrong, where, which principle was violated, and how to fix it. Based on Nielsen, Fitts, Gestalt, Von Restorff, and WCAG.

Every finding follows a strict structure — so you can act on it immediately, not interpret it.

Structured critique: Fitts's Law applied to a real button with a specific fix.

Structured critique: Fitts's Law applied to

a real button with a specific fix.

DESIGN CRITIQUE on GitHub

— 03 · UX DESIGN

Before Figma, there's a step most people skip.

This skill handles the strategic layer before any visual tool. Flows, onboarding, authentication, microcopy, and dev handoff — always prioritizing function over aesthetics.

It follows a fixed hierarchy of concerns. Every design decision is evaluated in strict order: can the user complete the task first, then clarity, accessibility, feedback, efficiency, consistency, and only then aesthetics.

→ Information hierarchy → Microcopy & writing

→ Onboarding & authentication → Dev handoff specifications

→ Flows & navigation → Design system alignment

The fixed hierarchy: 7 concerns evaluated in strict order before any design decision.

The fixed hierarchy: 7 concerns evaluated

in strict order before any design decision.

UX DESIGN on GitHub

— 04 · DISCOVERY

Structured discovery without spending hours on a doc.

Generates a full discovery document in HTML, including competitive benchmarks and gap analysis. Every insight is labeled as DATA, ESTIMATED, or INFERENCE — so you always know what's a fact and what's an assumption.

The output is structured in four clear sections, ready for stakeholder review or team alignment.

[ DATA ] Hard facts from research
[ ESTIMATED ] Reasonable estimates from available data
[ INFERENCE ] Interpretations clearly marked as such

Generated document structure: from project metadata to gap analysis with actionable recommendations.

Generated document structure: from project metadata

to gap analysis with actionable recommendations.

DISCOVERY on GitHub

— 05 · FRONTEND DESIGN

The code AI generates ignores design decisions.

This skill detects context first — product or marketing — respects design tokens, and defines all component states before any styling begins.

Generic AI delivers 1 button state. This skill delivers 8: Default, Hover, Focus, Active, Disabled, Loading, Error, and Success. Every state designed, not just the happy path.

Real output: 8 component states from a single prompt, respecting design tokens.

Real output: 8 component states from a single prompt,

respecting design tokens.

FRONTEND on GitHub