Who's Paying · five design baselines
Same flow and content in all five, different visual systems. Each file is standalone and interactive: home, scan, result, unlock dialog, unlocked report, review queue. Pick a direction, or pick parts from several.
-
safe · product-grade
01 · Ledger
The shadcn-neutral baseline. White, zinc, one emerald accent for money signals. Single column, list rows instead of tiles, stepper scan. The safe, credible option.
Geist throughout · radius 8/12 · hairlines -
dark · dense
02 · Nightdesk
Dark analyst's desk. Aubergine base, saffron for money, a cool blue for interaction. Serif display, two-column result with a sticky rate-card rail. Feels like a private intelligence report.
Instrument Serif + Instrument Sans · radius 6 · no shadows -
editorial · bold type
03 · Mediakit
Editorial. Reads like the creator's own printed media kit: huge Fraunces headline, heavy rules between sections, a price list with dotted leaders, rani pink for the gap and the unlock.
Fraunces + Public Sans · square corners · 2px rules -
friendly · shareable
04 · Reelgrid
Instagram-native bento. Rounded tiles, violet and mint, a pill input, frosted locked cards, a progress ring on the scan screen. The one a creator screenshots and posts.
Bricolage Grotesque + DM Sans · radius 20/12/pill -
precise · data-first
05 · Signal
Swiss monochrome with one signal red. Strict 8-column grid, huge tabular numbers, a timeline scan screen with a proof panel, locked names as solid bars instead of blur.
Space Grotesk throughout · radius 4 · visible gutters
Contact sheet: every route at desktop and phone width (reduced motion, top of page). Tap any thumbnail to open that exact screen live. On your phone, the mobile column shows what you will actually see.
01 · Ledger
Desktop 1280 · Mobile 390
02 · Nightdesk
Desktop 1280 · Mobile 390
03 · Mediakit
Desktop 1280 · Mobile 390
04 · Reelgrid
Desktop 1280 · Mobile 390
05 · Signal
Desktop 1280 · Mobile 390
What to judge, in order:
- Does the home screen make you type a handle within five seconds?
- Does the scan screen feel like real work is happening, and would it still feel that way if it took a minute?
- On the result screen, is the unlock the obvious next step without feeling like a paywall?
- Do the numbers read as trustworthy (tabular, Indian grouping, sources named)?
- Phone width: does anything break at 390px?
Shared content spec: BRIEF.md. Screenshots for every route and viewport are in shots/ after running shoot.py.