Onboarding Flow Lab

Four layout variants across 16 state fixtures — centered wizard, split-screen, conversational chat, and accordion overview.

Variation←→

State↑↓

ActiveLoading/Original — centered wizard

All Variations(Loading)

Original — centered wizard

Single centered card with step dots, enter animations, and sequential navigation. The default onboarding experience.

Split Screen — branding + content

Left branding panel with contextual messaging, right content panel. Stripe-style two-column layout.

Conversational — chat bubbles

Chat-style message exchange. Bot asks, user responds with actions. Completed steps collapse into dividers.

Accordion — all steps visible

All 5 steps visible as collapsible sections. Current expanded, completed show summary, future dimmed.

State Matrix — all fixtures with first variation

Every fixture rendered to verify visual correctness across all states.

Unauthenticated

Please sign in first

You need to be authenticated to set up your profile.

Go to Sign In

Welcome

Welcome to Sacred

Your journey into cross-platform appreciation begins here.

Profile (Empty)

Set Up Your Profile

This is how the community will see you.

Tap to change

Name

Shown on tips and your profile

Handle

Profile (Filled)

Set Up Your Profile

This is how the community will see you.

Tap to change

Name

Shown on tips and your profile

Handle

Share in your bio to receive tips

Identity (None Linked)

Verify Your Platforms

Link your socials to enable cross-platform tipping.

Signed in with alice@example.com

Identity (Loading)

Verify Your Platforms

Link your socials to enable cross-platform tipping.

Identity (One Linked)

Verify Your Platforms

Link your socials to enable cross-platform tipping.

1 platform linked

Twitch

Identity (Linking)

Verify Your Platforms

Link your socials to enable cross-platform tipping.

Signed in with alice@example.com

Funding (Setup Needed)