1

Our checkout system has 3 clear steps:

Basic Information - Title, Name, Email, Phone
Card Details - Payment Type, Card Details
Billing/Delivery Address - Company Name, Address

I would like to know if the user has a better experience by seeing all of these steps at once (by default) or by taking customers through a multi-step checkout process much like Amazon's order process, showing and hiding sections as they're filled.

The way I see it would be:

Combined Page
Users see all the information needed at once and make a decision whether it is worth their time to fill in, maybe putting off some potential customers.

Split into Sections
Users can fill in their information on a clearer, less packed page. Doesn't seem like as much to fill in and by the time the customer gets to step 3, (as evil as it sounds) they've already invested too much time to consider quitting the process.

Are my thoughts correct or are there other things to consider?

5 Answers 5

3

LukeW and Etre ran some tests that compared a single page, multiple page, and accordion version of the same generic e-commerce checkout form (personal, shipping, and billing info).

They measured standard usability and eye-tracking data for each.

The results did seem to indicate that simply porting the same questions from one long web page to several web pages or to an accordion form isn’t likely to significantly increase conversion.

"This doesn’t mean that Web form design can’t improve the digital shopping experience. It just takes more than moving form fields across Web pages."

4
  • I think you meant to link to this - giving it a read now! Commented Nov 25, 2013 at 14:06
  • Yes, but the "tests" link I posted is more relevant ;) Commented Nov 25, 2013 at 14:19
  • Your "tests" link is about inline validation, not single/multiple/accordion tests :P Commented Nov 25, 2013 at 14:24
  • 1
    Sorry, I found the correct link Commented Nov 25, 2013 at 14:41
2

Actually it is a matter of focusing on elements and the time it takes to complete that form, the decision to split the form in multiple zones or multiple pages it depends on how long the form actually is.

But you need to be careful to be completely honest and clearly show the steps or estimated time to completion.

Hope it helps.

2

@Paolo hinted at this, but I prefer the Accordion checkout process. The interface still shows the user the steps required and where they are in the conversion funnel, while keeping all the content on a single page.

Accordion is probably the solution you're looking for.

1

Your thoughts are right, chunking a task into smaller steps brings the perception of more easy task. Also switching to a next step is a progress feedback.

Still, I think you could try to combine last two steps. You could rebias (the term from behavioral economics) the unwillingness to fill long form placing the image of purchasing item right next to form. This could force to finish the filling process.

1

Elastic Path built a couple of years ago a one page checkout e-commerce website, they even made some A/B to check the performance of both solutions, but there was no decisive winner. Maybe these blog posts from Get Elastic blog will help you to choose better solution.

http://www.getelastic.com/single-page-checkout http://www.getelastic.com/single-vs-two-page-checkout

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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