Introduction
In October 2023 I was offered a secondment as a Senior Product Designer to improve the new contact centre platform Citizen's Advice had transferred to. Although Amazon Connect is a multi channel cloud contact centre, the first iteration of the platform was focused on phones only, with the idea to potentially expand to other channels in the future. Working with an external team of developers the platform was launched using a basic interface branding with the organisations colours but not following the existing design system.
Before joining the team, the user researcher had already started mapping the pain points adviser's had raised and the key journeys users took to complete daily tasks.
Key Requirements
Accessible
The product needed to work for everyone, especially those using assistive technologies. We were required to meet WCAG 2.1 AA standards.
User Led
We needed to prioritise the changes that would make the biggest difference to adviser's, even if they seemed small.
Responsive
Due to the original development of the product, it would need to adapt to work at fixed zoom levels of 100%, 200% and 400%.
Cost effective
We had a specific budget for this project, so we needed to focus on the large pain points and quick wins to ensure the changes would have the most positive impact.
Exploration
One of the challenges of this project was working with an external agency of developers because it was not clear what the technical limitations would be or how the platform had been built. In order to explore this further I put forward three suggestions of changes ranging from full overhaul with additional functionality to very basic tweaks and changes. I needed to know what changes were in budget, and if some weren't possible, why?
Even though this method of exploration required more upfront work, it was the best way to initiate conversation around how the product had been built, how the team scored tickets and the boundaries I needed to work in for future designs. In hindsight it was an effective method and helped the external developers understand how I would be approaching the project.
Exploration
Accessible for everone
A key pain point for many advisers was the size of many of the components including buttons and input fields. Even though some of the buttons were technically compliant with WCAG 2.1 guidelines, the placement of them meant the user had to scroll or move the mouse in an awkward way to reach them. This was an issue for many advisers, but particularly those using the platform at an increased zoom level where buttons were often only accessible via a scroll.
One of my first prioritise was to redesign some of the most common components; buttons and input boxes. I improved these by:
-
Increasing the size to meet WCAG 2.1 to a AAA standard
-
Created consistent primary, secondary and tertiary buttons with states that were both accessible and inline with the Citizens Advice brand guidelines.
-
Replacing icon buttons with clear text labels
-
Added aria labels to buttons which required more context
-
Rearranged placement of buttons to ensure the relationships between other components was clear.
Testing
Before developing any of the designs, I created high fidelity prototypes of the key user journeys. We recruited several advisers with varying levels of confidence using the platform, length of time at the organisation and those who did and didn't use assistive technology. I sat in on the testing to see how users interacted with the new designs, how easily they managed to complete tasks and how they felt it compared to the current design.
We asked the users to complete a system usability score and scored it against the baseline we had for the existing platform. After analysing the feedback and iterating the designs to create a second version, we test the designs again. The system usability score increased dramatically with the new designs from 65 to 80, and even more so with the third version jumping to 94.
Results
The response to the new designs has been overall very positive. Users really liked the simple changes but also liked the additional features that had been made easier to find such as call history. An unexpected positive consequence of the changes was users realising they could interact with the platform in a different way, for example they could transfer calls or zoom to see a one page version instead of a split screen.
Before ending the project I created a simple design system with all of the components, colours and foundations to ensure that future changes would match the existing designs.
