ChatFusion: Designing the Chatbot Settings Functionality

Help businesses improve customer satisfaction.
B2B
End-to-end
SaaS Platform
2024
AI
Role
Product Designer
Team
Myself, CEO, product manager, multiple front-end and back-end engineers
Type
0-1, Branding, web app, product strategy, design thinking.
Duration
8 months
Tools
Figma

Overview

Challenge

Since creating a bot is the core functionality of our chatbot app, it comes with a wide range of settings. And as a new product, attracting new users is essential to our business goals. How can we capture users' interest early on without overwhelming them?

Design Goal

Cater to different users at different stages. Maintaining usability while managing complexity—ensuring that users can easily find, understand, and adjust settings without feeling overwhelmed.

Results

I manage to create an intuitive bot settings process along with a bot creation wizard for first time users. The stakeholders and team felt satisfied with the design outcome.

Design Solution

These are some of the design solution highlights to make the bot settings experience a success. The third solution being the most important at an early product stage.

Solution 1: Categorization & Grouping

We listed out all of the settings and group. Rather than group the settings based of what we think "feels" right, we identify the settings based on 3 clear user goals:
1) Training: How the bot thinks and says, what their tone should be, what goals should the bot have (like asking for phone or email, asking customers to sign up etc.)
2) Customization: What the bot looks like, including name display, logos and other static display like welcome messages
3) Implementation: All the other technical settings when implementing the bot
By using the top header for tabs, users can easily switch between tabs for different settings to avoid being overwhelmed. Collapsible sections were also designed to avoid a long scrolling experience.

Solution 2: Design beyond our users' immediate needs

To help guide users to focus on their immediate goals, we defaulted "Training" to text-only, so users can focus on chatting with bot for training, and "Customization" to a live preview of the bot, so users can change the live settings and preview at the same time.

Solution 3: Bot creation wizard to for new/low intent users

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 what we offer, allowing them to easy upload their source by entering a link, do a bit of customization and interact with the bot.

This process was designed to get new and low intent users to sign up for our service, eventually becoming long term users.
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