Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

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?

share|improve this question

3 Answers 3

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

share|improve this answer

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.

share|improve this answer

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

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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