Optimising the homepage design to improve visitor experience and increase conversion

Project: Redesiging homepage, flight search and navigation at Heathrow.com

Client: Heathrow

Category: Travel & Leisure

Responsibilities: User experience design, Interaction design, Visual design, Workshop facilitation.

The challenge:

Piksel and Furthermore joined forces to work on an amazing project with the team at Heathrow.  Research had highlighted a number of elements on their homepage were not as optimised as they could have been. We were asked to improve conversion rates from their homepage through to their individual business units (i.e getting more people to arrange their travel to the airport, plan their visit etc), facilitate easy browsing of flight information and ensure users can easily find further information using the website navigation.

Our approach:

To ensure the brief  was in fact reflective of genuine user needs, we ran a number of workshops with the Heathrow and Piksel teams. One such workshop, we invited stakeholders from across the business to help us gain an holistic vision of their user's needs and business objectives. Personas created were based on extensive research carried out by the internal research team at Heathrow. We mapped out a customer journey for each persona type, we considered their goals, questions, concerns and pain points at each stage of the journey.

We brainstormed potential feature and content ideas with the team. Each idea was directly linked to address a user goal, concern or pain point. We then used the requirements gathered to collaboratively sketch out possible solutions, using a short 3-stage user journey sketch exercise. This allowed everyone to get all their ideas out of their head and onto paper.

Customer journey workshop together with the client

Customer journey workshop together with the client

We spent a few days at Heathrows offices where we gathered personnel from all stages in Heathrow to together do a customer journey framework where we define needs, discover pain points and come up with feature ideas.

Usability fixes
Sketching sessions - user journeys
Sketching sessions - User flows
Wireframes
Customer journey workshop together with the client
Usability fixes
Sketching sessions - user journeys
Sketching sessions - User flows
Wireframes

Back at the studio, we started our concept and design sprints. Here we sketched potential solutions in more detail. We took the favourite ideas from our workshops to create a series of paper prototypes. This became the focus of our early discussions as we determined the merits and emphasis of each feature. This allowed us to try different combinations of the homepage quickly without spending time mocking up. We went on to collect visual and functional inspiration through moodboards as part of a wider landscape review.

In the following sprint we mocked up the visual user interface design.

The results:

The previous Heathrow site was very cluttered and lacked hierarchy, so we opted for a new responsive website design that split into four clear sections, each with their own clear proposition. The first allows users to search for their flight information, the second is focused purely on the different ways you can get to the airport, the third presents the best of what you can do once at Heathrow and the final section showcases inspirational things you can do when you are away.

By incorporating large visuals, strong section headlines and consistent form elements we could highlight the airport's features without cluttering the interface.

The design is modular, scalable and will enable Heathrow to easily update and rearrange components depending on changing priorities and proposition from season to season.

Next Up:

More case studies:

Get in touch with the team to discuss your idea, project or business.

Large Furthermore logo in white