ChatFusion: Designing a chatbot builder platform from the ground up.

A web app for users to create and train their own webchat to generate leads and ad clicks to elevate their businesses.
TYPE
SaaS Platform
End-to-end Design
TIMELINE
Nov 2023 - Jul 2024
(8 months)
TEAM
1 UI/UX Designer
1 Product Manager
6 Frontend & Backend Engineer

Overview

About ChatFusion

ChatFusion is an advanced ChatGPT-powered chatbot builder developed by Onramp Lab, with the ability to hold a conversation with customers and manage difficult tasks, these chatbots enable businesses to improve and maintain customer engagement to increase company growth.

Our platform aims for these businesses to easily create and train custom chatbots without hassle.

My Role

As the only designer on this project, I independently led the design of the entire product from 0-1 while working closely with stakeholders and product manager.

Impact

With the MVP, the team has gotten several US big companies like BlackPanda, American Addiction Center and many more to use the product while we continue to build the product and expand our users.

Business Challenge

1. With the quick, ever-changing AI market needs, to find a unique positioning to stand out from the highly competitive AI chatbot industry.
2. To produce a MVP in a timely manner while rapidly adapting to changing features and needs

Research

Background

Customer service and maintaining customer satisfaction play a crucial role in business growth, but many businesses struggle with it. 
While some face the lack of human resources for immediate responses to customers, others face drop-offs and low user satisfaction when their customers interact with the traditional AI chatbots that they had faced on their website.

Our Goal

With the rise of ChatGPT, we want to introduce a newly, more advanced way of customer service solution to these businesses - ChatGPT powered chatbots that are fully capable of holding a conversation. Also easily trained by just uploading knowledge bases.

Define

Competitor Analysis

To position ourselves better in the market, we looked into a few other highly-customizable chatbot service on the market that are also using GPT models as natural language.
We realized that apart from answering questions, allowing the bots to capture custom lead information and allowing better management of multiple bots and knowledge base could make us stand out from the crowd, especially the ability to share knowledge bases (sources) across different projects.

Product Goals (Solution)

Thus, the team and myself were determined to build an AI chatbot that
1. Uses ChatGPT model
Capable of having real, flowing conversations with website visitors to increase user satisfaction.
2. Upload own sources to easily train bots
Train chatbots by simply entering a website link or uploading source like PDF, Excel etc., no longer needing to do one by one FAQs.
3. Helps with lead generation and boost actions
Can help boost actions, like collecting customers info, sign ups or help redirect to link, gain new customers and revenue.
4. Multiple bot structure and management
Introduce the notion of projects and knowledge bases to manage different bots and sources with the ability to share knowledge bases (sources) across different projects.
5. Intuitive user experience
Design an intuitive interface for businesses with minimal learning time by incorporating a quick creation wizard.

Business Goals

For us to gain users (businesses) by providing an easy, self-explanatory bot creation process and unique features that stands out from other chatbot services, eventually converting them to long-term users.  

The Product

Information Architecture

Unlike most similar chatbot services with a single bot by bot structure, we provide the notion of organizing sources using knowledge bases and bots using projects. So users can better categorize items and resources can be shared across projects.

Overall User Flow

Taking into account that this is a new product, gaining users' interests and eventually getting them to sign up for the service is one of our top priority at this stage. We decided to introduce the notion of a quick bot creation wizard, for users with little time and just wanted to see what the product provides without investing too much time.

The Design

01 Dashboard

Users can view quick analytics, access recent bots and create chatbots. The turning icon in the top header is shown when there are still uploading and training in progress.  
*Due to the time constraint, the team decided to use external analytics, inserting an iframe in the dashboard before developing a detailed analytics in the next phase.

02 Projects

03 Bot Settings

As the main functionality of the entire app, there are a few thought process behind the designs.

04 Upload Source

Familiarity plays a crucial role in the usability and overall user experience of a product or service as they are more likely to be easily understood by users. Within the app, the users can either upload sources via the bot settings or directly to the knowledge base library. I wanted to try my best to keep these two user experiences consistent across the product to maximize usability.
A. Upload from Bot Settings:
User are able to select knowledge base and upload source in a popup module from the bot settings for a more intuitive experience.
B. Upload to Knowledge Base:
User can also upload sources directly to the knowledge base library.

05 Quick Bot Creation Wizard

To capture the users' interests at an early stage, I created this quick wizard coming from the landing page to let users get a taste of the technology we provide, allowing them to easily upload their website content by merely entering a link, do a bit of customization and interact with the bot that they created.

But to actually implement the bot, they will have to sign up for our services.
Goal:
This process was designed to get low intent users to sign up for our service.

Mobile Experience

With a much smaller real estate, the mobile version is bound to have a different experience from the desktop version. Main feature on the mobile version includes chatting with existing bot, viewing leads, analytics and conversations. Creating and editing bot were left out of the mobile version due to its complexity.

Reflection

While the product is still under development, I felt like I have learned a lot from such a large scale project. I challenged myself to think about a lot of variations, created prototypes to test and to communicate within the team. Also to think about design from different users' mindsets, making thoughtful design decisions that benefit my users.

Super grateful to the team for trusting me 100% and giving me complete freedom to design. If there were one thing I could have done if I had more time is to get real users feedback at an earlier stage. Also improve the design of all the empty states, add interactions and onboarding experience, which were set to be Phase 2 items.

Design Guidelines

Quick bot creation wizard
Below shows a quick prototype to the flow of the bot creation wizard for a first time user that lands on the landing page. The wizard will end with a sign up screen.

Other Works