Waypoint — design lab

Ten concept directions for the main screen, as additional routes we could take. These are exploration mockups — not wired up. The 5 fully-built versions are live in the app; switch between them with the buttons below (or press 1–5 anywhere in the app).

← Back to the app 1 · Marker 2 · Boarding 3 · Journal 4 · Rail 5 · Console 6 · Neo-brutalist 7 · Swiss 11 · Neo · Airline 8 · Map-forward 9 · Transit 10 · Soft pastel
P1Swiss (refined)
readable accent, letter-spacing, less boxing
open ↗
P2Neo-Brutalist (refined)
bold route block kept, info text normalized
open ↗
P3Map-Forward (refined)
legible info text, clear contrast
open ↗
P4Route Cards
big glanceable route/stay cards
open ↗
P5Clean Agenda
no boxes, hairlines, calm
open ↗
P6Transit Line
itinerary as a subway line
open ↗
P7Warm Single-Accent
one strong coral, friendly
open ↗
P8Clean Dark
legible dark mode, one vivid accent
open ↗
P9Soft Pastel
pastel accents, dark readable text
open ↗
P10Big Numerals
clean big times as the anchor
open ↗
N1Split — flight vs stay
flights & hotels obviously different card types
open ↗
N2Ticket & Keycard
flights=boarding stub, hotels=keycard
open ↗
N3Journey-first
the whole-trip flow is the hero up top
open ↗
N4Clean Planner
calm planner, asides faint, open time soft
open ↗
N5Bold Index
big type, flight bands + distinct hotel bands
open ↗
N6Warm Duotone
tier = color: flight/stay/aside toned
open ↗
G1Dotted Path
winding path, you-are-here flag
open ↗
G2Metro Map
transit line, current station pulses
open ↗
G3Segmented Bar
ultra-compact progress segments
open ↗
G4Day Blocks
calendar strip, anchors per day
open ↗
G5Journey Ring
arc gauge, Day 3 of 5
open ↗
G6Passport Stamps
stamps inked as you go
open ↗
S1Segmented Bar @ scale
6 vs 16 steps: asides become ticks
open ↗
S2Metro Map @ scale
6 vs 16 steps: line wraps/snakes
open ↗
S3Journey Ring @ scale
6 vs 16 steps: only anchors get icons
open ↗