UX Pattern Library

Reference intermediate

Ten recurring AI interaction patterns — purpose, typical UI, and key design rule. See Lesson 2: AI UX Patterns. Patterns align with the Google PAIR People + AI Guidebook and Microsoft's "Guidelines for Human-AI Interaction" (Amershi et al., 2019).

#	Pattern	Core Job	Risk if Absent
1	Confidence Display	Signal certainty level	Over-trust of low-quality output
2	Source Attribution	Show information provenance	Users cannot verify claims
3	Regenerate	Offer a different output on demand	Stuck with one bad result
4	Edit-and-Correct	Let users amend AI output in place	Errors propagate unchecked
5	Explainability Tooltip	Explain why this output was produced	Users feel manipulated
6	Progressive Personalization	Adapt gradually from observed behaviour	Cold-start friction or creepy shifts
7	Graceful Fallback	Serve users when the AI cannot	Complete failure, no recovery
8	Human Approval Step	Pause before consequential action	Irreversible harm from autonomous AI
9	Feedback Capture	Collect signal about output quality	Product cannot improve through use
10	Scope Indicator	Show what the AI can and cannot do	Effort wasted on out-of-scope tasks

1. Confidence Display

Plain-language certainty — "Looks good," "Worth checking," "Uncertain" — not raw probabilities. Use when output quality varies and the user must decide whether to act.

A document summariser shows a green chip on a well-structured source and amber "Review recommended" on a scanned document; hovering reveals a one-line reason. Never suppress low-confidence signals — trust failures when errors surface cost far more than any short-term perception gain.

2. Source Attribution

Inline citations anchored to specific claims. Mandatory in research, enterprise search, and compliance; less critical for pure creative generation.

Superscript numbers sit next to each claim; clicking expands a card with the source title, a highlighted excerpt, and a link to the original. Detached source lists at the foot of a response are almost always skipped — inline anchoring makes verification easy enough that users actually do it.

3. Regenerate

A "Try again" control that produces a fresh output for the same input. Best for open-ended tasks: drafts, suggested replies, product names, design options.

A circular-arrow icon below a suggested email reply replaces the current suggestion and slides the previous into a history ("Option 1 of 3"). Cap visible alternatives at two to four — more creates choice paralysis; fewer limits exploration.

4. Edit-and-Correct

Inline editing of AI output with correction-logging for product-team review. Essential wherever AI output flows into downstream work — documents, records, forms, communications.

A support-ticketing tool marks an AI-generated sentiment field with a tint; the reviewer corrects it, a brief prompt captures why, and the tint becomes a human-verified indicator. Maintain a visual distinction between AI-generated and human-verified content — auditors need to know what a person has reviewed.

5. Explainability Tooltip

A plain-language rationale for a specific output, surfaced on hover or via a "Why?" control, grounded in recognisable user data. Critical for recommendations, risk scores, and content-filtering decisions.

A task-management tool shows on hover: "Moved to top — ticket open 14 days, connected account flagged at-risk." If you cannot explain an AI decision in one or two plain sentences, that is a design problem to solve before shipping.

6. Progressive Personalization

AI behaviour that starts at a generic default and adapts incrementally from observed behaviour — no upfront configuration, no sudden unexplained shifts.

A writing assistant starts neutral; after the user repeatedly rewrites formal suggestions into casual language it notes: "Noticed you prefer conversational style — updated suggestions. Change this in Settings." Surface personalisation changes as a notification with a path to reset — invisible adaptation feels uncanny when users eventually notice it.

7. Graceful Fallback

An experience that activates when the AI cannot produce a satisfactory output, so the user can still accomplish their goal through a non-AI path, partial answer, or honest redirect.

An AI travel assistant asked about a specific airline's mobility-scooter policy responds: "I don't have reliable information on this — check their accessibility page or call their line. Want help preparing questions?" Script fallbacks before happy paths — designing them first produces useful recovery; treating them as afterthoughts produces "I can't help with that."

8. Human Approval Step

A pause in an agentic workflow requiring explicit confirmation before a consequential or irreversible action. Threshold should be proportional to reversibility.

An AI assistant asked to reschedule a week's calendar shows: "I'll cancel 4 meetings and send reschedule requests to 11 attendees. Approve all / Review individually / Cancel." Approval UX must be fast or users click through without reading — provide a ten-second summary and a deep-review mode for sensitive actions.

9. Feedback Capture

User signal about AI quality — explicit (thumbs, corrections) or implicit (acceptance rate, edit distance, return rate). Best products use both.

Dimension	Explicit	Implicit
Signal quality	High — stated preference	Medium — inferred behaviour
Participation	Low — opt-in only	High — all users
Best for	Diagnosing specific failures	Measuring overall quality

A summarisation tool shows thumbs up / down; tapping thumbs-down opens "Too long / Missed key points / Inaccurate / Other" in under ten seconds. Close the loop visibly — "Based on feedback, summaries now include action items" sustains engagement with the mechanism.

10. Scope Indicator

A clear upfront statement of what the AI can and cannot do. Essential for open-ended chat assistants; less necessary for narrow features where scope is obvious from context.

An HR-specialist assistant shows on first load: "I can help with: writing job descriptions, drafting offer letters, interpreting policy documents, and benchmarking compensation. Not set up for legal advice or direct HRIS access." Scope indicators are invitations — frame capabilities positively, flag limits briefly, give users a clear first step.

Pattern Selection by Feature Type

Feature Type	Essential	Strongly Recommended
Chat assistant	Scope Indicator, Graceful Fallback	Confidence Display, Feedback Capture
Content generation	Regenerate, Edit-and-Correct	Feedback Capture
AI recommendation	Explainability Tooltip, Source Attribution	Progressive Personalization
Agentic workflow	Human Approval Step, Graceful Fallback	Edit-and-Correct, Feedback Capture
Search / research	Source Attribution, Confidence Display	Explainability Tooltip
Personalised feed	Progressive Personalization, Explainability Tooltip	Feedback Capture
Data extraction	Edit-and-Correct, Confidence Display	Human Approval Step