A.I. Voicebot
Merging existing voice conversational AI technologies and products to create a new no-code, enterprise-grade AI voice call product.
Company
Asiabots
Date
2021-2024
Role
UX and UI Designer
Background
In late 2021, our senior leadership decided to integrate our existing voice conversational AI technologies with several voice call projects to launch a new product, the A.I. Voicebot.
This product targets organizations and enterprises heavily invested in phone-based customer service, helping them automate their phone call workload and save resources on repetitive tasks.
Here are some of our company's past voice call projects and voicebot proposals. Initially, senior leadership aimed to extract the "usable parts" from these designs and integrate them into the new AI Voicebot.
However, instead of simply piecing together existing features presumed to be useful, I proposed summarizing our discussions on how the AI Voicebot benefits the target audience as product goals. We then brainstormed and designed the new product around these goals:
product GOALS
No code call automation Building experience
multiple language outbound call editor and inbound call handling
easy to track call performance and trends
The Initial Design - Designing under constraints
As AI voice call products were rare in the 2021 market, my team had to design this product from scratch without any industry references.
Additionally, we faced a tight project schedule with a target to complete at least a minimum viable product (MVP) by early 2022.
The design of the product was also constrained by the existing backend system, as this new product is based on engineering from past voice call projects used by some trial clients.
To enhance collaboration efficiency with engineers and business team members, I suggested creating and presenting wireframes in meetings. This approach effectively engaged participants by visualizing the proposed experience flow and ideas, giving everyone a clear picture of the product's potential appearance.
The MVP features a simple Call Flow Builder with a logic indicator (e.g. When, Then, And), inspired by Automation Flow Builders in the market, to assist users with no prior automation experience.
We designed the UI for call performance benchmarks, call records, and call flow to display the essential information agreed upon by our early customers, aiding their daily customer service routines.
After the MVP - Iteration, refining the product experience
The MVP was swiftly developed and presented to a few initial customers to both test the product and collect feedback for our next design improvements.
Based on this feedback and some unmet requirements, we have identified several potential directions for enhancement.
1
Redesign current call flow builder to better handle multi-level IVR call flow design
Customers have complained that the call flow builder makes it difficult to locate their desired call path, especially when constructing complex AI IVR inbound call flows. This issue arises as they add dozens of call paths time after time.
2
Improve visual hierarchy and reduce cognative load to help user get their job done quicker
Following the continued usage of the A.I. Voicebot, the amount of information processed has drastically increased. From our observation sessions and user interviews, we found that users sometimes get lost when searching for specific information and monitoring the status of calls.
3
Align the difference between the ideal UI design and actual look
Facing a tight product development schedule and a shortage of front-end developers, the engineering team moved forward before the design process was completed. As a result, some UI elements were borrowed from existing projects, and misalignment of the same components was spotted in the UI.
The updated flow builder now features a full-screen dialog, providing extra space for two segmented sections of the UI: the multilingual path list with a warning indicator on the left and the path edit section on the right.
We received very positive feedback from clients about this new design, as it significantly reduces users' interaction costs by minimizing scrolling, locating information, and navigating through complexly structured call flows, thereby enhancing their flow-building and management efficiency.
To unify reusable components and design languages across the AI Voicebot and other company products with Admin Panel Style design, we developed a new Admin Panel Design System.
This system ensures consistent user experiences and streamlines the development process, reducing miscommunication and saving time by eliminating task redundancy.
We developed a new performance and information display design to highlight the most relevant information for users, while reducing the visibility of less frequently used actions and less important information, either by minimizing their presence or progressively disclosing them.
Outcome
The AI Voicebot continues to evolve based on continuous client feedback. Powered by our market-leading Cantonese and Mandarin AI conversation technologies for Text-to-Speech and Automatic Speech Recognition, the AI Voicebot is now trusted by public transport companies, NGOs, and government departments in Hong Kong and Taiwan to handle a large number of daily hotline calls from the public.
Electrical and Mechanical Services Department (EMSD), the Government of Hong Kong
TurboJet, a major high-speed ferry company in Hong Kong and Macau.
AIA Group, a Hong Kong-based multinational insurance and finance corporation. It is the largest publicly listed life insurance group in Asia-Pacific