A distraction free checkout
Our Lead UI Designer, John gives an insight into the work that has gone into our upcoming checkout and how it creates an optimised, streamlined customer experience.
Our biggest concern when designing the new checkout flow was how you guys, our customers, would react to no longer having a checkout flow that appears within the shop theme. This article will explain the reasons behind this choice and what else we’ve done.
Below is a mockup of how a typical checkout currently looks on ekmPowershop (left) and how our brand new distraction-free checkout will look (right).
The issue with our current checkout, and also the checkouts used by a lot of ecommerce sites (big and small), is that when you place your entire checkout flow within the design of your shop front you create distractions.
By distractions I mean irrelevant content; content that doesn’t help your customers complete checkout. In the example mockup above you’ll notice content on the left such as promotional areas, category navigation, web page navigation and social network navigation. This is all bad because it distracts your customer from their primary goal, completing the checkout process.
Looking at those same mockups, I’ve added red circles next to internal links and blue circles next to external links. Both are very bad for checkout conversions. Leaving links in your checkout that allow customers to navigate away will lead people out of your checkout and they may never return.
A customer wanting to add further products to their basket isn’t a bad thing but it’s better to have them complete their initial purchase before they start looking to buy other things. The first path ends with you taking an order, the second path ends with either you making a bigger order OR not making an order at all.
What we’ve changed
On the new optimal checkout we’ve removed all serious distractions from your checkout. It’s designed to get people to complete a purchase without you worrying about your content taking them down a different path.
Your new checkout is isolated within its own flow and the only navigation in the new checkout are buttons to take the customer closer to completing their order.
Without these distractions or counter-intuitive navigation links you should get less checkout abandonments and a higher end to end conversion rate.
Will this raise security alarms with the customer?
A question we asked ourselves throughout the research, planning, design and development stages of this project. The concern comes from customers visiting what looks like a different flow to the one they were previously in.
The short answer is no. The slightly longer answer is no but you may need to do a little bit of work to really cement in the notion of security.
All of our standard themes will have a seamless transition to the new checkout because we wanted to ensure minimal work needed to be done on your part when you move to the new checkout. However if you have a fancy custom design or have made changes to your theme’s colours you may need to spend a few minutes making your checkout resemble your front-end site.