Story
When the AI flags, ranks or changes something of mine, I want to know why in plain words, so I can fix it or push back on the first try.
Wanjiru, a field officer for a water charity in Nairobi, sending her expenses on her phone after a late flight.
- 01 Setting
Wanjiru adds a taxi receipt from the airport, late at night.
- 02 Trigger
The AI check marks it "Needs review".
- 03 Without it
No reason, or only a model score (a raw number from the AI). She sends it again unchanged, and the AI flags it again.
- 04 With it
She taps Why? and sees 2 reasons with the numbers, the rule they come from, and what she can do.
- 05 Outcome
She adds 1 line about the late flight. It goes to her manager on the first try.
Live demo
This demo follows a script, so it plays the same every time - there is no real AI behind it. Change a setting to see the same moment play out differently.
What happens, step by step
| State | The person sees | The AI is | When | Screen reader |
|---|---|---|---|---|
| 1 | "Checking" with dots on the new expense. | Checks. | 0-1 s | “Checking your expense” |
| 2 | "Needs review" in amber, with a Why? button beside it. | Done. | when done | “1 expense needs review” |
| 3 | Each reason with its numbers, the rule it comes from, and what to do next. | - | on tap | “Explanation opened” |
| 4 | People do what the explanation said - here, add a reason. | - | - | - |
| 5 | The expense moves on, or - without a usable reason - comes back flagged again. | - | - | “Sent for approval” |
On each device
- phone
- Why? sits next to the flag. The explanation opens in place under the item, so the numbers and the fix are on 1 screen.
- tablet
- As on desktop.
- desktop
- Why? opens a popover (a small card that floats over the page) next to the item. Longer detail - the full rule, past cases - sits behind a link in the popover.
When to use it
- The AI makes a decision about people's things - flags, ranks, rejects, recommends, changes.
- People can do something about the reason - fix the input, add context, appeal.
- A wrong decision costs people time or money.
- People want to see the AI's steps while it works, not the reason for a result. Use Thinking and processing steps instead.
- People need to check where facts came from. Use Citations and sources instead.
- People need to know how sure the AI is, more than why. Use Confidence display instead.
The parts of the pattern
- AThe decision"Needs review" - what the AI decided, in amber, in words.
- BWhy?1 tap from the decision. Always there when the AI decides something.
- CReasons2 or 3, in plain words, with the real numbers: KSh 4,200 against a KSh 3,000 limit.
- DWhere it comes fromThe rule or data behind the reason, linked, so people can check it.
- EWhat to doThe next step, and who makes the final decision.
Do and Avoid
Needs review
KSh 4,200 is over the KSh 3,000 taxi limit.
From Travel policy 4.2
Needs review
Risk score 0.82 (limit 0.75)
23:40 is outside work hours.
To send it, add a reason. Your manager decides.
23:40 is outside work hours.
This decision is final.
Writing and accessibility
- Start each reason with the fact, then the rule: "KSh 4,200 is over the KSh 3,000 limit."
- Use the person's numbers and names, not model terms like score, feature or weight.
- Give 2 or 3 reasons at most. Put the rest behind a link.
- End with the next step: "To send it, add a reason."
- Name the button with the item: "Why does Taxi, KSh 4,200 need review?".
- Announce "Explanation opened", and move focus to the first reason.
- Write reasons as a real list, so screen readers say how many there are.
- Do not use amber alone for the decision - always say it in words.
Seen in real products
- IBM CarbonDesign system · Nov 2026The AI label opens an explainability popover - the first layer of explanation. The template has Overview, Supporting details, Artifacts and resources, and Additional actions.Carbon: AI label usage ↗
- ChatGPTWeb and apps · Nov 2026Sources can appear below a response, to review the past chats, memories, instructions or files used. The help page says Sources may not show every factor that shaped a response.OpenAI Help: Memory FAQ ↗
Each example comes from the product’s help pages, release notes or teardowns, with the month it was checked. Products change every month - tell us when 1 is out of date.
Check yourself
Seen this pattern done better, or a product that changed? Press Suggest next to any heading, or tell us about the whole page.