Rubric vs vibes
Critique the same flawed UI screen twice — first freeform, on vibes alone, then guided by a structured rubric (hierarchy, contrast, affordance, consistency, feedback). The coverage X-ray shows the issues the rubric surfaced that your eye walked straight past. A rubric doesn't make you smarter; it points your attention where it skips. Runs entirely in your browser (0 uploads, works offline).
How to use it
- Read the flawed mock and, on vibes, check every problem you spot.
- Now go dimension by dimension with the rubric — catch anything you missed.
- Read the coverage reveal — freeform vs rubric, and exactly which issues the checklist caught that you didn't.
What this clears up (the fundamentals)
- Heuristic evaluation — expert-looking critique is really a checklist. Hierarchy, contrast, affordance, consistency, and feedback are the dimensions most usability issues fall into.
- Vibes miss blind spots — freeform review over-indexes on whatever jumps out first and skips whole categories (contrast, feedback) that a structured pass reliably catches.
- Why rubrics work — they don't add expertise; they add coverage, forcing your attention across every dimension instead of stopping at the obvious.
- Same person, two scores — the gap between your freeform and rubric counts is the value of the rubric, measured on you.
Where it's used
A Design and UX-review drill — a fast way to feel why design critique should be structured, and a template for your own review checklists. It's a miatz build-lab concept playable; learn to build it yourself.
FAQ
What is a UX/design rubric?
A structured checklist of quality dimensions — commonly hierarchy, contrast, affordance, consistency, and feedback — that you apply to a screen so your review covers every category instead of just what caught your eye.
Why not just critique on instinct?
Instinct is fast but partial. It reliably catches the loud problems and skips quiet ones (low contrast, missing feedback). A rubric closes that gap — which this page measures directly by comparing your two passes.
Is anything uploaded?
No. The mock screens and scoring are bundled and run entirely in your browser — nothing is transmitted or stored. Turn off your Wi-Fi and it still works.
Which dimensions does it check?
Hierarchy (visual structure), contrast (legibility), affordance (does it look interactive), consistency (same thing = same treatment), and feedback (does the UI confirm actions). They're the backbone of most heuristic-evaluation rubrics.
Limits
A teaching exercise on a couple of seeded flawed mocks, not your product's UI. The point is to train the two-pass habit; bring the same rubric to your real screens next.
Related
Part of the miatz playgrounds. Explore the rest from the playground catalog.
Bookmark this page (Ctrl+D, or ⌘D on Mac) — it works offline the next time you need it.