Creating a whole new customer-facing experience for billing and payments.
Working with the business to create a new approach for users to self serve.
Giving users the ability to solve issues without needing to contact call centres.
Senior UX/UI Designer (contractor)
A fresh approach to the customer experience led to the need for a large amount of research
needed into the competition. Although I first looked at rival telco companies, I noticed
they all seemed to have the same type of issues. None looking at the future-facing
innovative areas with untapped potential.
I started to explore much more innovative challenger prepositions in areas such as banking, e-commerce and fashion.
I also spent some time looking at how some companies also freshly approached customer service. One example of this was purchasing a car, some companies created a completely fresh approach to a customer need rather than just the most expensive upgrade.
Alongside the competitor research, I also took the time to craft a sitemap for the future
alongside the product owners roadmap.
By including the areas we had spoken about, but hadn’t designed yet, we had a navigation sitemap ready which could scale as work is released to the public
The current bill experience for users was severely lacking in both ease of use and important
features. In our user research sessions, we always added an open-ended question where
participants could add/remove features to their desire.
This gave us evidence to design and empower the end-user with their own billing information.
Working alongside a product owner, we came up with a clear easy to navigate online billing section which worked across mobile, tablet and website based screen layouts.
The bill overview was the main landing section of the billing area, and as such, it was
first section I wanted to tackle. I wanted to utilise the working patterns of the
released sections of the experience. The last thing a user wants to do is to have to
the patterns of a website midway through.
I introduced an easier way for the end-user to navigate throughout the months of their contract, as well as giving them the ability to compare the cost of this month to previous ones. The only way to do this on the existing website was to download each bill individually, so we made this an easy to see design element, which could then be expanded upon in the future, by incorporating additional spending
The work had huge success within this project, showing that 9/10 users could solve the problem using the information we presented to them. The data for this result came from a containment rate of 89.5% of users clicking that they needed no additional help in the on-screen dialogue presented to them after their journey.
With a big change in the way the billing area looked and functioned, I pitched the idea
walkthrough guide for both new customers and people who were being brought through into
new version of billing. I was inspired by the onboarding style of phone applications,
allow a user to learn about new sections of the UI as and when they needed them. We had
difficulties with being able to explain certain features as the user may not have
with their bill in a particular r way, and I didn’t want a new area to pop up in the
without an explanation, whilst also not wanted to force a new onboarding the next time a
customer opened the web page.
In the end, I decided on using real billing data but showing all the possible fields a user may face. This allowed them to see every area they might interact with in the future, which could also be hidden when they finished the onboarding session. I took the prototype through a few iterations of user testing, focusing on what a customer would expect to be sho0wn, as well as incorporating as much data tracking from the existing website. This in turn ensured that the most clicked items were shown to a user so they knew where to find them in future.
I wanted to ensure that users were aware of changes to their bills, as well as
them when they had actioned something on the website concerning approach billing. I
to use the notification pattern that was in use in other areas of the project.
By introducing a level system of notifications. We could create easy to dismiss notifications when no user action is required up to emergency customer interaction is needed events. Long term these could also be used to make users aware of future billing events.
An example is a higher than expected bill due to On Demand content being purchased previously.
By solving the problem of unexpectedly high costs we make the user feel more in control of their billing.
Existing data showed that the number of users navigating to the billing area from outside the virgin media website was skewed dramatically towards not being logged in. We wanted to ensure that the high number of users in a logged-out state could still try to solve their problem, before being pushed to log in. With that in mind, I reimagined the journeys for anonymous users. These designs were just about to be launched as I joined the project so I made them a focus in the first few weeks.
I reduced the number of clicks a user would need to act before coming to their selected page by improving the flows to a more logical paginated state, at the same time reducing some of the videos and additional media which was slowing the web page down and which data showed was not been interacted with in any way.
As part of the validation for results in this project was the use of surveys for live customers. In the format of YES/NO buttons with areas to give feedback, I took the data and used it alongside current user testing feedback to see if they aligned. The billing area I was responsible for had the biggest increase in the whole project; a positive increase of 21% for answering their problem.
There was a clear plan from the company perspective. Virgin Media wanted to empower
solve any issue's themselves.
With that in mind, we wanted to make journeys as easy as possible to understand. We never wanted users to struggle to find the information they needed.
They also always wanted to be proactive in communication with the end-user.
The usage stats of the project showed that existing customers were only logging into the
site less than 20% of the time. Feedback from users showed that there was a variety of
problems with the login journey, but due to security reasons, this couldn't be fixed in a
reasonable time. The main issues that users had included forgetting a username/password with
9/10 just exiting rather than trying to reset the password.
With this in mind, I was tasked to create an alternative way for the user to log in. After
numerous ideation sessions with the wider agile team, I settled on the use of a One-time
This allowed a user to receive a code via SMS or email and they could use that code to log into their account. This was also restricted to being on their local WiFi network associated with the account to protect private information.
The first iteration of this feature was only used to allow someone to pay their bills as a proof of concept on both the design and technical side and was met by unanimous approval in customer feedback sessions
For a subset of users, paying their bill is not financially achievable. These more vulnerable customers were given the ability to make a partial payment, allowing them to pay a percentage of their bill with the rest of the bill being added onto a future payment.
I explored different variations of micro interactions to enhance the feature. By leading the eye with animation it ensures that the user is able
As the user feedback is under an NDA, I can only share some stats and results from our user
Across the features I worked on, we saw a 200% increase in satisfaction vs other areas of the new project.
We also saw 93.4% of people in our testing sessions responding positively to my 'Quick Pay' feature with most participants commenting on its ease of use and clear messaging as well as 90% of people feeling that they could solve their issue without needing to phone a call centre, which was the main goal of the project.