AI UX PlaygroundNewsletterJoin 2K+ AI designers and PMs on Substack. New teardowns, patterns, and prompts as they drop.

Outputs

Scroll to Bottom

When someone has scrolled up during generation or new turns, show a control to jump to the latest message. People can read history without losing the newest output.

Interactive demo

Conversation
What are the best practices for building AI chatbots?
Great question! Key practices include: clear error handling, streaming responses for better UX, providing context about AI limitations, and implementing feedback mechanisms.
Can you explain more about streaming responses?
Streaming allows the AI to send responses incrementally as they're generated, rather than waiting for the complete response. This makes the interface feel more responsive and natural, similar to how humans type.
What about handling errors gracefully?
Error handling is crucial. Always provide clear, actionable error messages. Use retry mechanisms, show fallback options, and explain what went wrong in user-friendly language. Never expose technical details directly to users.

Overview

How might we design scroll to bottom so people can trust and act on AI output?

When to use

  • Essential for all chat-based AI interfaces, messaging applications, and real-time collaboration tools where users need to stay aware of new messages while reviewing history.

When to skip

  • Single-screen tools with no scrollable transcript.
  • Paginated histories that are not live-updating.
  • When auto-stick-to-bottom would fight intentional review (offer the jump control instead of forcing scroll).

Rules

  • Forcing scroll to bottom on every token while the user is reading up.

  • No indicator that new messages arrived above the fold.

  • Jump buttons that skip over unread turns without marking them.

  • Covering the composer with the jump control.

Evidence

ProductImplementation
ChatGPTJump-to-latest while streaming if scrolled away.
DiscordNew messages bar to return to live chat.
SlackNew message indicators and jump controls.
Microsoft TeamsUnread and jump-to-bottom patterns in threads.

FAQ

When should a chat auto-stick to bottom?

Only while the user is already at the bottom. If they scroll up, pause sticking and show a jump control.

What should the jump control show?

“New messages” or a count, not only a chevron. Optional preview of the latest line helps.

How does this interact with streaming?

Keep streaming in place off-screen; do not yank the viewport. Let users jump when ready.

Mobile specifics?

Place the control above the composer with enough tap target, and avoid fighting the on-screen keyboard.