Screens

The 10 lo-fi screens extracted from the Figma "NEW 4 UI" page, section 200:2864. Manifest order below is not flow order — flow-based navigation arrives in S-004 (flows.ts). Click any entry to preview the extracted content in the current theme.

  1. Landing landing First-touch screen. Shows two entry cards side by side — a quick-thought input and a deeper-reflection textarea — both leading to lens selection. The header theme switcher replaces the old inline tabs.
  2. Input input Merged into the Landing screen as the "Go deeper" card. This route remains for direct navigation fallback but no flow lists it as a stop.
  3. Quote + lens selection quote-lens-selection After the user submits their quote, the lens grid appears. Each cell pairs a historical figure with an emoji reaction to preview that figure's tone.
  4. User Quote + lens user-quote-lens Post-selection result. Shows the user's quote, the historical figure's response, the selected lens badge, sharing actions, and a path back to try another lens.
  5. Lens Overlay lens-overlay Modal lens picker shown during the free trial. Includes a usage-left counter and a paywall hint pointing to account creation. Paywall flow claims this covers the subscription-unlocks need via the "2 lenses left for today / Create account to unlock more" copy.
  6. Sticker overlay sticker-overlay Sticker picker that opens over the post screen once the user taps "add stickers". Credits the artist and upsells a paid pack.
  7. Create Account create-account Account creation form with both native fields and social auth options. Footer asks permission to share the contact library. The critical paywall-adjacent screen for this blueprint.
  8. Profile — home profile-home Post-signup journal home. Shows the most recent quote with lens badges and the welcome-to-journal onboarding block listing what was unlocked.
  9. Profile — journal entry profile-journal-entry Single journal entry view. Shows the user's quote, the figure's response, the selected lens, decorative MindShift watermarks, and actions to add stickers or share to socials.
  10. Profile — home (alt) profile-home-alt Alternate canvas placement of the journal home screen. Byte-identical welcome content to profile-home; preserved because the designer stacked two instances vertically in the Figma file.