/
Landing
Hero with spark logo, "Build meaningful connections through self-discovery," and three feature cards.
AS IS
▲ Improved
Loading / signed-in / signed-out
Pulled from the live codebase: design tokens, fonts, animations, the celestial starfield and aurora overlay reproduced 1:1. Each screen ships an AS IS and an Improved variant, and a state toggle for Default · Empty · Loading · Error. The improved variants are conservative-bold: I restructured layouts and IA where it was clearly worth it; everything else stays close to today's UI.
The unauthenticated funnel: from a viral link or affiliate code into the first reflection.
Hero with spark logo, "Build meaningful connections through self-discovery," and three feature cards.
Clerk widget — username + password + magic link. Centered card on the celestial canvas.
Clerk widget — paired with sign-in. Used after Chapter 1 to "Bind this Book."
Affiliate-code landing: who sent you, what you get, "Start your story" CTA.
A friend invited you — accept, see their match code, jump to onboarding.
The reflection engine: guest-first onboarding, the chapter library, and the long-form survey.
Guest-first: book spread layout, progress ring, autosave, "Bind this Book" → sign-up.
Tier-gated cards (Open / Standard / Premium). Stats header, key-cost unlocks.
Same renderer as onboarding but inside the main shell. SurveyJS-backed question types.
Where the product earns its name — pending requests, active matches, deep insight, chat, video.
Active / Pending / Expired tabs. FAB+sheet on mobile, action-pill row on desktop. Optimistic accept/decline.
Shared themes, differences, conversation starters. AS IS still uses purple chrome from a leftover Tailwind class — flagged.
Conversation thread, conversation-starter chips, typing indicator, deadline banner.
LiveKit room view: tile, controls, deadline. The AS IS today is bare-bones — improved version adds a structured room.
Generate a narrative biography from completed answers, browse old volumes, and read one.
Pick questions to include, watch the cost summary update, confirm.
Read the generated narrative — title, chapters, prose. The AS IS today is plain — improved adds reading chrome.
Past generations as a bookshelf. Cover, date, question count, "Read".
Account info, identity, payment.
All admin surfaces — dashboard, users, matches, chapters, questions — consolidated into a single tabbed shell with persistent sidebar. The AS IS preserves the react-admin look; Improved is a real product-grade admin.
AS IS: react-admin dashboard + 4 list pages, each on its own route. Improved: single shell with persistent sidebar, KPI dashboard with sparklines, in-context search, moderation queue, audit log, billing health. Click any sidebar item to switch surface. Survey-v2 builder is intentionally skipped.
react-admin List view: paginated table of all questions, filters by chapter and input type.
CRUD for chapters: title, description, tier, key cost, sort order.
React-admin user list. Subscription status, credit balance, match count.
All matches across the system. Filter by status, communication-fulfilled, partners.
SurveyJS-creator embedded view. Drag-drop questions, preview pane, save into chapter.