Magento 2 Checkout - Upgrade Magento for Pure Conversion Genius

Upgrade Magento to version 2

Upgrade Magento for the improved checkout experience (and conversion) alone! We’ve been trying to get the word out about Magento 2’s checkout experience since we launched our first project last year. We hope that Magento 1 holdouts will start listening!

What is the all the commotion about?

Razoyo has always been a bit of a skeptic about one-page checkout. We had seen several studies about one-page checkout in the Magento 1 days that clearly showed a decrease when switching from the 6-step accordion process to a one-page process. It seems counter-intuitive, but, the results we saw were clear.

I personally believe the one-page checkout processes had positive and negative user experience (UX) implications, but, the negatives, for most clients, slightly outweighed the positive.

On the positive side, you did not have to log in before checking out. However, because the one-page was not a process change, but, just window-dressing, you still had to make a decision about checking out as a guest or logged-in customer before proceeding. Numerous fields were exposed like zip code or credit card, all of which looked like they should be editable, but, a change in shipping or billing address could lead to a recalculation of taxes or shipping. With everything on one page at one time, it could still lead to a surprise on the order confirmation page if you weren’t paying attention, but, your attention on checkout was not focused by the single-page experience.

Too many Ajax calls

The one-page checkout lead to a lot of ‘spinners’ (those little gifs that inform you the system is busy) while the Ajax was communicating with Magento before updating the whole page. So, while you didn’t have to wait for the page to reload between steps, the page became unavailable (or sections did), which, from the customer standpoint, is essentially the same thing.

I believe the intent of the extension developers was good, i.e., that a one-page checkout experience could be better than a 6-page experience, but the checkout mechanism simply wouldn’t support it without extension-breaking customization. It was a quandary.

We upgrade Magento and ‘BOOM’

When we did our first test upgrade, one of the first items of business was walking through the checkout process. While it seemed needlessly unfamiliar at first, I reflected on the research available in the area. I knew that all of it (and more, I’m sure) was available to Magento’s design team, so, it made sense they would have carefully crafted the checkout process to optimize conversion. Soon, all of the changes to the process began to make sense. The lightbulb went off.

Focus, Focus, Focus

The checkout upgrade Magento seems to have worked the hardest on was to focus the customer’s attention through the checkout process. They got rid of distractions like the menu, footer and other extraneous links.

Step 1 - cart page

If you don’t need the cart page, we recommend sending folks straight to the checkout. However, if you have to send shoppers to a cart page first, you should appreciate Magento 2’s cart.

Step 2 - email address

The beginning of any transaction is the email address. Whether you log in or not, whether you create an account or not, this is the one crucial piece of information. Magento asks for it first. If you have an account, Magento recognizes your email address and asks you to log in… if you want to. If you want to checkout out as a guest, just keep going without entering your password. The decision is made by acting on it or not, rather than diverting the customer to another screen or pop up that requests a ‘decision.’

Getting paid

Without leaving the page, I can now choose a payment option and proceed. Using Braintree’s extension, I get the added advantage of not having to enter my credit card type… it recognizes it from the first digits of my credit card.

Order Summary is always on page

Your addresses, shipping method and cart items build as you complete the process and are always editable without leaving the checkout flow as you can see on this Razoyo client site.

Discount code

Years ago, I worked at a large chain of pizza restaurants in the marketing department. One of the biggest complaints customers had was when the order taker asked if they had a coupon. Why? Because if you didn’t have a coupon when ordering a pizza, you felt like an idiot and you were reminded of it then. An important number of transactions were abandoned because of coupon remorse. The order taker asked for operational efficiency  reasons (if the customer stated the code after the order had been placed, it had to be completely redone), but, it killed some sales.

The same theory applies here. While you still need the code to apply it, not assuming a code is available by having an open box reduces the potential remorse from shoppers who don’t have one. Renaming it from ‘Discount Code’ to ‘Loyalty Code’ or ‘Shopper Code’ might even help more (would be a good A/B test to run).

Upgrade Magento’s Mobile Checkout Experience

Many of the enhancements make mobile even easier.

• Using drop downs for month make them scroll-wheelable on mobile devices
• Big target buttons make checkout a breeze even if you have two left thumbs
• Form fields are data-typed, meaning many mobile browser will fill in the information (like email or address) of the user where applicable
• PayPay is seemlessly integrated, making that checkout option even easier

Can it be better?

Everything can be improved, but, Magento got a long list of important details correct in this version. The amount of attention paid to the email entry step alone is impressive. Contact us about your Magento 2 upgrade and we’ll talk about upgrading your checkout experience to match your site and shoppers.