Overview
How might we preserve useful autonomy while keeping consequential actions inspectable, editable, and attributable?
When the action crosses a risk boundary
- Require approval when the action is hard to reverse, spends money, contacts other people, changes production systems, or carries compliance risk.
- Skip or lighten approval for low-stakes, local, easily undone edits.
When approval adds friction without agency
- Low-stakes, easily reversible suggestions where approval friction slows the user more than it protects them.
- Fully autonomous monitoring or batch jobs where the product already has hard budgets, rollback, and clear failure alerts.
- Every micro-edit in a creative canvas; prefer selective gates on publish, send, or spend instead.
States
Design the whole control model, not only the confirmation dialog.
Proposed
The AI has staged an action. Nothing consequential has run yet. The proposal is waiting for a human decision.
Under review
The full payload is visible and inspectable: action, target, content, and impact before any side effect.
Editing
The person changes the proposal in place. Consent will apply to the edited payload, not the original draft.
Approved
Explicit confirm authorizes execution. Only after this step may the product send, apply, spend, or deploy.
Rejected
Deny or discard stops the action. No side effect runs, and control stays with the human.
Executed
The approved action has completed (or failed after approval). Outcome is separate from the decision itself.
Key UX elements
The parts that must be present for this pattern to work.
Say exactly what will happen.
Use an active verb and a specific object so people know exactly what they are authorizing.
Expose the target, quantity, and boundaries.
Summarize what is included and give a path to inspect or edit the underlying items before approval.
Describe who and what will change.
Use plain language for cost, visibility, permanence, and affected people or systems. Do not rely on a risk color alone.
Explain why approval is required now.
Connect the interruption to a rule, threshold, or risk class so the pause feels predictable rather than arbitrary.
Keep edit and deny paths first-class.
Approval is meaningful only when someone can change the scope or stop the action without pressure or penalty.
Set expectations before execution.
State whether the action can be cancelled, undone, or only remediated after it begins.
Anti-patterns to avoid
Silent auto-send or auto-apply with only a buried undo.
Approval UI that does not show the exact payload (email body, diff, amount) being approved.
One global “always allow” that never re-prompts for higher-risk actions.
Approval after the side effect already happened.
How products use it
| Product | Implementation |
|---|---|
| GitHub Copilot | Suggests code in-editor; human accepts, rejects, or edits before commit. |
| Gmail Smart Compose | Inline completions stay draft until the user sends the message. |
| ChatGPT | Agent and connector flows ask before sending email or taking external actions. |
| Gemini | Approval cards and send gates for actions that leave the chat surface. |
Real-world examples
How shipped products implement human in the loop, 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 "Human in the loop" AI interface design pattern.
Pattern Definition:Frequently asked questions
What is human-in-the-loop AI UX?
Human-in-the-loop UX means the AI proposes or stages an action and a person must review and approve before it executes. It is the primary control pattern for email send, purchases, code apply, and other irreversible or high-cost outcomes.
When should I require human approval for AI actions?
Require approval when the action is hard to reverse, spends money, contacts other people, changes production systems, or carries compliance risk. Skip or lighten approval for low-stakes, local, easily undone edits.
How is human-in-the-loop different from autonomy budgets?
Human-in-the-loop gates a specific action with an explicit review. Autonomy budgets bound how long or how many steps an agent may run unattended before pausing. Many agent products need both: budgets for the run, approval for high-impact steps.
What should an approval card show?
Show the exact action, target, and content (recipient, diff, amount, tool) plus clear Confirm and Cancel. Hide nothing the user is authorizing. Optional edit-in-place beats approve-then-fix.