Produce a multi-screen mobile prototype on a single dark showcase page.
Three phone frames side-by-side, each one its own moment in the journey.
Workflow
Read the active DESIGN.md (injected above). For gamified apps, lean
on bold display type for headlines and a brighter, broader palette than
most products — quests look like quests because the colors do.
Pick the brand + value prop from the brief. Generate real quest
names (e.g. "Body — 20-min strength: pushups & planks", "Read — Four
Thousand Weeks", "Listen — Huberman Lab · Sleep Architecture",
"Nourish — Cook a high-protein lunch", "Mind — 10-min focus
meditation", "Watch — The Bear · S3 E4").
Stage — full-bleed dark page (near-black #0e0d0c or DS dark token)
with a soft top spotlight gradient. Above the phones, a small caption
row: "HI-FI PROTOTYPE · IPHONE" left, brand wordmark right, both in mono.
Phones — three 360×780 phone frames in a horizontal row (wraps to
stack on narrow viewports). Each phone:
12px black bezel, 44px corner radius, dynamic-island notch.