Charting Success: Transforming our Chatbot Perception and Value.

Jack Yu Chen
5 min readMar 10, 2024

--

Index:

  1. Briefing (Introduction)
  2. Discovery — Path Determination (+ Interviews)
  3. Business Report — User Persona (+ User Discovery)
  4. Business Report — UX wireframes definition 1 (+ User Testing)
  5. Business Report — UX wireframes definition 2 (+ User Testing + Final Decisions)
  6. Business Report — UI Prototypes — Final Outcomes
  7. Business Reports — UI Prototypes (illustration design)
  8. Workflow Method
  9. Conclusions and Opinion

Introduction:

Certainly is a B2B company specialised in chatbots, offering a SAAS that facilitates the creation of chatbots with artificial intelligence. Mostly, our clients are online stores using our chatbots to provide quality customer service, replicating the experience of the best customer service employee in their digital version.

Challenge:

During the pandemic, several clients had to adjust their budgets and decided to discontinue our services. This highlighted that our clients didn’t perceive the value of our chatbots.

Development Time and Team:

4 weeks. Luis R. (PD) and Anna N. (PO).

Potential Solution:

The Reports section was crucial to demonstrate the value of our chatbots and was outdated. This section is fundamental to assess the bot’s quality and enhance customer service, thereby also increasing its value.

Legacy Reports:

Previously, our reports focused on providing a filter for customer messages. However, with this limited approach, it was challenging to detect errors in chatbot construction and extract valuable insights. Hence, clients had to contact our Customer Success team to request the reports they needed.

The interface was hard to grasp and not user-friendly, with numerous errors hindering users from meeting their goals.

Discovery — Path Determination (+ Interviews):

To begin the project development, it was necessary to understand our clients’ needs. Through interviews with our Customer Success team and real clients, we discovered two types of users who could benefit from these reports.

User Persona 1 was the chatbot construction and maintenance team, while User Persona 2 prepared reports to demonstrate the bot’s value to their stakeholders.

We identified each of their pain-points and hypotheses.

This story will focus only on User Persona 2’s journey: “Understanding bot’s value business path.”

Business Report — User Persona (+ User Discovery):

After drawing conclusions from the “business path,” we began selecting and sketching the most suitable graphs to present different cases and make discoveries with our clients. We documented the advantages and disadvantages of each graph, selecting many of them for business reports and others for different types of reports.

For example, we found that the bar chart was very understandable for users in absolute terms, but not for showing trends (necessary in business reports), for which a line chart was better.

Business Report — UX wireframes definition 1 (+ User Testing):

After determining the most convenient graphs, we designed the initial prototypes with findings from previous interviews. Both the Customer Success team and our clients helped us decide the most important parameters to demonstrate the value of our chatbots to their stakeholders.

After noticing that many users were unclear about how the tracking worked and how success was measured, we took steps to address this. We decided to provide more information through tooltips and revised the titles for clarity.

For example, Conversion Attributions, later renamed Revenue Impact, tracked conversions and considered them successful if a client added a product to the cart recommended by the bot, all facilitated through WebSDK.

Business Report — UX wireframes definition 2 (+ User Testing + Final Decisions):

In previous interviews and user testing, as I said, we found that the trend chart was crucial for stakeholders. On the other hand, the donut chart wasn’t well understood, so we decided to remove it.

Key takeaways from the findings:

  • Tracking Origin Metric: To understand how customers navigate their website and identify potential errors in bot construction.
  • User Intent Metric (AI): To verify if the user’s intention aligns with the designed flow and if the trained LLM (AI) model is accurate or requires more data.
  • Handover Metric: What percentage of users choose or prefer to speak with an agent and why?

Business Report — UI Prototypes — Final Outcomes:

Once the data structure and parameters were defined and confirmed, we crafted the final user interface. It was crucial to address visual clutter, visual hierarchy, and ensure the components were well integrated into the Design System.

We also defined hover behaviours on tables, legend placement, and each page of the various tabs.

The challenge lay in delivering all pertinent information within a limited space without overwhelming the user. Information architecture and visual prioritisation through colours and whitespace played pivotal roles here.

Business Reports — UI Prototypes (illustration design):

We define all scenarios: empty states, and also “no tracking activated” states, where we aim to promote and encourage the user to utilise that metric through tags within the chatbot flows. Consequently, we design various illustrations tailored to the latest trends while staying true to the company’s image/essence.

Moreover, we create modals, each requiring a distinct illustration, all designed in accordance with the existing illustrations.

Workflow Method:

In complex and lengthy projects, it’s essential to optimise workflow and structure work before developing screens. Here, we defined the complete behaviour of a section: default state, empty state, hover on graphs, loading states, and responsiveness. This way, we avoided having to design the behaviour of each individually, simplifying the working process.

Conclusions and Opinion:

This is a brief summary of a long and complex project I recently worked on. The entire project development seemed comprehensive and interesting. From defining the two user types and generating the journey with all opportunities, it was crucial at the project’s outset. I’m very pleased with the project’s outcome, which has added significant value to the platform and reduced client churn by 80%.

I also want to thank my colleagues Luis and Anna. Having a good team where there’s empathy, fluid communication, and comfortable work has made me thoroughly enjoy this project from start to finish.

Thank you for staying engaged until the conclusion.

--

--

Jack Yu Chen

A decisive, intercultural and consistent UXUI designer and architect. With great abilities to learn languages and working processes.