AI Chat UX: Structured Cards, Thinking Traces, and Suggestion Pills

Most AI chat interfaces are a text box and a wall of paragraphs. That made sense in 2023 when the model could only produce prose. In 2026, when your agent can query nine systems and execute actions, rendering everything as text bubbles wastes the medium. These are the six patterns we ship in production chat products, and what each one is for.

1. Structured Response Cards

The agent decides the shape of the response, not just the words. Ask for status across clients — you get a table. Ask what's pending — a checklist with live states. Ask the agent to do something — an action proposal card with the exact operation, target, and an approve button. Confirmations and errors get their own card types too, so success and failure are visually unambiguous.

Implementation note: have the model emit typed JSON per card and render with real components. Parsing markdown-ish text into UI is a permanent source of breakage.

2. Visible Thinking Traces

While the agent works, we show each step as it happens: "Searching email threads... 0.8s", "Cross-referencing task board... 1.2s", "Composing answer — confidence 92%". Collapsed by default after completion, expandable forever. This one pattern does three jobs:

• Perceived latency drops — a 9-second wait with visible progress feels shorter than a 4-second spinner
• Users catch bad assumptions mid-flight ("wrong client!") before the answer arrives
• The confidence percentage calibrates trust — people verify 70% answers and act on 95% ones, which is exactly right

Wrong answers with visible reasoning generate correction and retry. Wrong answers from a black box generate churn. The trace is a trust instrument, not a gimmick.

3. Narrowing Pills for Ambiguity

When a request is ambiguous — "the Meridian contract" matches four documents — the worst moves are guessing silently or asking an open-ended question. Instead: one short line plus clickable pills, one per interpretation. One tap resolves it. Users answer pills in about a second; typed clarifications take ten and derail the flow. Cap it at 4–5 options; more than that means the agent should ask a better question.

4. Follow-Up Suggestion Pills

Under each response, 2–3 pills predicting the next request: "Draft the follow-up email", "Show last month too", "Create tasks from this". These do double duty — they save typing, and they teach capability. Most users never read docs; suggestion pills are how they discover the agent can do things they never thought to ask. In our deployments a large share of action executions begin as a suggestion pill tap, not a typed command.

5. Threads Organized by Entity, Not Just Time

A flat chronological chat history is where context goes to die. We group threads by the entity they concern — in our reference build, by client — alongside topical channels (12 of them, each scoped to a workflow). The payoff: conversations become an organized, searchable record, and the agent loads the right entity context automatically when you open a thread. Deep links (?channel, ?thread) make any conversation shareable as a URL.

6. Files and Voice as First-Class Inputs

Drag a PDF or paste a screenshot directly into the conversation and the agent reads it via vision models. Tap the mic and speak. Every input modality that lowers the cost of giving the agent context pays for itself — richer input reliably produces better output.

What to Build First

1. Action proposal + confirmation cards — the safety-critical pair
2. Thinking trace with confidence — the trust builder
3. Narrowing pills — kills the largest source of wrong answers
4. Suggestion pills — drives discovery and engagement
5. Tables and checklists — quality of life, add as query volume grows

None of these require exotic infrastructure — typed model outputs, a component library, and discipline. The teams that treat chat as a product surface rather than a text stream are shipping agents people actually rely on.