At EKM one of my key responsibilities was improving the usability and conversion rate of the checkout system. This checkout system is used by roughly eight-thousand online shops and handles millions of customers per day.
In 2015 my team and I overhauled the checkout system to make it much quicker and improve the usability. This complete rewrite also gave us a much solid foundation to build on in the future as we continue to improve it.
Identifying areas for improvement
In 2018 we identified an area we could improve on in the optimal checkout for new customers.
We found that online shops using the post code lookup feature improved the time to checkout but the checkout wasn’t doing a good enough job of utilising the improved time.
Post code lookup was allowing UK customer to search for their address using their post code and then select an address from a list which pre-filled the address fields. This meant customers didn’t need to fill out each field for their address and removed a risk of human error.
What we observed though, much like we did with returning customers, is that even when the selected address pre-filled the fields, customer would still validate the values in each field.
Original checkout flow
The existing checkout flow consisted of 9 default fields (customers could add fax if they needed).
- Full Name
- Company Name
- Address Line 1
- Address Line 2
- Town/City
- County
- Postcode
- Country
- Telephone Number
When the post code lookup feature was enabled the checkout flow also has 9 default fields, but in a slightly different order.
- Full Name
- Country
- Postcode
- Company Name
- Address Line 1
- Address Line 2
- Town/City
- County
- Telephone Number
Note: Because the post code lookup feature only works with UK addresses we ask for the country first, then for the post code which is an anti-pattern when it comes to address fields.
The problem here is that we have two versions of the same step with exactly the same number of fields, albeit in a slightly more confusing order.
Requirements of a solution
- Reduce the number fields in the checkout for shops using post code lookup
- Leave the checkout unchanged for shops or countries without post code lookup
- Encourage the use of post code lookup
- Still give customers the option to enter their address manually (for use with auto-fill)
- Still allow the customer to enter their name and telephone number manually
- Gracefully fall back to manual address input if post code lookup service is unavailable for any reason.
- Provide customer with the option to edit the address when post code lookup is used
Prototyping a solution
We brainstormed many different solutions and landed on one contender we wanted to test.
If post code lookup is enabled on the site we would hide the manual input fields unless the customer wanted to enter their address manually.
I used Marvel to create a simple interactive prototype to validate the idea and ensure we’d covered all bases.
The key benefit of this idea was that we could reduce the number of fields down from 9 to 4 and rely on the power and accuracy of post code lookup results as a default.
- Full Name
- Country
- Postcode
- Telephone Number
Implementing the solution
With the prototype successfully meeting the requirements of the solution I then proceeded to implementing the solution into the checkout.
I implemented the solution using HTML, CSS and Javascript because there was no need to get a backend developer involved.
After the solution was implemented into the checkout system we began some internal user testing to iron out any bugs and ensure that it met the requirements without introducing any issues as a side affect.
Following that it went to the technical testers for a final run through before being launched onto thousands of online shops.
Ideally we would test both the implemented solution and existing checkout using an A/B test. Due to technical limitations with the checkout this sadly wasn’t an option.
Observing users and seeing results
We found that following the release of our solution the time-to-checkout (time from starting the checkout flow to completing it) was reduced significantly which had a direct impact on the number of conversions for those sites.
Through observation we found that customers were spending less time painstakingly validating their details in each field before continue through the flow.
For obvious reasons we only saw a change in behavior for customers ordering from the UK and only on shops that have the premium post code lookup feature installed on their shop.
Iterative checkout enhancements
The checkout system on an ecommerce platform like EKM is an ongoing job that warrants multiple full time roles. When we did spend time enhancing the checkout we helped shop owners increase their revenue and gain more customers.
Although the “checkout system enhancement project” overall is one big ongoing project we found a lot of value in targeting individual pain points and seeing them through to release instead of trying to tackle everything in one release.
When we took this iterative approach we were able to use what we learned from one solution and apply it to the next, whether it be positive influences or negative ones. We could also release solutions to problems affecting millions of potential customers much quicker and therefore have a much bigger impact on ecommerce sites using the EKM platform.
