Every module is its own embed with its own sign-in. No module picker anywhere in the flow.
New user — 3 steps + confirm
Welcome → Name → State → Email → Confirm code → Module begins
One question per screen. Each answer feeds the next screen’s copy.
Returning — by email
Welcome → “Resume” → Email → Module, at last position
No password — email is the key. An unknown email offers the new-user path instead of erroring.
Returning — remembered
Cookie found → “Welcome back, Nadia” → Module, at last position
Zero taps to resume. Always offers “Not you?” to fall back to the email path.
Why this order? Name first — it’s the easiest thing to give and it personalises everything after. Email last — it’s the one people hesitate over, and by then they’ve already invested two answers.
Open questions.
· Do we need to confirm email? Makes it more secure. Adds a step.· Is state captured only for reporting?· Do we need to capture actual playgroup name?· Do users all have a unique email? Does anyone share an email?· Do users share a device?
Clickable onboarding flow — same source as the wireframes board. Type a name, pick a state, enter any email and any six digits. “Resume” walks the returning path.
Visual treatment plus two directions for the Module 2 screens. Tap the story pills and the belonging cards — they work. Two directions to react to, not a final pick.
Include to Play · Learn to Play
Visual treatment
Bold, layered, light on its feet. Colour fields carry the page; white shows up as organic shapes that hold content. Separation by tone, never by shadow.
01 Colour — nine brand + two extensions
Dark teal #24696E
Mid teal #478A8F
Light teal #669E9E
Deep red #CF4545
Coral #F2614F
Light coral #F27D70
Mauve #997591
Light mauve #C29EBD
Peach #FAA899
Gold #FFBF00
Stone #CFCFC4
Paper #FFFFFF · #F6F2EA
Colour sets rhythm, not meaning — max two field colours per screen. Pure white is for cards only; it earns its brightness on a colour field or on Paper, never as the page itself.
02 Type & components
Supporting Families
display · Hegarty (Poppins stand-in) · one per screen
Creating belonging through empathy
heading · Outfit 700
Body copy is Outfit 17px, 1.6 leading, a ~52-character measure — roughly nine words a line, the readability floor for this audience.
body · Outfit 400 · 17px/1.6
Note: this bold/layered direction supersedes the “minimalist” steer in docs/style.md §1 — that doc needs updating upstream. The token architecture there still holds; only the aesthetic values change.
Direction A — “Colour field” · full-bleed hues, white cards on blobs, coral-led
logo placeholder
20 min
Learn to Play · Module 2
Supporting Families
Three practice tips for building belonging with families who are new to playgroup — and new to asking for help.
Self-paced · your progress saves automatically
Practice Tip 1 · Empathy3 / 6
Consider a family’s prior experience
A family arriving at your playgroup carries every group they’ve already tried. Tap a name to hear what happened.
portrait · Ellen
“”
Practice Tip 1 · Empathy4 / 6
Creating belonging
Six things facilitators do that make a family feel they belong. Open each one.
0 of 6 opened
Direction B — “Paper cut” · stone-paper base, big type, overlapping panels, teal-led
logo placeholder
Module 2 of 3
Learn to Play
Supporting Families
Twenty minutes, three practice tips, and one question worth sitting with: what does this family already expect from us?
Practice Tip 1 — Empathy7 min
Practice Tip 2 — Checking in5 min
Practice Tip 3 — Conversations6 min
Prior experience3 / 6
What they bring with them
portrait · Ellen
“”
Reflect: whose first visit have you never asked about?
Practice Tip 1 · Empathy4 / 6
Creating belonging
Six moves, six sheets. Open the ones you want to take to Thursday.
1 of 6 opened
Links out to the real build and the living design references. Swap the placeholder URLs for the real ones.