GenA\ Generative A\ Experiences /
GenA\X Generative A\ Experiences | HC\
/
UXU\ + A\X Agents working together.
UXU\ + A\X Agents working together.
UXU\ + A\X Agents working together.
A\X Patterns
A\X Patterns
A\X Patterns
UXU\ A\
Product Design Patterns for
Human-Agentic
\ntelligent \nteraction
Experiences [A\X]
Everything in life follows a pattern for the interaction contract between humans and machines.
UXU\ A\
Product Design Patterns for
Human-Agentic
\ntelligent \nteraction
Experiences [A\X]
Everything in life follows a pattern for the interaction contract between humans and machines.
UXU\ A\ Product Design Patterns for Human-Agentic \ntelligent \nteraction Experiences [A\X] AX and/or A\X Design is not a future discipline. The shift from UXU\ to A\X is not a rebrand. It changes fundamental assumptions about who is using the interface and how. It is happening now, defined by the products shipping today and the patterns they establish.
Nielsen Norman Group has not published their definitive framework yet. IDEO has not entered the conversation. Most companies are still at Level 1 or Level 2 maturity.
The organizations and agencies that define AX or A\X patterns in this window will set the standard for how humans and A\ agents will work together for the next decade. Just as responsive design became the default after 2012, and mobile-first became the default after 2015, AX or A\X patterns will become the default expectation for any product with A\-powered capabilities from year 2025.
Also, AX or A\X patterns are key for designers and developers building A\-first products. In fact, it’s crucial to consider the interaction contract between humans and machines.
Product Design
Patterns for
UXU\ A\X
or
Human-Agentic
\ntelligent \nteraction
Experiences
[A\X]
Product Design
Patterns for
UXU\ A\X
or
Human-Agentic
\ntelligent \nteraction Experiences
[A\X]
Product Design Patterns for
UXU\ A\X
or
Human-Agentic
\ntelligent \nteraction Experiences
[A\X]
John Maeda
MIT | Design in Tech Report SXSW | 2026
20+
257+
315+
UXU\ A\X
Patterns
77%
84%
94%
World's U\s
Have no A\X yet
Pixelmojo
From UXU\ to A\X or AX | 2026
20+
257+
20+
UXU\ A\X
Patterns
77%
84%
77%
World's U\s
Have no A\X yet
Pixelmojo
From UXU\ to A\X or AX | 2026
20+
257+
20+
UXU\ A\X
Patterns
77%
84%
77%
World's U\s
Have no A\X yet
One
PMs Using A\
"Now—I don't have to wait on DESIGNERS for mockups!"
Two
Designers Using A\
"Now—I don't have to wait on DEVELOPERS for code!"
Three
Developers Using A\
"Now—I don't have to wait on PMs for requirements!"
A\
But the bottlenecks have always been:
Alignment and decision-making regardless A\.
<
21
>
Design
Patterns
[for next-gen UXU\ A\X Products]
Your product just got a new user.
and—It Is Not Human.
<
21
>
Design
Patterns
[for next-gen UXU\ A\X Products] Your product
just got a new user.
and—It Is Not Human.
<
21
>
Design Patterns
[for next-gen
UXU\ A\X Products]Your product
just got a new user.
and—It Is Not Human.
The organizations and agencies that define AX or A\X Patterns in this window will set the standard for how humans and A\ agents work together for the next decade.
GenA\ or No GenA\
Intercom's FinA\ captures user intent and provide detailed explanations compared to a structured button based chat bot interface or FAQs list.
GenA\ or No GenA\
Intercom's FinA\ captures user intent and provide detailed explanations compared to a structured button based chat bot interface or FAQs list.
Data Needs
Convert User Needs to Data Needs: Paper "Towards Accountability for Machine Learning Datasets" outlines best practises of Data development cycle in software engineering.
Data Needs
Convert User Needs to Data Needs: Paper "Towards Accountability for Machine Learning Datasets" outlines best practises of Data development cycle in software engineering.
Augment vs Automate
A\ tools like Magenta Studio in Abelton gives creative controls to manipulate and create new music without taking over the process.
Augment vs Automate
A\ tools like Magenta Studio in Abelton gives creative controls to manipulate and create new music without taking over the process.
Define Level of Automation
Github Co-Pilot is an example of Partial Automation. It suggests code based on context but user could edits, accepts or ignores suggestions.
Define Level of Automation
Github Co-Pilot is an example of Partial Automation. It suggests code based on context but user could edits, accepts or ignores suggestions.
Provide Data Sources
Google NotebookLM adds citations automatically. It links each answer directly to the part of the user's uploaded document where the information came from.
Provide Data Sources
Google NotebookLM adds citations automatically. It links each answer directly to the part of the user's uploaded document where the information came from.
GenA\ Adoption
Progressive GenA\ Adoption such as Adobe FlreFly progressively onboards user with basic to advance A\ features.
GenA\ Adoption
Progressive GenA\ Adoption such as Adobe FlreFly progressively onboards user with basic to advance A\ features.
Leverage Mental Models
Generative Expand in Photoshop builds on the familiar idea of expanding an image. Users simply extend the canvas and then prompt the tool to fill the new space.
Leverage Mental Models
Generative Expand in Photoshop builds on the familiar idea of expanding an image. Users simply extend the canvas and then prompt the tool to fill the new space.
Convey Product Limits
Convey Product Limits using A\. Claude A\ assistants clearly state their knowledge cutoff dates or when they are unsure about an answer or when a question falls outside their training data.
Convey Product Limits
Convey Product Limits using A\. Claude A\ assistants clearly state their knowledge cutoff dates or when they are unsure about an answer or when a question falls outside their training data.
Display Chain of Thought
Perplexity A\ enhances transparency by displaying its processing steps helping users understand the thoughtful process behind the answers.
Display Chain of Thought
Perplexity A\ enhances transparency by displaying its processing steps helping users understand the thoughtful process behind the answers.
Leverage Multiple Outputs
Google Gemini provides multiple options to help user explore, refine and make better decisions.
Leverage Multiple Outputs
Google Gemini provides multiple options to help user explore, refine and make better decisions.
Convey Model Confidence
Grammarly app uses verbal qualifiers like "likely" to the content it generated along with the user.
Convey Model Confidence
Grammarly app uses verbal qualifiers like "likely" to the content it generated along with the user.
Memory and Recall
Design for Memory and Recall. ChatGPT remembers key facts you've shared to personalize future chats. You can view, update, or delete these memories anytime.
Memory and Recall
Design for Memory and Recall. ChatGPT remembers key facts you've shared to personalize future chats. You can view, update, or delete these memories anytime.
Data Privacy & Controls
Communicate Data Privacy & Controls. Slack A\ clearly communicates that customer data remains owned and controlled by the customer, and is not used to train Slack's or any third-party A\ models.
Data Privacy & Controls
Communicate Data Privacy & Controls. Slack A\ clearly communicates that customer data remains owned and controlled by the customer, and is not used to train Slack's or any third-party A\ models.
Input Parameters
Provide Contextual Input Parameters. ElevenLabs lets you adjust several settings to design a custom voice.
Input Parameters
Provide Contextual Input Parameters. ElevenLabs lets you adjust several settings to design a custom voice.
Design for Co-Pilot
Design for Co-Pilot. Notion A\ helps you draft, summarize, and edit content while you control the final version.
Design for Co-Pilot
Design for Co-Pilot. Notion A\ helps you draft, summarize, and edit content while you control the final version.
Controls for Automation
Design User Controls for Automation. Users can enable or disable predictive text and auto-replies on Gmail app.
Controls for Automation
Design User Controls for Automation. Users can enable or disable predictive text and auto-replies on Gmail app.
User Input Error states
Design for User Input Error states. When given vague prompts like "What's the capital" the models often reply to clarify further context.
User Input Error states
Design for User Input Error states. When given vague prompts like "What's the capital" the models often reply to clarify further context.
Capture User Feedback
Design to Capture User Feedback. ChatGPT uses Reaction buttons (thumbs up or thumbs down), Comment boxes and Clarification prompts to collect user feedback.
Capture User Feedback
Design to Capture User Feedback. ChatGPT uses Reaction buttons (thumbs up or thumbs down), Comment boxes and Clarification prompts to collect user feedback.
A\ Error States
Design for A\ Error States. CitiBank financial fraud system displays the following error message because of False positives or false negatives.
A\ Error States
Design for A\ Error States. CitiBank financial fraud system displays the following error message because of False positives or false negatives.
Design for A\ Guardrails
Design for A\ Guardrails. Instagram uses hybrid approach of user feedback for A\ to spot toxic content and misinformation and stop from it spreading.
Design for A\ Guardrails
Design for A\ Guardrails. Instagram uses hybrid approach of user feedback for A\ to spot toxic content and misinformation and stop from it spreading.
Model Evaluations
Design for Model Evaluations. Amazon Bedrock, a managed A\ service uses LLM-as-a-judge feature for model evaluation.
Model Evaluations
Design for Model Evaluations. Amazon Bedrock, a managed A\ service uses LLM-as-a-judge feature for model evaluation.
<
7
>
A\X Layouts
[next-gen \nterfaces for A\X]
Each U\ layout here changes
how A\ helps and when it's used.
<
7
>
A\ Layouts
[Next-gen \nterfaces for A\X] Each U\ layout here changes
how A\ helps and when it's used.
<
7
>
A\ Layouts
[Next-gen \nterfaces for A\X]Each U\ layout here changes how A\ helps
and when it's used.
Whether you’re working with chat-bots, generative tools, or autonomous agents, thoughtful interface design can transform A\ from a black box into a truly empowering experience.
Chatbot Widget
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Customer support, FAQs, quick tasks
Chatbot Widget
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Customer support, FAQs, quick tasks
Inline Overlays
Suggestions inside your work. Perfect for small edits or assistance (like rephrasing or code hints) without breaking flow. Edits, rephrasing, summaries, coding hints
Inline Overlays
Suggestions inside your work. Perfect for small edits or assistance (like rephrasing or code hints) without breaking flow. Edits, rephrasing, summaries, coding hints
Infinite Canvas
Creative playground. A\ supports brainstorming and visual tasks by interacting directly with objects on a large canvas. Brainstorming, layouts, creative workflows.
Infinite Canvas
Creative playground. A\ supports brainstorming and visual tasks by interacting directly with objects on a large canvas. Brainstorming, layouts, creative workflows.
Center Stage
Full-screen assistant. Best for open-ended conversations [like ChatGPT] where users lead the interaction with prompts. Writing, research, idea generation.
Center Stage
Full-screen assistant. Best for open-ended conversations [like ChatGPT] where users lead the interaction with prompts. Writing, research, idea generation.
Left Panel
Strategic co-creator. A\ sits in a side panel to help with ongoing, complex tasks, especially good for structured content or code. Co-creation, complex structured tasks
Left Panel
Strategic co-creator. A\ sits in a side panel to help with ongoing, complex tasks, especially good for structured content or code. Co-creation, complex structured tasks
Right Panel
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Writing, debugging, summarizing, enterprise tasks
Right Panel
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Writing, debugging, summarizing, enterprise tasks
Grid
Smart spreadsheet. Each cell acts like a mini-A\ agent-great for research, data synthesis, or structured tasks. Research, data synthesis, and structured content.
Grid
Smart spreadsheet. Each cell acts like a mini-A\ agent-great for research, data synthesis, or structured tasks. Research, data synthesis, and structured content.
<
7
>
A\-powered
Design Tools
[next-gen \nterface design tools]
Understanding of
if/when
they are useful.
<
7
>
A\-powered
Design Tools
[Next-gen \nterface design tools] Understanding of
if/when
they are useful.
<
7
>
A\-powered
Design Tools
[Next-gen
\nterface design tools]Understanding of
if/when
they are useful.
Whether you’re working with chat-bots, generative tools, or autonomous agents, thoughtful interface design can transform A\ from a black box into a truly empowering experience.
F\GMA [ MCP ]
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Customer support, FAQs, quick tasks
F\GMA [ MCP ]
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Customer support, FAQs, quick tasks
F\GMA [ Buzz ]
Suggestions inside your work. Perfect for small edits or assistance (like rephrasing or code hints) without breaking flow. Edits, rephrasing, summaries, coding hints
F\GMA [ Buzz ]
Suggestions inside your work. Perfect for small edits or assistance (like rephrasing or code hints) without breaking flow. Edits, rephrasing, summaries, coding hints
F\GMA [ Code Connect ]
Creative playground. A\ supports brainstorming and visual tasks by interacting directly with objects on a large canvas. Brainstorming, layouts, creative workflows.
F\GMA [ Code Connect ]
Creative playground. A\ supports brainstorming and visual tasks by interacting directly with objects on a large canvas. Brainstorming, layouts, creative workflows.
F\GMA [ Design ]
Full-screen assistant. Best for open-ended conversations [like ChatGPT] where users lead the interaction with prompts. Writing, research, idea generation.
F\GMA [ Design ]
Full-screen assistant. Best for open-ended conversations [like ChatGPT] where users lead the interaction with prompts. Writing, research, idea generation.
F\GMA [ Slides ]
Strategic co-creator. A\ sits in a side panel to help with ongoing, complex tasks, especially good for structured content or code. Co-creation, complex structured tasks
F\GMA [ Slides ]
Strategic co-creator. A\ sits in a side panel to help with ongoing, complex tasks, especially good for structured content or code. Co-creation, complex structured tasks
F\GMA [ Sites ]
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Writing, debugging, summarizing, enterprise tasks
F\GMA [ Sites ]
Quick help, bottom-right corner. Best for lightweight, reactive tasks like customer service or FAQs. Writing, debugging, summarizing, enterprise tasks
F\GMA [ FigJam ]
Smart spreadsheet. Each cell acts like a mini-A\ agent-great for research, data synthesis, or structured tasks. Research, data synthesis, and structured content.
F\GMA [ FigJam ]
Smart spreadsheet. Each cell acts like a mini-A\ agent-great for research, data synthesis, or structured tasks. Research, data synthesis, and structured content.
.
1
3