Design guide · Eval

The design scorecard

A repeatable way to grade any page's design — six categories, 0–10 each, 60 total. Use it on your own site, or read the network snapshot below.

◑Honest framing. The table is a living worksheet with illustrative, self-assessed starting scores — not an audited ranking of all ~190 network sites. Grade any site properly by running /layout plus the "Grade a site" prompt, then update its row.

The six categories

Each scores 0–10. A page can be beautiful and still fail the craft floor — grade every column on its own.

1. Distinctiveness
Does it look like this subject, or like any AI page? Penalize the three defaults: cream-serif, dark-acid, broadsheet.
2. Typography
A deliberate display + body pairing, a real type scale, intentional weight and spacing — not one neutral system font.
3. Palette & color
4–6 named values, mostly quiet with one reserved accent; consistent and readable in light and dark.
4. Signature element
One memorable thing the page is remembered by — and restraint everywhere around it.
5. Motion & a11y
Motion that serves, honoring prefers-reduced-motion; visible focus; honest contrast and alt text.
6. Craft floor
Reflows to mobile, no CSS-specificity collisions, no broken tiles, clean render at both widths.

Network snapshot · illustrative

A seed sample to show the rubric in use. Scores are first-pass self-assessments to be confirmed with /layout.

SiteDist.TypeColorSig.Motion/a11yCraft/60
wholetech.com flagship · AF 100 99989953
fableguide.com/design this guide 99898851
childrensfable.com kid/elder safe fables 98888950
fableguide.com homepage 89868847
convcast.com/power summit hub 87886744
thaivillaexchange.com owner-direct villas 77867843
hulloships.com vessel marketplace 67766840
robotnewstoday.com news engine 56646734
generic /live/ pages mass-content template 35536628
9–10 distinctive 7–8 strong 5–6 competent ≤4 templated

Reading it: the mass-content template pages carry the network's design debt — they clear the craft floor but score low on distinctiveness and signature, exactly where the method pays off. That's the queue.

Score a site in four steps

  1. Look first. /layout example.com — desktop + mobile screenshots, read back.
  2. Grade the six columns 0–10, honestly. Distinctiveness is the one most pages lose.
  3. Name one fix per weak column — the highest-leverage change, not a wish list.
  4. Update the row and re-shoot after the fix. The number should move.

The ready-made prompt is on the Act page → "Grade a site's design."