Chatbot
Design Background
Chatbot system first is manual maintain the wordings and settings by customer service. Customer service would need to tidy up the wording and provide the information to engineers for the update. It takes a lot of time to do and doesn't update quickly. Thus, to reduce the edit time, working with engineers to do the backend system for the requirement.
Manpower shortage
Update difficult
Without backend system
Role and Collaborations
As the project designer, I directly discussed with the stakeholder and backend engineers to explore the design style and how to work. I have an interview with the user that help me to figure out some of the user's pain points. And according to the user survey, enhance the user experience.
Team
UI / Web Designer - Windy Wu
Backend Engineer
Platform
Web
Tools / Skill
Figma, Photoshop, Illustrator, Html, CSS, Jquery
Design Goal
Reduce time
User can save their time by using the chatbot backend system.
User friendly
Create a user-friendly interface to maintain the system response of the chatbot.
Module
Because the system would be expanded to other social system in the future, making it module is important.
Outcome and Impact
Interview the users and they feedback the system save their working time.
Engineer feedback that with the module design can implement to many different country social media system maintenance.
The system is successfully used by all the APAC region customer service. And the feedback is positive.
User persona
We interviewed our users and observe how they work and perform their tasks. With the data from the interviews, I created a person representing an ideal user of an application. The persona helped me to arrive at a better solution.
![](images/chatbot_02-1.jpg)
![](images/chatbot_02-2.jpg)
User Journey Map
![](images/chatbot_02-3.jpg)
Sitemap
![](images/chatbot_02.jpg)
Information Architecture
![](images/chatbot_03-1.jpg)
Design System
![](images/chatbot_03.jpg)
Wireframe
![](images/chatbot_03-2.jpg)
Design
Main topic: Easily using when maintain the information
We are building a web-based version of the chatbot system, that provides for the customer service representative who needs to maintain and edit the chatbot response. The system is presented with a sharp modern UI to enhance user ability.
Challenge: The system suffers conflicting visual elements and different country platform select
We realized that provide the most effective and convenient system to users is the main topic. We used clear navigation, intuitive command structure to set up the system.
![](images/chatbot_04.jpg)
The design concept is to provide simple and easy to use dashboard for users. It use less color to let users notice alert information quickly. Improve the user experience of the old version and use tag let users easily to set the keywords.
![](images/chatbot_05.jpg)
We created a unified User Interface and organized the information architecture. And worked closely with engineers to plan the project roadmap and milestones. Our users provided positive feedback about the UI. The loved the clean, professional UI. It made them easier to set up the keywords.
![](images/chatbot_06.jpg)