Back to Projects

HelloBot

HelloBot - AI Customer Service Platform
SaaS & Startup platform design - Complete UI/UX design for an AI-powered customer service bot with user flows, wireframes, and high-fidelity prototypes.

Overview

HelloBot is an AI-powered customer support experience designed to feel human, fast, and trustworthy. The goal was to reduce time-to-resolution without sacrificing brand voice, while giving support teams real control over what the bot can and cannot do.

Role: Lead product designer. Timeline: 5 weeks. Constraint: ship an MVP that could scale into a full platform.

Discovery & research

I started by auditing live chat transcripts and tagging repeated intents, then validated findings with interviews from agents and managers. The research surfaced three consistent pain points: unclear escalation rules, low customer confidence, and fragmented context between bot and human handoff.

  • Jobs-to-be-done: resolve quickly, know you're understood, and escalate when needed
  • Key moments: first reply, clarification loop, and handoff to a human
  • Success metric: fewer back-and-forth turns before resolution

Flow design

The UX focused on a tight conversation loop: clarify → confirm → act. I mapped flows for refunds, order changes, and account access, with explicit safety rails and escalation triggers.

  1. Intent capture with suggested replies and inline entity extraction
  2. Confirmation step for any action that changes data
  3. Handoff that preserves context (summary + timeline + metadata)

UI system & prototyping

I created a component library covering chat states (loading, typing, error, offline), attachment previews, and agent tools. Prototypes were built in Figma and validated with usability tests across mobile and desktop.

  • Design tokens: color, type scale, spacing, elevation
  • Accessibility: contrast checks, focus states, keyboard navigation
  • Microcopy: rewritten to feel confident, not robotic

Results

In pilot testing, support teams reported fewer repeated questions and smoother handoffs. Customers rated the experience as clearer thanks to the explicit confirmation step and better escalation messaging.

Artifacts: case study, Figma file, and interactive prototype.

What I'd do next: add tone presets, intent analytics dashboards, and agent feedback loops to continuously improve responses.