Chat agent UI console
Project overview
Online chat has become a common method for communication between brands and online customers. Online chat representatives are often located in call centers and are in charge of answering chat requests from website visitors looking for shopping assistance or customer support.
For this project I have created a web application interface for the online chat representatives.
Define the problem
Being a chat agent is not easy, this communication channel is becoming the default method chosen by website visitors that expect an immediate reply, and when it comes to big online retailers website the incoming chat request rate might be 3-4 chats per minute per agent when traffic is high. The agents are expected to conduct multiple chats at the same time and provide support, information and assist in the purchasing process including billing and shipping details.
Online businesses also measure the agent efficiency not only by customer satisfaction but also their ability to upsell and reach the full purchase potential for every customer.
The goal
Create a web application interface for the online chat representatives that will increase agents efficiency and also accommodate business goals.
Business goals
High level of customer satisfaction
Decrease shopping cart abandonment rate
Maximizing shoppers purchase potential
Agent efficiency
Navigate easily between ongoing chats
Quick reply to user requests
Deliver accurate and relevant canned response
Research method & Insights
This project relies on the research and knowledge I’ve gained over the years as part of the product design team at Liveperson, a leading chat service provider for online business.
As a part of the product design team I had access to usage statistics and quantitative data regarding current products, I also visited call centers and observed chat agents while they were using Liveperson products in real time.
Here the main takeaways from the observation sessions
Agents rely heavily on canned responses, using it very often.
Agents had a set of canned response they were using over and over and sticking to ones they are familiar with and feel comfortable with
Agents that are familiar with hot keys are much more efficient and can use both hands to type and don't have to reach out to the mouse to navigate
Agents have many tabs open in their browser, and other tools are being used along the chat platform (e-commerce platform, CRM)
Chat agents are working in shifts, some are more experienced than others, there are always changes and agents come and go on a regular basis so there are always newcomers.
Chat agents vary by age and are not always tech savvy.
How my design helps meet the business and efficiency goals
Layout and interface
The layout of the screen puts the current chat in the center
Color coding of website visitors helps the agent create a mental connection with a certain visitor and helps while interacting with multiple visitors at the same time. When you move to another visitor the main color changes (a subtle change) and reminds the agent where to pick up from.
Visitor response indicator shows the number of messages typed by the visitor that hadn’t been answered yet
Visitor shopping cart details and products
Agents can see the customers shopping cart items within the chat console and do not have to navigate to a separate tab in order to see and current shopping cart items
This way chat agents can be proactive, understand user purchase decisions and help with specific products
They also have the ability to add/remove products from the cart and provide specific details that will assist with the customer purchasing and offer specific items
Canned answers section in the main console
Canned responses are always available to agents that use them often
The frequently used section is shown by default and those commonly used responses are easily available.
Agents can also browse the database by category, add favorites and use a quick search for specific keyword
Hot keys throughout the interface
The most powerful navigation tools are the hotkeys, saving valuable time for the agents and letting them be available to multiple customers at the same time. The most useful hotkeys are presented on the screen at strategic locations and remind agents to use them.
Customers list
Agents can always see a list of the current customers they are interacting with, they can see the latest response and see how much time each visitor is waiting for a response, allowing them to interact with the most significant chat.
