agentleFS
fergo5002fergo5002/design-director/skills/design-review/SKILL.md

design-review

Skill1 starsChanged 4 days agoMITView on GitHub

Use before calling any front end, page, deck or visual done, and whenever someone asks "is this good", "does this look AI-generated", "review the design" or "why does this feel off". Runs the gate in code (contract, claims, slop and brand lint, renders at the real viewports, copy fidelity, reading load), then scores fresh screenshots against nine anchored areas, writes ranked notes, records the review with a verdict computed by rule, and for anything important gets an unanchored second opinion. Logs what it finds to the taste ledger.

164 other projects use a version of this.

Adopted by

Most recently taken up by

Used with

Projects with it also use project-stage-detect, team-audio and 10 more.

Other files people use alongside this one.

Files found in the same public projects as a version of this one, more often than they turn up anywhere else. Each project counts once, large collections count for less, and this file's own repository is left out.
  • CoralGameSkill

    project-stage-detect

    Automatically analyze project state, detect stage, identify gaps, and recommend next steps based on existing artifacts.

    Also in 16 projects that use this

  • CoralGameSkill

    team-audio

    Orchestrate audio team: audio-director + sound-designer + technical-artist + gameplay-programmer for full audio pipeline from direction to implementation.

    Also in 13 projects that use this

  • julianoczkowskiSkill

    brief-to-tasks

    Break a design brief into an ordered checklist of independently buildable tasks using vertical slices. Saves as a markdown checklist. Use when user wants to break down work, create tasks from a brief, plan implementation order, or mentions "tasks" or "breakdown".

    Also in 7 projects that use this

  • lilangMaxSkill

    asset-spec

    Generate per-asset visual specifications and AI generation prompts from GDDs, level docs, or character profiles. Produces structured spec files and updates the master asset manifest. Run after art bible and GDD/level design are approved, before production begins.

    Also in 10 projects that use this

  • lilangMaxSkill

    create-control-manifest

    After architecture is complete, produces a flat actionable rules sheet for programmers — what you must do, what you must never do, per system and per layer. Extracted from all Accepted ADRs, technical preferences, and engine reference docs. More immediately actionable than ADRs (which explain why).

    Also in 10 projects that use this

  • +4 more from CoralGame
  • +3 more from lilangMax

The file

We split this skill into the rules it gives an agent

11 rules. 0 are common, 5 are distinctive, and 6 are very specific to this project.

  • 0

    Common

    Most of the 137 edited versions we read keep these.

  • 5

    Distinctive

    This author's own choices. Worth a look.

  • 6

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Very specific:

    Accuracy: Every number, date, name, comparison and superlative traces to a source in the claims ledger (.design/brief/claims.json), checked …

    line 18
  2. Distinctive:

    Deterministic gates: Run them, all of them, in code:

    line 22
  3. Very specific:

    The ask: When someone asked for a specific change, that change is the bar.

    line 34
  4. Very specific:

    Prove the instrument before accusing the object: If a browser tool hangs or returns something strange, paste tools/instrument-check.js into …

    line 37
  5. Very specific:

    Never score from the maker's own sheet or from memory.

    line 44
  6. Very specific:

    Put the work beside the two best exemplars in the domain (ddr domain brief <slug> lists them) at the same size.

    line 53
  7. Distinctive:

    severity: MUST-FIX or NICE-TO-HAVE

    line 84
  8. Distinctive:

    rework: if idea scores 2 or less, or any area scores 1

    line 90
  9. Distinctive:

    ship: if every area scores 4 or more and no note is MUST-FIX

    line 91
  10. Distinctive:

    Write the review as JSON and record it against the gate run:

    line 98
  11. Very specific:

    If the review showed that a reference in the domain led you somewhere bad, retire it with the reason (ddr domain ref retire <slug> <id> …

    line 157

“Common” is measured: kept by at least 6 in 10 of the 137 edited versions of this file we could read. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

Design review

Tools: ddr <command> once installed (python tools/ddr.py install), otherwise python <repo>/tools/ddr.py <command>, where <repo> is two folders above this skill's real (symlink-resolved) folder.

A review that could not have failed is a ritual. The order below is fixed so the cheapest check that could catch a disaster runs first, and nothing is called good on the strength of a check that cannot see beauty. The rubric is a reading aid for judgement, not a scorecard to optimise: a piece that hits every anchor and still reads like generic marketing scores low on idea.

1. Three gates before any score

  1. Accuracy. Every number, date, name, comparison and superlative traces to a source in the claims ledger (.design/brief/claims.json), checked by a script or a direct read, never from memory. EVIDENCE.md in design-director has the method. An invented feature or figure fails the piece outright, however well it is made.
  2. Deterministic gates. Run them, all of them, in code:

    python tools/ddr.py gate run --src <src dirs> --file <page.html>   # or --url <url>
    python tools/ddr.py gate run --src <src> --url <url> --copy copy.txt --brand <slug>

    Seven steps in a fixed order: contract, claims, lint, brand, render, fidelity, load. Exit 1 is a finding to fix. Exit 2 means a step did not run, which is never a pass. For a non-web artefact (a PDF, a print file) say why: --no-render --why "<reason>". The receipt hashes every input, so ddr gate verify knows when the work changed after it was checked.

  3. The ask. When someone asked for a specific change, that change is the bar. Check it first, against the contract (.design/brief/contract.json), before judging anything else.

Prove the instrument before accusing the object. If a browser tool hangs or returns something strange, paste tools/instrument-check.js into the page first. A hidden tab never fires requestAnimationFrame, so every frame-based probe hangs and looks exactly like a frozen page.

2. Regenerate the evidence

Never score from the maker's own sheet or from memory. Score from the shots of this gate run (.design/gate/<run_id>/shots/). Open at least the phone fold and a desktop or mac fold; ddr review record refuses a review that does not list both. Then make your own views:

python tools/ddr.py sheet --images <yours.png> <exemplar.png> --labels "Yours,Best" --cols 2 --out sheet.png
python tools/ddr.py crop <before.png> <after.png> --box L,T,W,H --scale 2 --out pair.png

Put the work beside the two best exemplars in the domain (ddr domain brief <slug> lists them) at the same size. Zoom into type and fine geometry with a crop. For an edit, crop the same region before and after. If the work is plainly weaker than the category's best, say so, whatever the scores say.

3. Score the nine areas

Score each 1 to 5; 4 and 2 sit between the anchors. Cite the shot, the crop, the size or the number behind every score.

Area531
IdeaOne sentence a stranger could repeat; a real thing shown or bold type carrying it; survives the kill testA real message, but the visual idea is generic or arrives as decorationNo message; shapes, glows or a stock field standing in for a concept
HierarchyOne focal element read first on the phone fold, at most two demands, the rest stepped down hardReadable, but two elements compete or the support is too loudFlat: everything at one weight, or labels where the headline should be
CopyFewest words; each fact once; supplied copy exact (fidelity step clean); voice and casing from the brandAn unrequested sub-line, caption or eyebrow; a word too manyInvented copy, banned hype, or supplied copy changed
CraftType sized for the view it ships at, optical spacing, every state designed (hover, focus, empty, error, loading), motion lands on a finished stateCorrect but stock: default spacing, tight padding, one awkward wrapClipped or garbled text, broken alignment, a missing focus state
BrandTokens only, one accent with meaning, the real logo at its size and clear space (brand step clean)A slip: a second accent, a radius past the cap, the logo too smallAn invented colour, a redrawn logo, off-brand faces
FitThe right treatment for this subject and audience; each viewport recomposed, legible at the smallestOne size scaled rather than recomposed, or small text lost on a phoneWrong treatment for the audience, or text under platform chrome
TruthEvery claim in the claims ledger verified (claims step clean); nothing on the page the ledger does not holdA claim verified by memory rather than a read, or vaguer than its sourceA false or unsourced headline claim
DistinctivenessThree named decisions a model would not make by default, and all five tests in SLOP.md passOne or two such decisions; one SLOP.md test failsNone you can name, or two SLOP.md tests fail
LoadWords and screens fit the job (load step: words in main, screens per viewport, no run of text-only sections, smallest text 14px or more)Long for its job, or two text-only sections in a rowA wall: hundreds of words of prose, text under 12px on a phone

Fewer than three named decisions caps distinctiveness at 2. Write the three decisions into its evidence.

4. Notes and strengths

At most 12 notes, ranked by impact. Each has:

  • where: the shot and region (phone fold, hero), or the file and line
  • what is wrong, why it matters to the person looking, and the concrete fix
  • severity: MUST-FIX or NICE-TO-HAVE

Then name the strengths to protect, so the next pass does not break what works.

5. The verdict follows a rule

  • rework if idea scores 2 or less, or any area scores 1
  • ship if every area scores 4 or more and no note is MUST-FIX
  • fix-then-ship otherwise

The rule lives in code. A review whose verdict does not match it is refused.

6. Record it

Write the review as JSON and record it against the gate run:

python tools/ddr.py review record --run latest --json review.json
python tools/ddr.py review show
{"reviewer": "self", "scores": {"idea": [4, "evidence"], "hierarchy": [4, "..."], "copy": [5, "..."],
  "craft": [4, "..."], "brand": [5, "..."], "fit": [4, "..."], "truth": [5, "..."],
  "distinctiveness": [4, "three decisions: ..."], "load": [4, "..."]},
 "notes": [{"where": "phone fold, hero", "what": "...", "why": "...", "fix": "...", "severity": "nice-to-have"}],
 "strengths": ["..."], "viewed": [".design/gate/<run_id>/shots/<file>.png"],
 "compared_with": ["<exemplar shot at the same size>"], "verdict": "ship"}

reviewer is self or independent. ddr gate verify --require-review passes only when the receipt is current and the recorded verdict is ship. Changing any input after the review makes the receipt stale: run the gate and review again. When the gate genuinely cannot apply, ddr gate waive --reason "<why>" records that openly and logs it as an error in the taste ledger. It is never silent.

7. Failure patterns

PatternWhat it looks likeFix
WallpaperA headline over a field of nodes, dots or glowsFind the real thing to show, or let bold type carry it
Over-full frameThree or more things to read separately on one screenSplit it, or cut the weakest
Flat hierarchyHeadline, labels and support at similar sizesOne element big and at full contrast; the rest step down hard
Extra wordsA sub-line, caption, URL or eyebrow nobody asked forDelete it; put the explanation in the reply
Scaled, not recomposedThe phone layout is the desktop one shrunkRecompose each size; spend the extra height on content
Template samenessEvery section one layout recolouredVary the spatial idea; keep the system
Lost on a phoneProof text at 11px on a 390px screenFewer words, larger type
Unofficial logoA typeset stand-in or recoloured markThe real file from the brand pack, at its minimum size or larger
Generic software lookMono on prose, tracked uppercase labels, everything centred, floating columns, glowsSame content: mono only for literal values, labels in the text face, one alignment, real containers, no effects
Faked weightA light face stroked or outlined to look heavierA real weight of the face, or more size
Silent fallbackThe chosen face never painted, so it ships in the system fontFix the font load until the render step's font check is clean
Self-review"It's fine" from the makerAn independent look with fresh evidence (section 8)

8. Unanchored second opinion

For anything that ships to real people, get a review that has not seen your reasoning. Give a fresh agent (or a person) the screenshots and the brief, not your conclusion, and ask it to score the same nine areas and name the three weakest things. Record it with "reviewer": "independent". Compare. Where it disagrees with you, look again before defending your version.

9. Report with limits, and log

Report: the gate verdict and receipt, the review verdict, what failed with evidence, what you fixed, and what you did not check (real devices, Safari, slow networks, real data, licences). Then log:

python tools/ddr.py taste error "<what went wrong in the process>" --why "<cause>" --rung observed --prevention "<rule>"
python tools/ddr.py taste miss "<rejected design move>" --why "<reason>" --tags <axis:value> --rule "<rule you edited>"
python tools/ddr.py taste shipped --what "<thing>" --tags <axis:value,...> --domain <slug>

If the review showed that a reference in the domain led you somewhere bad, retire it with the reason (ddr domain ref retire <slug> <id> --reason "...").

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.