1

How should the checkout process look on mobile devices? Should I even use a single page checkout?

I was thinking of having a single long page in which the user first adds name, email, address and then selects the shipping and payment method at the end.

But a lot of customers go to the checkout page to see the total costs (with shipping and payment) - this would mean that the shipping and payment selector would have to be displayed before the customer decides to type in the shipping address.

Do you know of any research or actual experience about this topic?

1

At tradus.com We use the below

  • We show the entire cart in first scroll.

  • In second scroll we show the address / payment options.

  • The header button changes according to the information filled. i.e If the address / payment information is filled , the button says "Payment>" which take user to payment. Else we show "Checkout" which actually scroll down to address fields.

enter image description here

  • The cart total is sticky like below

enter image description here

  • If user enters a non serviceable location in address field we highlight the textbox and also show the error message like below

enter image description here

enter image description here


THE ENTIRE CHECKOUT SCREEN LOOKS LIKE -

enter image description here

When user taps on "Select Addres>" We show a hamburger style slide like below

enter image description here

0

Thinking of customers' decision points, you could design good checkout process.

Decision points are the points, where customer ask question to herself, should she continue or exit the process? So decision points work like funnel.

Obviously not all the visitors of the checkout page will purchase the items. But letting funnel to trigger early, allowing the non-purchasers quit on early stage delivers better UX. Because they don't feel they are tricked and they didn't go too deep on wrong way. So they quit and are satisfied with it.

Satisfied non-purchasers are the possible next-time byuers!

Returning to decision points, they could be (for your field you can have other factors and ordering):

  • price. If agreed, then
  • payment method. If agreed, then
  • delivery terms. If argeed, then enter delivery adress, etc.

Separating the stages on different screen could give you cues about critical decision points, where many users are quit. This allows you to refine the process.

0

The best checkout experience for me personally has been through the Poshmark iphone app. I use it often just to quickly check the total price including shipping and if I think it's too expensive, I can get back to my item easily using the back button. It takes just two clicks to make a purchase on this app if your details have been entered once. You could install it and see how the first time checkout looks like, because the subsequent checkouts are a breeze.

Here's an example of the checkout screen:

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.