Overview
How might we design output format selection so people can trust and act on AI output?
When this pattern fits
- Perfect for data processing tools, content generation platforms, and applications where output format selection improves usability and integration.
When to skip or lighten it
- Casual Q&A where format chrome is overkill.
- Formats the model cannot reliably produce.
- Downstream systems that already coerce format via API only.
States
State model coming soon
Key UX elements
Key UX elements coming soon
Anti-patterns to avoid
Claiming JSON mode while returning prose fences.
No validation that the output matches the selected schema.
Changing format mid-stream without restarting cleanly.
Hiding format options in buried settings.
How products use it
| Product | Implementation |
|---|---|
| ChatGPT | Canvas and code/json oriented outputs on request. |
| Claude | Artifacts and structured output styles. |
| API platforms | Response format parameters for JSON mode. |
| Data analysis tools | Export-as controls for tables and files. |
Real-world examples
How shipped products implement output format selection, from our teardown guides.
Implementation
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 "Output Format Selection" AI interface design pattern.
Pattern Definition:Frequently asked questions
Where should format selection live?
Near the composer or on the answer toolbar. Power users also need it in API/docs.
Select before generate or after?
Before for strict schemas; after for “convert this answer to CSV.” Support both.
How do you verify structured output?
Schema-validate on the client or server and show errors with a fix action.
How does this relate to export conversation?
Format selection shapes a single answer. Export packages the whole thread.