AI Interface Pattern Library

The core issue: AI output is probabilistic, but AI interfaces are designed as if it isn't. Every pattern I eventually defined traces back to this single mismatch.

Inherent uncertainty

Model output exists on a confidence spectrum the interface rarely communicates. Unlike a database query, there is no binary correct/incorrect — only degrees of reliability.

Generative output

AI doesn't retrieve — it generates. Responses can be partially correct, confidently wrong, or accurate in ways that are impossible to verify without domain expertise.

Silent failure risk

AI systems fail in ways that produce no visible signal. A hung generation looks like a slow one. A fabricated response looks like an accurate one.

Correction as a first-class interaction mode

With conventional software, correction is an edge case. With AI, iteration is the expected workflow. Most interfaces treat it as an afterthought.

Claude

ChatGPT

Gemini

Perplexity

All four indicators loop indefinitely. None distinguish active generation from a frozen state.

No product differentiates between generating and frozen.

The hung generation state — where a spinner continues running with no visual distinction between "still working" and "stalled" — was observed across Claude, ChatGPT, Gemini, and Perplexity. Four of six products. The interface shows identical behavior whether the model is three seconds from completing or has been stuck for three minutes. This isn't a design oversight — the model itself has no awareness of its own generation state. A hung generation is typically an infrastructure failure between the API and the client, which means the interface is flying blind. GitHub Copilot is the only product in the audit that breaks from this: when generation is interrupted, it surfaces the message "Copilot was interrupted before it could finish this message." Simple, specific, honest. No other product does this.

No product uses a visual confidence indicator.

Every product in this audit communicates uncertainty exclusively through language. Not one uses color, iconography, or structural treatment to distinguish a reliable claim from an uncertain one (distinct from model confidence in the technical sense, which refers to token prediction probability — not factual accuracy). The closest exception is Gemini's Double-Check feature — a post-response source verification tool that color-highlights claims as verified or contradicted by external sources — but that's a verification mechanism, not a confidence indicator at the point of generation. The absence of visual confidence design across the entire field is the most striking finding in the audit.

Perplexity cites on nearly every response. Claude presents equivalent claims with no attribution. Inconsistency is a worse trust signal than silence.

Citation inconsistency is a worse trust signal than no citation.

Perplexity cites on nearly every factual response — inline footnotes, a persistent source panel, hover previews, links that resolve correctly. Claude cites on some responses and presents equivalent claims without attribution on others: health benefits of coffee got confident, uncited assertions; a startup failure rate claim appeared with no source. The problem isn't just the missing attribution — it's that users can't build a reliable mental model of when to verify. Inconsistency teaches either constant doubt or misplaced trust.

No product distinguishes "I don't know" from "I can't know."

When a model's training data doesn't include a recent event, and when a model is structurally prevented from knowing something — private communications, unpublished information — the interface response is identical. These are different epistemic states requiring different user responses: one invites a web search, the other doesn't. No product surfaces this distinction visually or structurally.

The clearest anti-pattern

Notion AI hit a usage limit at 20 responses — mid-task, without prior warning — discarded work in progress, and replaced the limitation explanation with a marketing upsell. No progressive disclosure. No graceful exit. This is what limitation handling looks like when it's treated as an edge case.

Status should be specific, not just present

Generic loading indicators tell users something is happening but not what. AI generation is not a download; it's a reasoning process. The interface should reflect that distinction. An indicator that escalates from "generating" to "something may be wrong" after a defined threshold is more honest than one that runs indefinitely.

Uncertainty should be visible before it's harmful

Every AI response carries some degree of uncertainty. The interface's job is not to eliminate it but to make it legible — and to surface it at the beginning of a response, not buried within it. Absence of uncertainty signaling is itself a design choice. In AI interfaces, it's the wrong one.

Inconsistent citation is more damaging than no citation

Citations exist to give users the information they need to verify claims independently. When a product sometimes cites and sometimes doesn't for equivalent claims, it creates the illusion of accountability without actually providing it. Every empirical claim should be attributed, or the interface should be honest that attribution isn't available.

Limitation handling is a first-class design problem

A good limitation response tells the user what the system cannot do, why, and what they can do instead. Commercial limitations deserve the same honest treatment as technical ones. Users should know constraints exist before they hit them, not at the moment they're blocked.

The most dangerous error is the one users don't notice

Silent failures erode trust in ways that explicit errors don't, because users can't respond to what they can't see. Every failure state should tell the user what happened, what they might have lost, and what they can do next. If the system doesn't know why it failed, it should say so rather than displaying the same animation it shows when it's working.

Generation States

Four distinct states minimum: thinking, streaming, complete, and hung. The hung state must escalate to an explicit error-adjacent state after a defined timeout — not continue showing the same animation it shows when working.

Uncertainty Communication

Epistemic banners appear before the response body, not within it. Claim-level uncertainty uses dotted underlines with hover explanations. Three distinct states: knowledge gap, principled limit, and probabilistic claims.

Source & Attribution

Citation must be consistent across comparable claims, inline rather than aggregated, and accessible without a click-through. Absent citation is marked explicitly — its absence should be a deliberate signal, not an interface gap.

Limitation Handling

Three limitation types require distinct handling: capability limits redirect proactively, knowledge limits trigger a web search before responding, commercial limits disclose progressively before the threshold is hit. The ARI structure — Acknowledge, Redirect, Invite — applies across all three.

Correction & Refinement

Vague corrections trigger a Clarification Interceptor rather than blind regeneration. The interceptor presents structured options including inline text selection for targeted rephrasing. All prior versions are preserved and navigable.

Error States

A four-error taxonomy: hung state, network failure, context length exceeded, and policy refusal. Each has distinct visual treatment, specific copy, and a recovery path. The user's prompt is never cleared during any error type.