Enhancing an Internal Tool Interface for Customer Service Efficiency Through User-Centered Design
In the fast-paced Customer Service sector, optimizing internal tools to enhance consultant efficiency is essential.
This project focused on improving an internal tool used by customer service consultants for managing customer queries and data.
Through a user-centered design approach, I conducted in-depth research, including surveys and group sessions, to gather insights and define requirements. By analyzing pain points and testing prototypes, the project successfully streamlined workflows and improved the tool's usability, resulting in a more efficient and effective solution for consultants.
Team: UX/UI designer, 1 project manager.
Timeline: 3 weeks.
Client
xneelo
Year
2022
Methods
UI/UX Design, Usability Testing
Role
Situation
In my role as a UX Designer and Researcher for the Efficiency Team at xneelo, I was tasked with improving an internal tool used by customer service consultants to manage customer queries and data.
This initiative supported the Strategic Business Objective (SBO) to optimize 20% of internal processes and workflows within the customer service domain. The tool allowed consultants across various departments, such as Billing, Hosting, and Technical Support, to search customer details, view product information, and log inquiries or complaints.
The existing interface and workflows presented significant usability challenges, including inefficiencies in completing tasks, unclear functionalities, and poor layout organization. These issues directly impacted consultants’ ability to work effectively and deliver quality service.
The project’s goal was to redesign the tool using a user-centered design approach to enhance consultant efficiency and streamline workflows. This involved actively engaging end-users (customer service consultants) and stakeholders in the design process to ensure the solution addressed their specific needs.
Image: Interface before iteration.
Task
As the UX Designer, my responsibility was to:
Conduct user research, including surveys and usability testing sessions, to identify pain points and improvement opportunities.
Design wireframes, prototypes, and mockups that incorporated feedback from consultants and stakeholders.
Test and validate design solutions with consultants from various departments to ensure the redesigned tool addressed their specific needs.
The overarching task was to improve the tool’s usability by refining the interface and workflows to create a more efficient, intuitive experience for consultants.
Action
To address the challenges, I adopted a design thinking process to guide the project through its key stages:
Empathize
Conducted user research through surveys and interviews to understand pain points, particularly around the ticket logging form, product lookup table, and autofill functionality.
Define
Synthesized research findings to clearly identify core issues: inefficiencies in form layout, unclear functionality of icons, and challenges with table visibility and navigation.
Collaborated with stakeholders to align on objectives and ensure the problem space was well understood.
Ideate
Brainstormed potential solutions with the team to address usability issues while balancing business goals and technical feasibility.
Generated multiple ideas for improving form layout, button labeling, and table visibility. (Image)
Prototype
Designed low- and high-fidelity wireframes and interactive prototypes using Figma.
Focused on redesigning the product lookup table, optimizing form layouts, and enhancing button functionality.
Test
Conducted iterative usability testing with consultants to evaluate the prototypes.
Collected feedback on the redesigned interface, including form layout improvements, clearer button labeling, and dynamic table interactions.
Moderated usability tests with 10 participants (5 experienced and 5 novice users) across departments like Billing, Hosting, and Technical Support to gain deeper insights into user behaviors and challenges.
Implement Improvements
Redesigned the product lookup table to dynamically display customer-specific products and improve its visibility.
Replaced ambiguous icons with a labeled “Autofill Ticket” button for clarity.
Optimized form layout by grouping customer details together and making the submit button sticky for easier access.
Introduced a hide/show option for the ticket logging form, enabling consultants to personalize their workspace.
This structured approach ensured a user-centered solution that enhanced consultant efficiency while addressing usability challenges
Image: Design thinking approach, jira tickets and tools used for research.
Image: Image of usability testing.
Results
General Consensus
Participants were mostly happy with how the Internal support tool improves their efficiency.
High-level findings:
Product lookup table
When the product lookup table isn’t active participants questioned the space below the user lookup table.
When participants saw the product lookup table there was positive feedback about its usefulness.
Quotes
“I can immediately see all of the services on the account without needing to actually go into another software tool.”
Recommendations
Expand the height of the user lookup table.
Rethink how to activate the product lookup table.
Explore how to bring the attention of the table to the user.
High-level findings:
Autofill icon
Very few participants knew how to populate the ticket in the current design.
A Small number of participants were confused and thought that they had done it before but couldn’t remember how to do it.
For the participants who knew instinctively where the autofill function was, they found the tooltip helpful.
Quotes
“What does ‘Actions’ do? (heading of column) Is that supposed to copy the info? I see a little page with a pen on it. I would assume that is a copy function.”
“Wouldn’t know what that was for. Can’t make out what it is. Looks like a pencil writing lines.”
Recommendation
Potentially replacing the ticket icon with a button with the words ‘Autofill’ or ‘Autofill ticket’.
High-level findings:
Hide/show form
There was mixed feedback regarding the hide / show form functionality.
From observing participants I found that overall it wasn’t an overly important part of what they use the screen for. Some of those that found the feature reacted positively but others questioned its usefulness. From what I observed I would say it’s a nice-to-have option for some consultants.
Quotes
“In some instances, it would be more beneficial to have. Like, for example, the product lookup displaying instead of ticket. So for example, Our hosting accounts departments, that would really assist them, seeing the different setup of the services on the account. Whereas, in billing, it's not necessarily always something that we would use.”
“Hide button, hides the ticket field. Wasn’t sure of its purpose. Better if the ticket function was there and ready to use if you needed it.”
Recommendations
If the functionality were to be added the button should say “Hide ticket” and have an arrow indicating the action.
It should also always be open by default.
