Trust

Progress Steps

Share

Progress steps is an AI interface design pattern that surfaces the model's work as collapsible "thinking" traces or tool steps (search, retrieval, code execution, API calls, and similar). It threads a usability needle: collapsed by default so dense sessions and power users are not punished with noise, while still expandable on demand so curiosity and skepticism both have a clear door to open. Users who want flow stay in the answer; users who want provenance or debugging detail can peel back the timeline without leaving the thread. The pattern supports trust, education, and supportability in assistants, search-style products, and agentic flows where "what happened" matters as much as the final reply.

Use Case

Use when the system performs visible intermediate work (search, tools, multi-step reasoning) and you need both a calm default UI and optional transparency for verification, learning, or troubleshooting.

Examples in Wild

PerplexityChatGPTGoogle BardClaude

Use this pattern in your project

Copy this prompt to generate a production-ready implementation in Cursor, Claude Code, Lovable, or any AI coding agent.

Generate a production-ready implementation of the "Progress Steps" AI interface design pattern.

Pattern Description:
Interactive Demo
Restart demo
Thinking…

Get new patterns by email

Weekly AI interface UX notes and resources on Substack, no spam, unsubscribe anytime.

Subscribe on Substack