design-critique

Installation
SKILL.md

Design critique: findings you can pick from

One round is: scope → capture → read → findings → ideas → page → publish. The page is the deliverable. The user ticks the ideas they want, hits Copy prompt and pastes it back; you implement those, then the page drops them.

Words used below:

  • Subject: the site, app, game or screen being critiqued.
  • State: one distinct thing the subject can show: each screen, variant or item, empty, loading, error, done/complete, hover/focus, open dialogs, transitions in and out, the hand-off to the next screen.
  • Shape: a viewport the subject must work at. Default set: desktop 1440×900, tablet portrait 768×1024, phone portrait 390×844, phone landscape 844×390.
  • Finding: one concrete problem, with evidence (a value, a file, a measurement) and a severity about how much it holds the design back.
  • Pin: a numbered marker on a screenshot, placed in percentages of the image, pointing at a finding.
  • Idea: one change that fixes one or more findings, with an impact, an effort, the files it touches, and a preview.
  • Preview: a small before/after mock built in CSS from the subject's own visual language (its colours, type, button shapes), so the user judges the real look.
  • Pick: an idea the user ticked. Picks save to the page so you can read them back.

Paths below are relative to this skill's directory: assets/, references/.

1. Scope

Installs
1
Repository
zkmake/skills
GitHub Stars
2
First Seen
Oct 1, 2026