Designing For Agentic AI: Practical UX Patterns For Control, Consent, And Accountability

Designing For Agentic AI: Practical UX Patterns For Control, Consent, And Accountability — Smashing Magazine

Skip to main content Start reading the article Jump to list of all articles Jump to all topics19 min readUX, Design, AIShare on Twitter, LinkedInAbout The AuthorVictor Yocco, PhD, is a UX Researcher at ServiceNow and the author of Design for the Mind (Manning, 2016) and the forthcoming Designing Agentic AI Experiences … More about Victor ↬Email NewsletterYour (smashing) email Weekly tips on front-end & UX.Trusted by 182,000+ folks. See User Testing Live The Modern UX Practitioner with Paul Boag How To Measure UX and Design Impact with Vitaly Friedman Custom Web Forms for Angular, React, & Vue. Your backend. Accessible Frontend Patterns with Manuel Matuzović Design Patterns For AI Interfaces, 30 lessons + UX training Celebrating 10 million developersAutonomy is an output of a technical system. Trustworthiness is an output of a design process. Here are concrete design patterns, operational frameworks, and organizational practices for building agentic systems that are not only powerful but also transparent, controllable, and trustworthy.In the first part of this series, we established the fundamental shift from generative to agentic artificial intelligence. We explored why this leap from suggesting to acting demands a new psychological and methodological toolkit for UX researchers, product managers, and leaders. We defined a taxonomy of agentic behaviors, from suggesting to acting autonomously, outlined the essential research methods, defined the risks of agentic sludge, and established the accountability metrics required to navigate this new territory. We covered the what and the why.Now, we move from the foundational to the functional. This article provides the how: the concrete design patterns, operational frameworks, and organizational practices essential for building agentic systems that are not only powerful but also transparent, controllable, and worthy of user trust. If our research is the diagnostic tool, these patterns are the treatment plan. They are the practical mechanisms through which we can give users a palpable sense of control, even as we grant AI unprecedented autonomy. The goal is to create an experience where autonomy feels like a privilege granted by the user, not a right seized by the system.Core UX Patterns For Agentic SystemsDesigning for agentic AI is designing for a relationship. This relationship, like any successful partnership, must be built on clear communication, mutual understanding, and established boundaries.To manage the shift from suggestion to action, we utilize six patterns that follow the functional lifecycle of an agentic interaction:Pre-Action (Establishing Intent)The Intent Preview and Autonomy Dial ensure the user defines the plan and the agent’s boundaries before anything happens.In-Action (Providing Context)The Explainable Rationale and Confidence Signal maintain transparency while the agent works, showing the “why” and “how certain.”Post-Action (Safety and Recovery)The Action Audit & Undo and Escalation Pathway provide a safety net for errors or high-ambiguity moments.Below, we will cover each pattern in detail, including recommendations for metrics for success. These targets are representative benchmarks based on industry standards; adjust them based on your specific domain risk.1. The Intent Preview: Clarifying the What and HowThis pattern is the conversational equivalent of saying, “Here’s what I’m about to do. Are you okay with that?” It’s the foundational moment of seeking consent in the user-agent relationship.Before an agent takes any significant action, the user must have a clear, unambiguous understanding of what is about to happen. The Intent Preview, or Plan Summary, establishes informed consent. It is the conversational pause before action, transforming a black box of autonomous processes into a transparent, reviewable plan.Psychological UnderpinningPresenting a plan before action reduces cognitive load and eliminates surprise, giving users a moment to verify the agent truly understands their intent.Anatomy of an Effective Intent Preview:Clarity and ConcisenessThe preview must be immediately digestible. It should summarize the primary actions and outcomes in plain language, avoiding technical jargon. For instance, instead of “Executing API call to cancel_booking(id: 4A7B),” it should state, “Cancel flight AA123 to San Francisco.”Sequential StepsFor multi-step operations, the preview should outline the key phases. This reveals the agent’s logic and allows users to spot potential issues in the proposed sequence.Clear User ActionsThe preview is a decision point, not just a notification. It must be accompanied by a clear set of choices. It’s a moment of intentional friction, a ‘speed bump’ in the process designed to ensure the user is making a conscious choice, particularly for irreversible or high-stakes actions.Let’s revisit our travel assistant scenario from the first part of this series. We use this proactive assistant to illustrate how an agent handles a flight cancellation. The agent has detected a flight cancellation and has formulated a recovery plan.The Intent Preview would look something like this:Proposed Plan for Your Trip DisruptionI’ve detected that your 10:05 AM flight has been canceled. Here’s what I plan to do:Cancel Flight UA456Process refund and confirm cancellation details.Rebook on Flight DL789Book a confirmed seat on a 2:30 PM non-stop flight, as this is the next available non-stop flight with a confirmed seat.Update Hotel ReservationNotify the Marriott that you will be arriving late.Email Updated ItinerarySend the new flight and hotel details to you and your assistant, Jane Doe.[ Proceed with this Plan ] [ Edit Plan ] [ Handle it Myself ]This preview is effective because it provides a complete picture, from cancellation to communication, and offers three distinct paths forward: full consent (Proceed), a desire for modification (Edit Plan), or a full override (Handle it Myself). This multifaceted control is the bedrock of trust.The Intent Preview is the primary pattern for building user trust. By clearly stating what the agent plans to do and offering simple, direct controls like “Proceed,” “Edit,” or “Handle it Myself,” we transform a black box into a transparent and controllable experience. (Large preview)When to Prioritize This PatternThis pattern is non-negotiable for any action that is irreversible (e.g., deleting user data), involves a financial transaction of any amount, shares information with other people or systems, or makes a significant change that a user cannot easily undo.Risk of OmissionWithout this, users feel ambushed by the agent’s actions and will disable the feature to regain control.Metrics for Success:Acceptance RatioPlans Accepted Without Edit / Total Plans Displayed. Target > 85%.Override FrequencyTotal Handle it Myself Clicks / Total Plans Displayed. A rate > 10% triggers a model review.Recall AccuracyPercentage of test participants who can correctly list the plan’s steps 10 seconds after the preview is hidden.Applying This to High-Stakes DomainsWhile travel plans are a relatable baseline, this pattern becomes indispensable in complex, high-stakes environments where an error results in more than an inconvenience for an individual traveling. Many of us work in settings where wrong decisions may result in a system outage, putting a patient’s safety at risk, or numerous other catastrophic outcomes that unreliable technology would introduce.Consider a DevOps Release Agent tasked with managing cloud infrastructure. In this context, the Intent Preview acts as a safety barrier against accidental downtime.The intent preview in a higher-stakes setting, for example, cloud infrastructure. (Large preview)In this interface, the specific terminology (Drain Traffic, Rollback) replaces generalities, and the actions are binary and impactful. The user authorizes a major operational shift based on the agent’s logic, rather than approving a suggestion.2. The Autonomy Dial: Calibrating Trust With Progressive AuthorizationEvery healthy relationship has boundaries. The Autonomy Dial is how the user establishes it with their agent, defining what they are comfortable with the agent handling on its own.Trust is not a binary switch; it’s a spectrum. A user might trust an agent to handle low-stakes tasks autonomously but demand full confirmation for high-stakes decisions. The Autonomy Dial, a form of progressive authorization, allows users to set their preferred level of agent independence, making them active participants in defining the relationship.Psychological UnderpinningAllowing users to tune the agent’s autonomy grants them a locus of control, letting them match the system’s behavior to their personal risk tolerance.ImplementationThis can be implemented as a simple, clear setting within the application, ideally on a per-task-type basis. Using the taxonomy from our first article, the settings could be:Observe & SuggestI want to be notified of opportunities or issues, but the agent will never propose a plan.Plan & ProposeThe agent can create plans, but I must review every one before any action is taken.Act with ConfirmationFor familiar tasks, the agent can prepare actions, and I will give a final go/no-go confirmation.Act AutonomouslyFor pre-approved tasks (e.g., disputing charges under $50), the agent can act independently and notify me after the fact.An email assistant, for example, could have a separate autonomy dial for scheduling meetings versus sending emails on the user’s behalf. This granularity is key, as it reflects the nuanced reality of a user’s trust.When to Prioritize This PatternPrioritize this in systems where tasks vary widely in risk and personal preference (e.g., financial management tools, communication platforms). It is essential for onboarding, allowing users to start with low autonomy and increase it as their confidence grows.Risk of OmissionWithout this, users who experience a single failure will aban