A quick and easy service to pay driving charges in London
Role
UX Lead, Road User Charging
Responsibilities
Workshop facilitation, Wireframing, Service Design, Developer hand-off, UX Writing, Stakeholder engagement, Accessible design
Overview
A new ‘Ultra Low Emission Zone’ (ULEZ) for Central London was going live in April 2019. People with more polluting vehicles would have to pay to drive in the city centre, with the aim of improving the overall air quality. Other driving charges could be paid via an existing service. I was responsible for improving this service to better meet users needs and support payments for the new charge.
Alongside making payments, the service enabled users to check vehicles, register and manage Auto Pay, apply for a discount or exemption, settle or contest a fine, or manage payments for a large fleet. In total we identified around 70 scenarios the redesign needed to account for.
Service audit & discovery
The existing service was heavy with jargon and difficult to understand. Tasks required too many steps to complete, and relied on users having lots of prior knowledge about the charges.
Users became easily confused about whether they had to pay, or the amount they owed. Often they would then call to seek clarity and get support. The service did not easily correct for errors. Some users would accidentally pay for the wrong vehicle because they’d entered the wrong licence plate information.
Over 80% of payments were for journeys made on the same day or one day either side.
The service had to factor in lots of different scenarios in order to present the correct information to the user.
Core user needs
As an individual driving in London,
I need to pay all charges applicable to me, given the vehicle I'm driving, where I'm going and the time of my journey,
So that I am not fined
As a Fleet Manager,
I need to pay all charges applicable to the fleet, given the vehicles in the fleet, where they’re going and the time of their journeys,
So that the organisation I work for is not fined
Design approach
Through a series of in-depth workshops with key stakeholders from across TfL, I designed a set of initial sketches and wireframes for each journey.
An important principle for the new design was that it was centred around jobs to be done, rather than the individual charges. Several disjointed pages and flows were brought together in one place, organised in a way that made sense to users. Draft UX and logic maps led technical requirements for new APIs and back-end services.
Early sketches and wireframes became an important artefact when working with stakeholders.
Logic maps describe how the screens in the different journeys are connected, and document the conditional logic between steps
From this initial wireframe set, technical details could be refined and I could establish a visual approach. Existing components were reused and improved where possible.
Design patterns were established to create consistency and familiarity. The date picker pattern was particularly complex. At this point, it’s critical that the user is confident in the information they’re shown and that they’re paying for the right thing.
Every journey in the service has a start page, letting users know what they can use the journey for. This pattern was inspired by the gov.uk design kit.
The content was designed to be concise, easy to read and written in a user-centric way. Felice Hawley led the content design for this work.
Outcome
After the launch of the new service, journey completion increased and the number of support-related calls reduced significantly, despite the new charge bringing far more users to the service. The new service delivered a quicker, clearer, less frustrating experience for users.