TFL Image
Transport for London
Improving air quality in London with a hassle-free, pay-to-drive app.
TFL Hero Image
Project overview
A Pay-to-drive app that makes it easier for commuters to pay daily charges to drive within the low emission and ultra-low emission zones in London.
Using the Android/iOS app, commuters can pay driving charges applicable to their vehicles (and commute) in advance or on the go. They can set up Autopay, avail discounts and avoid penalties. Hundreds of thousands of commuters use the app daily to pay congestion charges, Ultra Low Emission Zone (ULEZ) charges, Low Emission Zone (LEZ) charges, and penalties.
ui-ux design
cross platform dev.
TFL project overview image
Project roadmap
  • 2018
    • AUG 2018
    • Discovery and strategy
    • Documentation
    • Client discussion
    • Product vision
  • 2018
    • SEP 2018
    • Information architecture, Wireframing and prototyping
    • Concept generation
    • UI prototype
    • Usability testing
  • 2018
    • NOV 2018
    • Code architecture and final UI design
    • Mock & API setup
    • Application architecture
    • Visual design & animation
  • 2019
    • APR 2019
    • Development and support
    • App development
    • Manual & automated testing
    • Maintenance & support
Discovery involved discussions with TfL to appify all the aspects of driving-related charges in a user-friendly manner.
User Interface designs
We coordinated with the TfL team indulging in several meetings and focus groups, creating an interface that revolved around their design system and brand identity.
Few of the screens
Create an account
Create and activate your account for TFL.
User Interface Section Image
TFL Image

From design to implementation

A user-friendly interface with TfL branding gives a clean and easy experience to the commuters.
Design Implementation Phone

Informative navigation bar and progress notation

Users can see the payment information and progress shown dynamically at the top.

Clean and flat user interface

Our designers went ahead with a flat design theme that accommodates multiple functionalities with minimalism.

Bottom central action button

The app features a central button for the main action, creating an easier mapping.
Core technology and features
The app brings together technologies and data in a high-quality experience.
Rest API and OAuth
App Centre
App Center Analytics & Crashes
GPS location tracking
Credit Card
Credit card payment
Google Maps
Auto Complete
Place autocomplete service
Azure Maps Search Service
Debit Card
Direct Debit payment
Highly technical brief
Our designers and developers came up with an efficient and cohesive app that met all the requirements.
TFL Lines
Multiple payment options
Users are able to make payments from their cards via auto-debit and Direct Debit.
App scalability
The app is capable of incorporating multiple flows and quick additions due to its cross-platform codebase.
Custom visual and brand design
We developed a custom visual and brand design that gels with the brand identity of TfL.
Continuous user feedback with changes
We improved the experience and functionalities based on users’ feedback acquired through various channels.
TFL preview image
The team is professional and proactive, hitting all of our established milestones.
Thumbmunkeys works closely with the end client to ensure project success. They offer a competitive price for high-quality work and require minimal oversight. Unlike other agencies, they're both skilled and accommodating, adjusting to any last-minute changes.
Raj Arora
Senior Project Manager
TFL Review clutch image
TFL Review clutch image
Pay your charges anywhere, anytime.
The Transport for London Android and iOS app is helping to reduce road traffic emissions in London’s Ultra Low Emission Zone (ULEZ) and Low Emission Zone (LEZ) by enforcing tighter standards, thereby improving the air quality. The app also enables a hassle-free driving experience for daily commuters.
TFL Results image