Home24 Checkout Redesign Project

UI/UX
Project Overview
Home24 is Europe's largest online destination for home furniture and decor. I worked as part of home24 UX team in order to improve the checkout pages overall experience.
And provide the customers with an easy and user-friendly experience cross-device, to complete the purchase process.
‍
Tools: Paper prototype , Balsamiq , Sketch App , Invisionapp , Lookback (user research tool)
We believe that there is no one source of truth, Therefore we started our research by collecting data from different sources in order to define the problems and our customers are facing and define the pain points.

‍The data sources have included:
• Google Analytics helped in defining: Customer Journey , Where are users blocked , Conversion funnel, Screen resolutions.
• Customer Service is a direct link to our users: CS reports , Interview CS agents.
• Mouseflow helped in reviewing: Heat maps , User Session Recordings.
Collecting data & Define problems
Benchmarking is an excellent way to get inspiration and insight into what works and doesn’t work to make sound design decisions. We've reviewed different types of checkouts (multiple/one-page check-out..etc).

The process included:
• Take screenshots on all devices, etc.
• Document the features.
• What solutions might solve our problems (not just entire features, also wording, …)
• Look at themes like “Security”, “Trust” and ”Transparency”
• Looking at current and new things in the market.
Benchmarks & Trend analysis
The last part of the research phase was reading theBaymard Institute reports(E-commerce checkout, Mobile e-commerce report) which contain 400 site reviews and 20.678 ‘best practice’ examples.In addition to having several meeting with the legal department to get more insight regarding what content should be displayed and where in the checkout pages from legal point of view.
Research reports & Legal issues
The first step after collecting data from different sources was filtering and grouping these data and then break it into small digestible pieces. and based on that, we started with a series of brainstorming sessions which helped in creating hypotheses and solutions the might help in solving our customer's problems.
Brainstorming & First wireframes

In order to test the efficiency of the proposed solutions, it was necessary to translate them visually, Therefore we created the first paper prototype to test them quick and fast.

slowly but surely we started in creating high fidelity wireframe and prototype (InvisionApp) in addition to interactive prototype for a proper usability testing. The usability testing of the checkout required creating Different user scenario’s and prepares task we ask the users to perform when inviting them to the usability lab.
First prototype & Usability testing

During the usability sessions, we asked the customers to perform and specific tasks in order to measure and validate the progress in the proposed design, in addition to recording the usability session to review it later on.

After several sessions of design iteration and testing.The decision has been made to move from high-fidelity prototype to a pixel perfect design cross-devices.
Pixel Perfect Design
Powered by Webflow
LinkedinTwitter