AX-WAI-02 · Written

Streaming response

Also called Token streaming, Typewriter, Live response

Show the answer as it is written, so waiting feels like reading.

ProvenUpdated 5 Nov 20266 min readMarkdown GitHub

Story

When I ask the AI for something long, I want to start reading before it has finished, so the wait feels like progress and I can stop it if it goes the wrong way.

Arjun, a team lead, on his laptop, planning a launch week.

01 Setting
Arjun asks the assistant for a 3-step plan for next week's launch.
02 Trigger
A long answer takes the AI 5 seconds to write.
03 Without it
A spinner for 5 seconds, then a wall of text. He cannot tell if it is stuck, and step 1 is already wrong.
04 With it
The first words land in under a second. By step 2 he sees it misread the date, and presses Stop.
05 Outcome
He keeps what was right, fixes the date in 1 line, and asks again.

Live demo

This demo follows a script, so it plays the same every time - there is no real AI behind it. Change a setting to see the same moment play out differently.

Speed

Length

Outcome

Device

Waiting
First words
Streaming
Done

0.0 s / 6.9 s

What happens, step by step

State	The person sees	The AI is	When	Screen reader
1	His message, and the composer (the box where he types) locked to a Stop button.	Receives the ask.	0 s	-
2	3 quiet dots where the answer will be. Stop is already there.	Thinks before the first word.	0 to 1.2 s	“Generating a response”
3	Only on a slow answer: "Still working - long answers take a moment."	Still thinking.	after 4 s	-
4	The answer starts in place, with a caret (a blinking line) at its end.	Sends the first tokens (pieces of words).	1.2 s	-
5	Text grows in whole words. The page does not jump; it follows only if he has not scrolled away.	Writes the rest.	1.2 to 5 s	-
6	The caret goes, Stop becomes the composer again, and Copy, Retry and feedback appear.	Finished.	5 s	“Response complete”
7	Everything written so far stays, with a note that he stopped it and a Continue button.	Stops at once.	on Stop	“Response stopped”
8	What was written stays. A plain line says the connection was lost, with Retry.	The stream broke.	any time	“Response failed”

On each device

phone: The Stop button replaces Send in the same spot, at least 44 px. The keyboard closes when the answer starts, so more of it is visible.
tablet: Same as the phone in portrait. In landscape the answer column keeps its reading width rather than stretching edge to edge.
desktop: Text streams into a column of about 70 characters. Esc stops the answer, and Stop stays visible even when the answer scrolls past the window.

When to use it

Use when

An answer takes more than about 1 second to write.
The output is text people read in order: answers, drafts, code, plans.
People may want to stop early once they see where the answer is going.

Don’t use when

The output is a table, chart or form that only makes sense when complete. Show a skeleton (a grey outline of the shape to come), then the whole thing. Use Generative UI and structured output instead.
The AI is working for minutes on a task, not writing - show steps instead of text. Use Thinking and processing steps instead.
The answer is under 1 second. Streaming then only adds flicker.

The parts of the pattern

AThe askStays on screen, so the answer is read against what was asked.
BStatus lineSays what is happening and for how long: "Generating · 2.1 s".
CGrowing answerText lands in whole words, in its final position - no jumping.
DCaretShows where new text will appear, and that it is still coming.
EStopAlways visible while the answer is written. Keeps what is there.
FComposerComes back the moment the answer ends, ready for a follow-up.

Do and Avoid

Plan my launch week in 3 steps

1. Lock the build on Monday, so the rest of the week is…

Generating · 1.8 sStop

DoA Stop button for the whole time the answer is written.

Plan my launch week in 3 steps

1. Lock the build on Monday, so the rest of the week is…

Generating…

AvoidNo way to stop. If step 1 is wrong, the person has to wait for all 3.

1. Lock the build on Monday.

2. Brief support with the top 5…

You stopped this answer · Continue

DoStopping keeps every word already written, and says so.

Response cancelled.

AvoidStopping throws the partial answer away, so Stop feels like losing work.

Writing and accessibility

Writing

Name the wait honestly: "Generating", then the time. Never a fake progress bar.
After a few seconds of silence, say something specific: "Reading your 3 files", not "Processing…".
Label the button "Stop", not "Cancel" - nothing is cancelled, the text stays.
On an error, keep the text and say what broke in 1 line: "Connection lost after 2.1 s. What was written is kept."

Accessibility

The chat history is a log with aria-live off. The streaming text is never a live region (the part of the page a screen reader announces on its own). Screen readers would re-read it or drop it, token by token.
A hidden status region, set to polite (it waits for a pause) and atomic (it reads the whole message), announces only 4 things: "Generating a response", "Response complete", "Response stopped" and "Response failed".
Stop is a real button. Focus stays in the composer while the answer streams and returns there when Stop goes away.
Under reduced motion (a device setting that turns off animation), text appears in sentence chunks, not word by word. The caret does not blink.
Do not auto-scroll if the person has scrolled up to read - offer a "Jump to latest" button instead.

Seen in real products

OpenAI Apps SDKChatGPT, fullscreen apps · Oct 2026While a reply streams, the overlaid system composer shimmers; afterwards a short snippet sits above the composer and opens the chat sheet.OpenAI Apps SDK UI guidelines ↗
ChatGPTWeb and apps · Nov 2025"Update" lets you add context while a Pro or Deep Research answer is still being written, without starting again.TechRadar, 8 Nov 2025 ↗
GeminiWeb and apps · Oct 2026For agent Tasks, "Stop" sits in the text box itself and cancels the whole task, not only the current reply.Gemini Help: Tasks ↗

Each example comes from the product’s help pages, release notes or teardowns, with the month it was checked. Products change every month - tell us when 1 is out of date.

Check yourself

Q1A person stops an answer half way. What should happen to the text already written?

Q2What should a screen reader announce while text streams?

Sources

Suggest an edit

Seen this pattern done better, or a product that changed? Press Suggest next to any heading, or tell us about the whole page.

AX-WAI-02 · Written

Streaming response

Also called Token streaming, Typewriter, Live response

Show the answer as it is written, so waiting feels like reading.

ProvenUpdated 5 Nov 20266 min readMarkdown GitHub

Story

When I ask the AI for something long, I want to start reading before it has finished, so the wait feels like progress and I can stop it if it goes the wrong way.

Arjun, a team lead, on his laptop, planning a launch week.

01 Setting
Arjun asks the assistant for a 3-step plan for next week's launch.
02 Trigger
A long answer takes the AI 5 seconds to write.
03 Without it
A spinner for 5 seconds, then a wall of text. He cannot tell if it is stuck, and step 1 is already wrong.
04 With it
The first words land in under a second. By step 2 he sees it misread the date, and presses Stop.
05 Outcome
He keeps what was right, fixes the date in 1 line, and asks again.

Live demo

This demo follows a script, so it plays the same every time - there is no real AI behind it. Change a setting to see the same moment play out differently.

Speed

Length

Outcome

Device

Waiting
First words
Streaming
Done

0.0 s / 6.9 s

What happens, step by step

State	The person sees	The AI is	When	Screen reader
1	His message, and the composer (the box where he types) locked to a Stop button.	Receives the ask.	0 s	-
2	3 quiet dots where the answer will be. Stop is already there.	Thinks before the first word.	0 to 1.2 s	“Generating a response”
3	Only on a slow answer: "Still working - long answers take a moment."	Still thinking.	after 4 s	-
4	The answer starts in place, with a caret (a blinking line) at its end.	Sends the first tokens (pieces of words).	1.2 s	-
5	Text grows in whole words. The page does not jump; it follows only if he has not scrolled away.	Writes the rest.	1.2 to 5 s	-
6	The caret goes, Stop becomes the composer again, and Copy, Retry and feedback appear.	Finished.	5 s	“Response complete”
7	Everything written so far stays, with a note that he stopped it and a Continue button.	Stops at once.	on Stop	“Response stopped”
8	What was written stays. A plain line says the connection was lost, with Retry.	The stream broke.	any time	“Response failed”

On each device

phone: The Stop button replaces Send in the same spot, at least 44 px. The keyboard closes when the answer starts, so more of it is visible.
tablet: Same as the phone in portrait. In landscape the answer column keeps its reading width rather than stretching edge to edge.
desktop: Text streams into a column of about 70 characters. Esc stops the answer, and Stop stays visible even when the answer scrolls past the window.

When to use it

Use when

An answer takes more than about 1 second to write.
The output is text people read in order: answers, drafts, code, plans.
People may want to stop early once they see where the answer is going.

Don’t use when

The output is a table, chart or form that only makes sense when complete. Show a skeleton (a grey outline of the shape to come), then the whole thing. Use Generative UI and structured output instead.
The AI is working for minutes on a task, not writing - show steps instead of text. Use Thinking and processing steps instead.
The answer is under 1 second. Streaming then only adds flicker.

The parts of the pattern

AThe askStays on screen, so the answer is read against what was asked.
BStatus lineSays what is happening and for how long: "Generating · 2.1 s".
CGrowing answerText lands in whole words, in its final position - no jumping.
DCaretShows where new text will appear, and that it is still coming.
EStopAlways visible while the answer is written. Keeps what is there.
FComposerComes back the moment the answer ends, ready for a follow-up.

Do and Avoid

Plan my launch week in 3 steps

1. Lock the build on Monday, so the rest of the week is…

Generating · 1.8 sStop

DoA Stop button for the whole time the answer is written.

Plan my launch week in 3 steps

1. Lock the build on Monday, so the rest of the week is…

Generating…

AvoidNo way to stop. If step 1 is wrong, the person has to wait for all 3.

1. Lock the build on Monday.

2. Brief support with the top 5…

You stopped this answer · Continue

DoStopping keeps every word already written, and says so.

Response cancelled.

AvoidStopping throws the partial answer away, so Stop feels like losing work.

Writing and accessibility

Writing

Name the wait honestly: "Generating", then the time. Never a fake progress bar.
After a few seconds of silence, say something specific: "Reading your 3 files", not "Processing…".
Label the button "Stop", not "Cancel" - nothing is cancelled, the text stays.
On an error, keep the text and say what broke in 1 line: "Connection lost after 2.1 s. What was written is kept."

Accessibility

The chat history is a log with aria-live off. The streaming text is never a live region (the part of the page a screen reader announces on its own). Screen readers would re-read it or drop it, token by token.
A hidden status region, set to polite (it waits for a pause) and atomic (it reads the whole message), announces only 4 things: "Generating a response", "Response complete", "Response stopped" and "Response failed".
Stop is a real button. Focus stays in the composer while the answer streams and returns there when Stop goes away.
Under reduced motion (a device setting that turns off animation), text appears in sentence chunks, not word by word. The caret does not blink.
Do not auto-scroll if the person has scrolled up to read - offer a "Jump to latest" button instead.

Seen in real products

OpenAI Apps SDKChatGPT, fullscreen apps · Oct 2026While a reply streams, the overlaid system composer shimmers; afterwards a short snippet sits above the composer and opens the chat sheet.OpenAI Apps SDK UI guidelines ↗
ChatGPTWeb and apps · Nov 2025"Update" lets you add context while a Pro or Deep Research answer is still being written, without starting again.TechRadar, 8 Nov 2025 ↗
GeminiWeb and apps · Oct 2026For agent Tasks, "Stop" sits in the text box itself and cancels the whole task, not only the current reply.Gemini Help: Tasks ↗

Each example comes from the product’s help pages, release notes or teardowns, with the month it was checked. Products change every month - tell us when 1 is out of date.

Check yourself

Q1A person stops an answer half way. What should happen to the text already written?

Q2What should a screen reader announce while text streams?

Sources

Suggest an edit

Seen this pattern done better, or a product that changed? Press Suggest next to any heading, or tell us about the whole page.

Story

Live demo

What happens, step by step

On each device

When to use it

The parts of the pattern

Do and Avoid

Writing and accessibility

Seen in real products

Related patterns

Check yourself

Story

Live demo

What happens, step by step

On each device

When to use it

The parts of the pattern

Do and Avoid

Writing and accessibility

Seen in real products

Related patterns

Check yourself