Accelerating Insights with Context-Aware AI
When enterprise teams moved to the cloud for speed, their most valuable users, data scientists and analysts, were slowed by fragmented tools and operational overhead. As Lead UX Designer for the Data Notebook experience, I led the strategic design of the Data Agent, a context-aware AI system embedded directly into the workflow. By shifting discovery, setup, and orchestration from users to the agent while preserving human-in-the-loop control, we transformed low-value administrative work into insight-driven workflows. This work established a scalable and trustworthy interaction model for agentic UX, reducing friction for expert users and setting a new standard for AI-assisted data work at enterprise scale.
I led the end-to-end UX strategy and design for the Data Agent experience within the notebook environment.
Design Strategy: Defined the interaction models for AI-assisted coding, distinguishing between "in-flow" edits and "conversational" assistance.
Interaction Design: Designed the dual-pattern system (Cell vs. Chat) to ensure it felt native to the off-console IDE experience.
AI Guardrails: Worked with engineering to define how the agent presents citations and "human-in-the-loop" verification steps.
Aug 2025 - Nov 2025
SageMaker Unified Studio Notebook with Data Agent, featured at re:Invent 2025
The Problem Space
"I spend 40% of my time just looking up syntax or trying to remember which data catalog holds the customer records. I want to analyze data, not wrestle with the platform."
For the modern Data Pro, the cognitive load was unsustainable. Users faced three distinct barriers:
Boilerplate Fatigue: Significant energy was wasted on repetitive tasks—like writing standard SQL connections or visualization code—rather than unique problem solving.
Context Fragmentation: Users constantly context-switched between notebooks, data catalogs, and documentation just to understand schema relationships.
The "Blank Canvas" Paralysis: Starting a new analysis required a high barrier of technical AWS knowledge, intimidating users who were experts in data but not infrastructure.
Design Challenge
How might we design an AI agent that acts as a competent "pair programmer"—understanding the user's specific data context and intent—while ensuring the human remains firmly in control of the output?
Impact & Success Criteria
Since launching the pilot, the Data Agent has fundamentally shifted the workflow from "manual creation" to "review and refine."
Efficiency: 40% reduction
in boilerplate coding time and 2x faster onboarding for new team members.
Quality: 85% acceptance
for "Fix with AI" suggestions, proving the agent effectively resolves syntax and runtime errors.
Infrastructure Elasticity:
eliminated idle compute costs by implementing a "zero-state" architecture, enabling seamless scaling from GB to TB.
The Solution
We introduced the Data Agent, a domain-expert AI that lives inside the Data Notebook. Unlike a standard LLM, it is "context-aware"—it systematically explores data catalogs, business metadata, and active notebook variables to build context before generating code.
The "Do" Mode: GenAI Cell Experience
Context: For high-velocity, single-turn tasks.
The UX: Users can invoke the agent directly inside a specific notebook cell to "Fix this error" or generate a quick SQL query.
Impact: Removed the friction of syntax lookup, allowing users to "code at the speed of thought."
The "Discuss" Mode: Chat Panel Experience
Context: For complex, ambiguous problems requiring reasoning and planning.
The UX: Users engage in multi-turn dialogue (e.g., "Analyze customer churn"). The Agent acts as an orchestrator: it breaks the prompt into a multi-step plan, explains its reasoning, and generates the necessary code blocks.
Impact: Lowers the barrier to entry, helping analysts scaffold complex projects in minutes rather than days.
"The new SageMaker interface brings clarity and speed to the entire ML lifecycle. Its developer-friendly design has made our experimentation and delivery significantly faster"
Sachin Mittal
Product Manager, Deloitte
The Process
Defining User Goals
Discovery & "The Trust Gap" Early research revealed a critical insight: Data Pros were skeptical of AI. They didn't want a "black box" generating code they didn't understand.
To ensure the Data Agent solved real problems rather than just showcasing technology, we started by crystallizing the core needs of our two primary personas. We found that while Admins needed control, Consumers needed freedom from syntax.
Data Consumer Goal: "I want to discover, explore, and get answers from my data quickly—without writing code."
Insight: The primary friction point isn't the complexity of the data, but the "syntax tax" required to query it.
Admin Goal: "I want to create curated data collections so my team can easily reference the exact data needed for their analysis."
Insight: Governance empowers discovery; clean data collections lead to better AI results.
Strategy: The Unified Agentic Framework
To ensure the Data Agent solved real user needs, I mapped out four high-level interaction patterns that served as the blueprint for the AI's behavior:
Agentic Intent [Discover]: The user asks a question ("What were Q4 sales?"), and the Agent queries the data directly to return an answer.
Agentic Development [Build]: The user describes an outcome ("Build an ML pipeline"), and the Agent scaffolds the infrastructure and code.
Agentic Navigation [Guide]: The Agent acts as a contextual GPS, analyzing the current state to offer personalized next steps.
Unified Troubleshooting [Fix]: Moving from "error reporting" to "error resolution," proactively diagnosing syntax issues and complex Spark errors.
Strategic UX Flows
Designing for "Human-in-the-Loop" Trust
A generic chatbot is useless if it hallucinates code that deletes data. We had to design for trust.
The Two-Stage Architecture: We utilized a "Planner + Code Generator" architecture. I designed the UI to visualize this "thinking" process, showing the user the Agent's plan before execution.
Execution Modes: I defined two distinct interaction models to balance speed and control:
Run Step-by-Step: The default mode for complex tasks. The user reviews and approves each step of the plan individually.
Accept & Auto-Run: A "hands-off" mode for routine, low-risk workflows where the user trusts the full plan.
Guardrails: We designed explicit approval states for "mutative actions" (like dropping a table), ensuring the AI could never perform a destructive operation without user consent.
Establishing a Generative AI Design Language
As Lead Designer, I consolidated pattern guidance to establish a unified visual language for Generative AI across the platform.
Visual Affordance: I defined specific iconography and motion cues to help users instantly distinguish AI-generated suggestions from standard interface elements.
Interaction Taxonomy: I categorized interactions into Conversational Workspaces (for reasoning) and Inline Overlays (for quick edits), ensuring cohesive mental models across the entire product suite.
This framework ensured cohesive mental models and consistent behavior across varied product surfaces, balancing high-velocity tasks with deep analytical work.
Atoms on backgrounds
Decision framework for selecting the right interaction pattern
Pattern 1/6: AI identifier ingress
The GenAI ingress pattern establishes clear, identifiable entry points for users to access generative AI functionality within interfaces. It provides consistent visual language and positioning guidelines for AI triggers across different UI contexts, enabling users to easily discover, recognize, and engage with AI-powered features throughout an application.
Interactive elements
In buttons
1a: Primary button - No gradient (CTA color provides visibility)
1b: Secondary button - Add gradient
1c: Button in alerts - No gradient (match button text color)
In input fields
Right side, vertically centered
Applies to all input types (dropdowns, text fields, etc.)
Containers and blocks
In containers / content blocks
Upper right corner with margin
Never flush to edges
For headers: Right side of header row
Apply to each AI-generated block individually
In icon group
Leftmost position in group
Complex components
In data tables
Full table: Top right of header
Column: Right side of header (before sort icons)
Row: Far right, before controls
Cell: Inline, right of content
GenAI panels
6a: Header - Left-aligned with title (no gradient)
6b: User messages - Right-aligned for clear distinction
6c: AI responses - Left-aligned avatar
6d: Mixed content (contains both AI-generated and human-authored content within the same interface or container) - Block-level indicators
Pattern 2/6: Full page chat
Provides a dedicated interface for users to engage in complex, multi-turn conversations with an AI assistant. This immersive environment dedicates the entire screen to the conversation, allowing users to focus exclusively on AI interaction without distractions. It's designed for scenarios requiring deep engagement, context retention, and rich media support, such as creative assistance, research tasks, and data exploration conversations.
Anatomy
Welcome message
Display a clear introduction of the AI agent to set context
Show suggested prompts or examples to help users start the conversation
Use friendly, approachable language that reflects the AI's capabilities
Prompt input
Position persistently at the bottom of the interface
Include controls for formatting, attaching files, and additional features
States:
2a - Default: Empty input field with disabled send button
2b - Active/Focused: Show gradient color for user interaction, and transform send icon to stop icon during AI response generation
Legal statement
Position consistently in the chat below the prompt input or in the welcome message
Include link to responsible AI policy
Maintain visibility throughout the conversation
Conversation history
Display chronological sequence of messages
Provide clear visual distinction between user and AI messages
Support scrolling and navigation through conversation flow
GenAI responses
Present AI-generated content with clear visual hierarchy
Support multiple content types (text, code, data, chart, media)
Use distinct boundaries to separate responses
Maintain consistent formatting and styling
Response controls
Attach consistently to each AI response
Include standard actions:
Feedback mechanisms (thumbs up/down)
Copy to clipboard
Regenerate response
Additional options (report, share, edit)
Source information or explanations when available
Position controls uniformly across all responses
Pattern 3/6: Side-panel chat
Provides AI assistance to users while allowing them to maintain context in their main workflow. This pattern features a persistent or toggle-able panel positioned on the side of the screen that preserves the main workspace while offering continuous AI support.
Anatomy
Panel container
Dimensions:
Width: Default 400px, minimum 250px, maximum 800px
Height: Full viewport height
Resizable via drag handle
Panel header:
GenAI icon and chat title for clear identification
New chat button to reset conversation
Close/minimize controls
Visual separation from chat content
Behavior:
Preserves chat history during session
History cleared only on explicit user action
Maintains position and size preferences
Smooth resize transitions
User message
Displays the user’s input as part of the conversation thread
Right-aligned bubble, visually distinct from AI response
Optional: use same avatar as the user (if profile system exists)
Serves as history/context for transparency
GenAI response
Visually distinguishes from the user message with a consistent, left-aligned bubble
3a - Agent Avatar (optional): Left-aligned icon distinguishing AI from user messages
3b - Response content: Readable text or syntax-highlighted code output
3c - Action controls: Copy, feedback, and regenerate options
3d - Suggested prompts: Follow-up suggestions users can select or customize
3e - Generation State: Progress indicator with cancel/stop controls
Chat snackbar
Purpose: Temporarily surfaces response progress or decision-required states during AI interactions.
Use cases: Displays actionable options (accept, reject, cancel, run) and shows real-time progress indicators during AI content generation.
Placement: Anchored at the bottom of the chat panel, positioned directly above the prompt input field.
Benefit: Maintains immediate visibility of critical actions and status updates without interrupting the natural conversation flow or requiring users to scroll.
Prompt Input
Purpose: Primary field where users compose or enter prompts to interact with the AI.
Placement: Fixed at the bottom of the chat panel, ensuring persistent and easy access throughout the conversation.
Use cases: Supports free-form text entry, structured commands, and quick insertion of suggested prompts or templates.
Benefit: Delivers a consistent, accessible entry point for initiating AI interactions, maintaining user focus while enabling seamless engagement.
Pattern 4/6: Code assist
Provides AI assistance to users while allowing them to maintain context in their main workflow. This pattern features a persistent or toggle-able panel positioned on the side of the screen that preserves the main workspace while offering continuous AI support.
Anatomy
Cell controls: Interface elements for:
Running/executing code
Selecting code type (e.g., code, markdown, raw)
Initiating GenAI code assistance
Showing cell execution status
Input mechanism:
Where users specify their intent through comments, natural language queries, or partial code
Shows a gradient border animation only during active/focused states when user interacts with the input
Returns to normal border state when not in focus or active
Provides visual feedback to indicate where users can input their queries or code
States and behaviors:
Initial state: Users can input and modify prompt before generate code
Generating state:
Prompt becomes read-only
Shows generating state
Provides option to stop generation
Generated state:
Prompt remains read-only
Actions change to:
Accept and run generated code
Accept generated code
Reject generated code
Code accepted state:
Hide the prompt input
Generated code becomes part of the notebook
Code generation area:
Where AI-generated code appears, visually distinct from user code
3a - Suggestion preview: Inline display of proposed code with appropriate syntax highlighting
3b - Diff view: Visual representation of changes between current code and suggestion
Feedback controls: Options for: Thumbs up (positive feedback), Thumbs down (negative feedback), Copy code, Regenerate code, etc.
Code execution error state:
Occurs when code fails to execute
Shows execution error message
Provides "Fix with AI" action
Pattern 5/6: Inline overlays
Inline helper
Provides contextual assistance and validation that appears alongside text input fields. It offers immediate feedback, suggestions, and validation while users input content - ranging from technical identifiers to general descriptions. The pattern uses subtle indicators like icons, underlines, or popovers to provide guidance without disrupting the input flow.
Anatomy
Input status and interaction indicators
Interactive elements that serve both as status indicators and action triggers
Visual cues showing which input have suggestions, pending content, or are being processed
Clickable indicators that reveal AI-generated content for review when selected
Different states include:
Available suggestion (clickable to review)
Processing/generating (non-interactive)
Error state (clickable to retry or see error details)
AI indicators are only visible for fields with pending suggestions
Once content is accepted, AI indicators are removed and the cell appears as standard content
Optional subtle animation for the transition from suggestion state to accepted state
Ghost text: Lightly styled text showing the suggested completion
Suggestion bubble
Contains the header section, editable generated content, and action controls
Appears near the relevant text
Visually distinct but connected to the original content
May include formatting that highlights changes or additions
Generated content
Editable form field with generated content for preview
Regenerate option to get alternative suggestions
Multiple suggestions when applicable
Quick actions
Accept button to apply the suggestion
Reject to ignore the suggestion
Cancel/dismiss button to close the suggestion interface
Table assist
Enables intelligent interaction with structured data, providing cell-level, row-level, or column-level assistance within familiar spreadsheet layouts. This pattern empowers users to receive AI-generated suggestions within tabular data contexts, helping them fill missing values, identify patterns, or apply formulas. The pattern creates a distributed research environment where each cell can function as a mini-agent contributing to the whole dataset, turning the grid into both prompt canvas and output viewer.
Anatomy
Cell status and interaction indicators
Interactive elements that serve both as status indicators and action triggers
Visual cues showing which cells have suggestions, pending content, or are being processed
Clickable indicators that reveal AI-generated content for review when selected
Different states include:
Available suggestion (clickable to review)
Processing/generating (non-interactive)
Error state (clickable to retry or see error details)
AI indicators are only visible for cells with pending suggestions
Once content is accepted, AI indicators are removed and the cell appears as standard content
Optional subtle animation for the transition from suggestion state to accepted state
Ghost text: Lightly styled text showing the suggested completion
Suggestion bubble: Overlay showing AI-generated content, editable by the user
Generated content
Editable form field with generated content for preview
Regenerate option to get alternative suggestions
Multiple suggestions when applicable
Quick actions: Accept, reject, and cancel controls within the suggestion bubble
Bulk action controls:
"Accept all" / "Reject all" buttons for efficient batch processing
Alert banner with instructional text explaining bulk actions (e.g., "Use 'Accept all' to apply all suggestions at once" or "Use 'Reject all' to dismiss all pending suggestions")
Visual confirmation of bulk actions with option to undo
Progress indicator for bulk operations on large datasets
Pattern 6/6: Feedback
The GenAI response feedback/controls pattern provides users with actionable controls after receiving output from a generative AI system. These controls enable users to copy content, provide positive or negative feedback, and request regeneration of content. This pattern helps create a more interactive experience with AI-generated content while collecting valuable user feedback.Anatomy
Copy
Purpose: Copies the generated code or content to clipboard
Behavior: Should provide clear visual confirmation when copying is successful
Thumbs up
Purpose: Allows users to provide positive feedback on the AI response
Behavior: Should visibly confirm feedback submission (e.g., checkmark with "Feedback sent" label)
Thumbs down
Purpose: Allows users to provide negative feedback on the AI response
Behavior: Opens a lightweight, optional form for additional feedback details
Form characteristics: Should be dismissible, concise, and non-intrusive
Regenerate
Purpose: Requests a new AI output for the same input
Behavior: Preserves prompt context but yields a fresh content variation
Indicator: Should clearly show that new output will replace current suggestion
Options: May include ability to stop generation in progress or undo after regeneration