Customer Service Dashboard & Live Chat Widget

Customer Service Dashboard & Live Chat Widget

Summary

Halo BCA is well known in Indonesia for its responsive and reliable customer service. It helps customers express complaints or inquiries related to BCA's banking services, which are promptly followed up by BCA’s Customer Service team. The creation of the BCA Chat Admin Dashboard brings these capabilities to the forefront, providing a centralized platform where various customer service roles can manage conversations, track issues, escalate complex cases, and collaborate effectively to deliver the best possible experience to BCA users.

Role

As a UI/UX designer working on the Halo BCA project, my primary task involves designing and enhancing the user experience for a chat platform embedded within the Halo BCA website, ensuring that it is user-friendly, visually appealing, and aligns with the project's objectives and brand identity. I work hand-in-hand with the Project Coordinator to collect requirements and suggest the most effective experiential strategies.

The Product Creation

The Live Chat Widget to Address Customers' Inquiries

The purpose of this project is to enhance customer satisfaction by providing quick responses and effective solutions, instantaneously through customer service, and delivering a positive experience even without direct interaction or verbal feedback from the customer. In line with this, the product designer ensures that all functionalities operate smoothly by providing input on features and user experience. This project is very important for Halo BCA to maintains relationships with customers.

There are two main products in this project:

  1. Live Chat Widget
    The Live Chat Widget is an embedded customer service tool on the Halo BCA website that allows customers to initiate real-time conversations with BCA support agents. It is accessible on both desktop and mobile platforms.

  2. Customer Service Dashboard

    The Customer Service Dashboard is a centralized interface used by BCA internal teams to manage, respond to, and track customer inquiries coming through the Live Chat Widget.


Each product serves a different user group and is designed to support their specific goals, customers use the Live Chat Widget to seek assistance, while internal teams use the Dashboard to deliver timely and effective support.


Live Chat Widget

The Flow

Customers can initiate a chat with Customer Service through the Halo BCA website, accessible on both desktop and mobile devices by selecting the Live Chat button.

Display on the smartphone screen with the step-by-step flow

The interface appears on a smartphone screen, guiding users through each step of the chat experience, and illustrates the digital user journey from each touch point.

  1. Provide Basic Information

Customers are required to provide basic information such as their name, email address, contact details, and type of complaint to help the agent understand and address their issue effectively.

  1. Waiting in the Queue

After submitting their request, customers will wait briefly before receiving the first response from an agent. To avoid uncertainty, the system should keep users informed about their chat status and the availability of the customer service agent assisting them. This information will be clearly displayed in the interface. This sets user expectations.

  1. Use the Chat Widget

Users can type their message and attach files or images in the chat widget. They can also minimize the chat widget if they want to continue exploring the main page. To ensure users stay informed when a response is received, the chat widget will provide notifications through sound and visual indicators.

  1. Rate the Experience

After the conversation ends, users can rate their chat experience using a simple feedback form with star ratings and a follow-up question to gather insights and improve support quality. The system will also send a chat transcript via email.

Customer Service Dashboard

Role Based Access

Customer Service Dashboard is designed using Role-Based Access Control, which implements role-based access control allowing each user to access only the functions and information that are appropriate to their role and responsibilities within the organization. The users can vary, ranging from customer service agents to top-level managers. Each represents different personas. Customizing the user interface to efficiently help user complete their tasks, can be a challenge, especially as their requirements may differ. I identify the important information and features for each persona, then categorize this information into relevant categories according to their roles and responsibilities. I ensure that the user interface is easy to navigate and information is presented clearly.


CS Agents have the capability to escalate complaints, questions, or feedback from customers that they are unable to address to their supervisors. There is ticket categorization for completed tickets, open tickets, high-priority tickets, and more.


Supervisors team leaders can assess the performance of CS Agents in terms of response time to questions or complaints, answer quality, politeness, and customer satisfaction. This includes conversation history and reporting systems.

Different Needs with different function

There are 3 main function of CS Dashboard that serve different needs.

Configuration

This function allows administrators to set policies, manage user roles, and configure system behaviors within the CS Dashboard. A clear and intuitive configuration interface reduces errors, empowers admins with control, and ensures system consistency.

Monitoring

This function enables supervisors or team leads to view real-time chat activity, agent availability, queue status, and escalation flows. Real-time visibility allows for proactive intervention, workload balancing, and maintaining service level standards.

Analytics

This function provides insights into historical performance through metrics such as response time, resolution rate, customer satisfaction scores, and agent productivity. Helps teams identify trends, optimize processes, and improve customer experience based on data.

Let's Get Connected

Feel free to contact me if having any questions. I'm available for new projects or just for chatting.

Copyright 2024 by

Melina Mayella Sujono