Mahmoud Ahmed — Lead Product Designer
Mahmoud Ahmed Lead Product Designer
Design Assessment · 48-Hour Challenge

Superchat AI - Conversational Assistant Onboarding

Solving a trust problem in AI onboarding: how to get users to grant calendar, contacts, and payment access when they haven't yet seen the product work.

Client CNTXT AI
Type Design Assessment
Platform Mobile · iOS
Deliverables 11 screens · iPhone · Onboarding to first response
My Role Sole designer strategy, user flow, components, and screen delivery
Tags AI Product Design · Conversational UI · UX Strategy · Mobile · Onboarding
Timeline 48 hours (timed assessment no extended research phase)
. . .

The Problem Before the Design

The Challenge

Superchat AI is a personal assistant that handles bookings, payments, calendar management, and messaging through conversation. It had roughly 3,000 users at the time of the brief. The onboarding problem was not a visual one it was a trust one.

Asking for calendar, contacts, location, and payment access before delivering any value creates a trust cliff: users hit a wall of permission requests before they have a single reason to say yes. The challenge was to redesign the onboarding so that commitment follows proof, not the other way around.

Approach

Discovery started with mapping the current experience not the app, but a real-world task. Following a UAE professional trying to book a restaurant reservation through her existing tools, the journey touched 9 separate apps and touchpoints: Calendar, Google, Instagram, Zomato, WhatsApp, a phone call, a third-party booking site, email, and iPhone Reminders all to complete one task, with no handoff between any of them and no automated follow-through.

That map defined the real opportunity: not a better search tool, not a better booking form removing the need to coordinate between tools entirely. The value proposition became the design brief.

Three Directions That Shaped the Design

New users need to trust the product before committing to it feature tours tell, they don't prove.

Permission requests need to arrive after value, not before otherwise the ask feels extractive.

The empty chat state needs to give users something to react to a blank input with no context loses users before the first message.

Structural Response

The answer to all three: defer everything that creates friction auth, permissions, pricing until after the user has seen the product work. Onboarding demonstrates value first. Permissions surface mid-conversation, framed as a value exchange, only when the action actually requires them. Auth comes after the product has already proven itself.

Key structural decision: value before commitment, friction after proof.
Splash → Onboarding (value demo) → Sign up / in → Account setup → Empty state → First message → [Permission request only if required] → Response
. . .

From Strategy to Interface

The 11 screens translate the strategy decisions directly into interface moments. Each screen resolves one of the three problem statements identified in discovery.

Design System
Typography Outfit Bold / Medium for headings and onboarding screens. Inter Regular / Medium for chat bubbles, body, and labels.
Colour Tokens Primary action #282233 (near-black) · AI bubble #eef2f8 · AI text #243b6b (dark blue) · Glass surface rgba(255,255,255,0.8)
Conversation Components Chat Bubble (outgoing / incoming variants), Map Widget, Calendar Widget, Payment Widget, Shimmer loader all purpose-built for a conversational UI context.
Permission Pattern Bottom sheet with value-framed copy, surfaced mid-conversation not at onboarding. Deferred to the moment the action actually requires it.