# Design Critique

Critiques hierarchy, affordance, errors and accessibility, and orders the fixes.

- Repository: https://github.com/paperclipai/paperclip (109885 stars)
- Category: Design
- License: MIT
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add paperclipai/paperclip --skill design-critique -g -a claude-code -y`
Codex: `npx skills add paperclipai/paperclip --skill design-critique -g -a codex -y`
Cursor: `npx skills add paperclipai/paperclip --skill design-critique -g -a cursor -y`
Gemini CLI: `npx skills add paperclipai/paperclip --skill design-critique -g -a gemini-cli -y`

## Description

Give a structured product design critique, user job clarity, hierarchy, affordance, error states, accessibility, and consistency, focused on what to change, in what order, and why.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Product Design Critique

A structured critique pass for a screen, flow, or component. The output is a prioritized list of changes a designer or engineer can act on, not adjectives. Critique is not redesign; recommend, do not rebuild.

## When to use

- A designer or engineer asks for feedback on a screen, mock, or live UI.
- A feature is shipping and someone wants a final UX read.
- A flow is suspected of causing user drop-off and you want a pre-research read before instrumentation.

## When not to use

- The user wants a redesign. That is a design project, not a critique.
- The work is so early that no concrete artifact exists. Sketch with them instead of critiquing air.
- You have no context on the user job. Ask for it first; design critique without user context devolves into taste.

## Pre-critique context

Before opening a screen, get:

- **Who is the user.** Specific role and competence, not "users".
- **What job they are doing on this screen.** One sentence.
- **What success looks like.** What the user can do after this screen that they could not before.
- **Where this screen sits in the larger flow.** What precedes and follows.

If any of these is missing, ask. Critique without these is opinion.

## The pass (in order)

1. **Clarity of the user job.**
   - Within 3 seconds of opening, is it obvious what this screen is for?
   - Does the primary action match the user's actual job, or a designer's preferred path?

2. **Visual hierarchy.**
   - The most important thing on the screen should be the most prominent (size, weight, position, color).
   - Secondary actions should look secondary. Tertiary should be findable but not loud.
   - Headings should chunk content into the right groups for the task.

3. **Affordance and signifiers.**
   - Clickable things look clickable.
   - Disabled things look disabled and explain why on hover/focus.
   - Drag, scroll, or swipe interactions are discoverable, not hidden.

The rest: https://github.com/paperclipai/paperclip/blob/HEAD/packages/skills-catalog/catalog/optional/product/design-critique/SKILL.md
