Industry
Software Development
Highlight
Approval workflow · Human-AI interaction · Hackathon winner
Superchat: Designing Trust for Agentic AI Decisions
Expected Product Impact
Increased AI agent adoption, accelerated approvals, and strengthened trust in human–AI collaboration.
Time
18 April 2026
Hackathon Organizer
Tool
Client
My Role
UX/UI Designer
My Team
1 Product Manager, 2 UX/UI Designers
Context
Superchat is evolving into an agentic AI system that can execute tasks for SMB owners, creating new UX challenges around trust, control, and clarity. At the XDesign Hackathon in Berlin, our team designed an AI decision-making interface in 4 hours and took the 1st place in the track.
Business Problem & Objectives
Build trust in AI agents through transparent decision flows that reduce risk and friction and enable confident action.
Solution
Designed AI-assisted conversational workflows that help SMEs (Small and medium enterprises) manage high-volume communication through contextual response generation, multi-turn interaction support, and human-centered AI guidance.
Lean Hybrid Workflow = AI-assisted Design + Human Oversight
01 Synthesize Design Problems and Requirements
02 Funnel and Define Design Scope
03 Vibe coding Design Ideas & Iterate Prototype
Problem Definition
Superchat Problem Statement
AI agents are starting to take real actions on behalf of businesses — upgrading plans, processing refunds, booking appointments, updating customer records. For high-stakes actions, the owner needs to stay in the loop. But „Approve / Deny" is nowhere near enough. Design the mobile-first approval moment: the 10 seconds between the agent asking for the go-ahead and the owner tapping back. Sometimes it's a quick yes. Sometimes it's nuance — a cap, a condition, a whisper in the agent's ear. Sometimes it's „let me handle this myself." Design that full spectrum.
Synthesis of Business Requirements
To understand design challenge and business requirements from Superchat effeciently, we used Claude to visualize the synthesis of the data and discussed it in FigJam.
Assumptions
01
Owners scan AI messages for inconsistencies, not detail.
Conversational Scannability
02
Binary approve/deny is a conversational dead end.
Nuanced AI Dialogue
03
The AI agent tone calibration should be a trust mechanism.
Agent Voice Design
04
Approval delay damages the customer experience.
Conversation Continuity
05
Human takeover should continue the conversation, not restart it.
Dialogue Persistence
Target Users Archetype
The always-on, never-at-the-desk SME owners who trust their AI agent to handle most things, but they still want to stay in control for critical decisions. Due to time constraint, we focused only on the restaurant manager whom we are more familiar with their working process.
Restaurant Manager
BEHAVIOUR
Mid-shift, hands full, eye on the floor. No time to read long text and type.
PAIN
Approval delays make the agent look broken. Overloaded, he blanket-approves everything to clear the queue.
GOAL
Decide from the lockscreen. Speak a modifier or click a button instead of typing it.
Define Design Scope
Design focus on enhancing efficiency and reducing cognitive load
Mobile-first interaction design
Notification & alert design
Micro-interactions & motion
Copy and tone of voice
Progressive disclosure of context
Voice UI for true hands-free control
User Flow
AI interactions with human are tailored to restaurant manager's user flow.
Scenario
The AI agent, Aria,ordered fish within budget, but Vendor 1 can’t deliver on time, so she triggered backup vendors for priority offers.
Problem
The restaurant manager needs quick decision on the most suitable backup vendor with Aria for the fish delivery because the restaurant manager is in the mid-service and doesn't have time to find alternative vendors on her own.
User flow
Design Decisions: The Agent Persona "Aria"
Based on the user flow, we decided to build an AI Agent, Aria, with communication principles customized for the busy SMB owners like restaurant managers.
Aria's Communication Principles
Active voice, past tense for actions taken
"I ordered cod from Vendor 1. They can't deliver on time." — not "There was a delivery issue."
Stakes-first structure
Lead with impact, then context. Mirrors how humans communicate urgency.
No hedging on recommendations
"I recommend Vendor 2" not "You may want to consider Vendor 2." Trust requires conviction.
Transition language for handovers
When the human takes over, Aria's draft stays visible with an edit-in-place affordance — the conversation doesn't break.
Rapid Prototyping
Design Solutions Based On AI Conversational Arc
We structured the AI's communication as a 3-act conversation:
INFORM
Act 1 – Situation Report
What happened and what Aria did
PERSUADE
Act 2 – Decision Request
What Aria recommends and why, with transparent stakes
CLOSE THE LOOP
Act 3 – Confirmation
Outcome feedback in Aria's voice/tone
1st Version v.s. Final Version
Act 1
Restaurant manager received Aria's message notifying the supply chain problem with vendors and her action to solve it.
1st Version without Iteration
Lock Screen Messages
Three messages on one screen causes high cognitive load and confusion with decision-making prioritization
Messages contain repetitive information
Final Version after Iteration
Problem & Response Message
Only one most important message shows on one screen
The problem and response message from Aria has clear information structure and calm confidence
Act 2
Restaurant manager received Aria's message notifying the need for approving Aria's recommended decision or making other alternative decisions with context and risk analysis.
1st Version without Iteration
Act 2: Decision-making Message
Unstructured information hierarchy
Disconnection between relevant information, e.g. CTA button and recommended vendor
Final Version after Iteration
Act 2: Decison-making Message
Simple taps with mic feature on deciding the next step
Refined hierarchy with card-based context and calm, concise micro-copy
Interactive Prototype
Takeaways
01
Define a clear, realistic scope early
02
Prioritizing simplifying the user flow to support the core use case
03
Align quickly across product and design
04
Conversational UX is the core principles for designing AI communication
Conclusion
AI communication for supporting humans in the critical situations, e.g. making decisions, should be designed as dialogue that is built by UX language for how people listen under stress, not how they read when calm.
Future Plan
Deepen UX fundamental knowledge and skills to develop human judgement for AI-assisted design.
Prototype on Lovable
Design Solution Pitch Slides on Github
Superchat Design Challenge on XDesign Club Hackathon Website