Complete User Flow

The app's entry point. Zoe introduces herself and speaks the headline and subline aloud. The diagonal colour blocks (Mango, Sky, Lime, Rose) signal the app's energy without text. The single CTA — 'Start Learning' — is the only action available.

Zoe runs a short diagnostic conversation to assess the user's current spoken English level. This is a free-form chat, not a quiz. The transcript area shows the back-and-forth. Mic button is the dominant action — tap to speak, tap to stop.

When the user is speaking, the mic button shows a waveform animation to confirm it's capturing audio. The label changes to 'Tap Mic to Stop'. This same mic-active state is reused in the main conversation screen.

A secondary fallback for users who are uncomfortable speaking immediately. The keyboard icon bottom-left toggles to text input mode. This is intentionally secondary — voice is always the primary channel.

After the assessment conversation, Zoe reveals the user's level with an encouraging framing. The screen shows the level name (e.g. B1 · Speaking Freely) and a brief description. CEFR codes are shown here in v1 but will be hidden from student-facing surfaces in production. Single CTA moves them to the home screen.

The main home screen. Zoe waits in the centre. Topic chips (Sports, Food, About Myself, Daily Life, Travel, Movies & TV, Work & Study) are colour-coded by interest family. Bottom-left offers a 'Zoe can pick something fun' fallback — this starts a free-form session where Zoe chooses the direction.

The user's profile — name, level, personal info (age, location, email). Below the info card is 'Zoe's Coaching Style' where Grammar, Vocabulary, and Fluency settings can be adjusted. For A1–A2 users, this coaching section is hidden — the app manages settings automatically at lower levels.

Tapping 'Edit' opens a bottom sheet for updating name, age, location, and email. A full-width Mango CTA saves changes. The underlying profile screen remains visible but dimmed — the bottom sheet keeps the user oriented.

Coaching settings visible only to B1+ users. Three dimensions: Grammar (Off / Some / Catch All / Full), Vocabulary (Off / Post / Occasional / Active / Intensive), Fluency (Off / After Chat / Nudge / Active / Full). Each setting has a plain-language description. A1–A2 users never see this — Zoe manages coaching silently at lower levels.

The main conversation interface. Zoe's mascot sits in the upper half; her speech appears in a Sky-blue bubble with Kalam font beneath her. The orange mic button is the dominant action. Bottom-left: keyboard toggle. Bottom-right: caption toggle. Topic label top-left; END button top-right.

Tapping the caption toggle (bottom-right) hides Zoe's speech bubble. Audio-only mode for users who want to focus on listening rather than reading. The caption icon changes state. Mic button remains dominant.

Tapping END shows a confirmation bottom sheet rather than immediately exiting. Zoe's expression shifts to a subdued state. Two CTAs: END (red) and KEEP TALKING (Mango). This reduces accidental exits mid-session.

If the user ends before speaking anything, this screen appears instead of the summary. Copy: 'Looks like we lost you there. No chat happened — that's okay.' Two CTAs: PICK NEW TOPIC and TRY AGAIN. Zero shame, full restart. No metrics shown since nothing was captured.

Triggered when the session had substantive exchange (5+ turns). Header: 'Great Conversation!' Shows: duration + topic, Best Moment quote, Moment of Courage callout, One Thing to Try Next Time with an example sentence, and a Word of the Day card. Full transcript accessible bottom-right.

For sessions with some exchange but below the 'great' threshold. Header: 'Good Effort Today'. Same structure as the great screen but without the Moment of Courage callout. Warm and forward-looking, not evaluative.

For short or struggling sessions (1–4 turns). Header: 'Every Session Counts'. A green 'Keep the Habit' callout replaces the Moment of Courage: 'Coming back tomorrow matters more than today's mistakes.' The One Thing tip is still present. The framing treats returning as the win.

Appears only after the user's first conversation, and only at B1 or above. Shows the three coaching sliders with their options. A note: 'You can change these anytime in the profile later.' CTA: PICK NEW TOPIC. A1–A2 users never see this screen — coaching is managed silently at lower levels.

Accessible from any post-session summary via 'Read transcript'. Opens as a bottom sheet over the summary screen. Shows the full turn-by-turn conversation: Zoe's turns in Sky blue (Kalam font), user's turns in Mango bubbles. Scrollable. Summary context remains visible behind.