Heathrow Express

In a tight two-week timeframe, DMI successfully undertook a crucial tender for the Heathrow Express website, focusing on crafting a high-level concept and potential future implementation for a new app. The challenge demanded a swift yet comprehensive approach to envisioning a redesign for the existing web platform.
As a Senior UI Designer at DMI, I played a pivotal role in shaping the visual elements of the Heathrow Express project. Collaborating closely with the Lead UX designer, I delved into the intricacies of low-fidelity wireframes and interactions. My responsibility extended beyond the traditional UI scope, as I actively contributed to the seamless integration of design and user experience, ensuring a cohesive and engaging outcome.
The success of the Heathrow Express project was a testament to the collaborative efforts of a dynamic team. Working in tandem with the Lead UX designer based in London and under the guidance of the Design Director, we formed a cohesive unit. The geographical separation posed no hindrance to our synergy, as we navigated the complexities of the project with a shared vision and effective communication.

My Achievements

Winning the tender for the Heathrow Express project stands out as a significant achievement. Through meticulous preparation of high-fidelity wireframes and an interactive prototype, I contributed to the success of the pitch. The upcoming redesign of the existing website reflects not only the team's dedication but also a testament to our ability to deliver compelling design solutions in a competitive timeframe.

Notably, Heathrow Express concurrently revamped its brand, adopting a sleek and modern appearance, along with introducing motion videos on in-train screens. I conducted extensive research and adapted this new aesthetic to the digital design, aiming for a lighter, knitter, and more laconic presentation. The positive feedback received on this UI concept reinforces its successful integration into the broader Heathrow Express brand evolution.

Revamped Homepage

Homepage (tap to play/pause video)

In the comprehensive redesign of the Heathrow Express website, we prioritized enhancing user experience and accessibility through strategic changes to key features. The Home page was transformed with a simplified header, reducing main menu items and replacing the timetable for a more streamlined interface. The Hero Search, now boasting a fresh look and heightened interactivity, promises a user-friendly journey-planning experience. Introducing a Benefits section provides users with a clear understanding of the advantages offered. The inclusion of a Live Train Schedule addresses an information gap in the current version, ensuring real-time updates are easily accessible. A prominent section banner strategically promotes the Heathrow Express app, featuring links to app stores for heightened visibility and ease of download. The news section, presented in a dynamic carousel format, ensures users stay informed with the latest updates. Completing the redesign, the footer is revamped for improved navigation and aesthetic cohesion. These thoughtful adjustments collectively aim to elevate the overall user journey on the Heathrow Express platform.

Homepage Desktop & Mobile versions

Ticket Purchase Pages

Ticket Selection Screens

The ticket selection page contains three intuitive steps. The screen begins with a header that highlights chosen directions and dates, and users navigate through a section presenting outbound and return journeys. Each journey has a card with four clickable items each that represent ticket options, intelligently organized as an accordion for easy access to additional choices. The fixed footer ensures constant visibility, providing an instant calculation of selected journey options and the total price. This design grants users comprehensive information on their selected journeys and costs, with the added convenience of on-the-spot editing for each chosen ticket.

Ticket Upgrade Options

Embark on a seamless journey enhancement with our Upgrades for Tickets page. The user-friendly interface features a stepper, clearly indicating the number of steps in the process and the progress made. Elevate your travel experience by reserving a seat with extra legroom and enhanced surroundings. Additionally, optimize your journey with increased luggage capacity for both outbound and return tickets. This page empowers users to customize their travel for utmost comfort and convenience with just a few simple steps. Notably, the fixed footer displaying the instant calculation of the total price remains visible throughout, allowing customers to witness firsthand how each upgrade choice influences the overall cost.

Purchase & Payment Confirmation Pages

Experience a seamless and secure purchase process on our Payment Confirmation Page. Maintaining the intuitive stepper, this page allows you to finalize your transaction with flexibility. Choose your preferred payment method—from debit and credit cards to setting up a new payment or opting for PayPal. The page provides a comprehensive journey summary, ensuring transparency. To enhance user autonomy, options to cancel the current journey or add another one are readily available. Upon confirmation, receive a unique booking reference number and a rewarding bonus credited to your account for future bookings. Notably, an app banner underscores the value of the Heathrow Express app, a valuable addition to your travel toolkit. This holistic approach ensures a smooth transaction while offering convenience and incentives for future travels.

Streamlined Journey

Buy a Ticket Flow (tap to play/pause)

In our pursuit of a more user-friendly ticketing experience, the Streamlined Journey ensures simplicity and efficiency. We've reimagined the process of choosing and purchasing tickets, integrating an enticing offer to upgrade selections with instant price calculation. The login/signup flow is now seamlessly streamlined a mandatory step in the payment process. The Payment summary has been thoughtfully revised, employing distinct text styles for enhanced information hierarchy. Diverse payment methods are now at your disposal. Upon confirmation, the payment page provides comprehensive details, accompanied by a tempting offer for the next travel booking and a gentle reminder to download our app. This refined journey prioritizes clarity, conciseness, and user satisfaction.