Checkout experience design principles

By the time a customer is on a checkout page the design has one job: taking their money.

Having worked on a few checkouts for major ecommerce sites this is a collection of design principles I’ve learnt, borrowed and stolen. Each may or may not apply to your design, customers, clients or products so as ever apply intelligence and test as much as possible.

1) Ruthlessly remove stuff

If it doesn’t contribute to taking your customer’s money remove it.

Exception: be cautious about removing the terms and conditions checkbox, I’ve seen customers be wary of designs without it and actually take time to look for it when it wasn’t there. Customer have been trained to look for it so including it in a clear way may be better than removing it altogether. Test it with your customers.

2) Add stuff that reassures the customer

Add stuff that helps reassure your customers. Saying how trustworthy you are and explaining what happens after purchasing will help customers be confortable with giving you money. Remove doubt.

3) Use simple interactions and basic form elements

These are design principles so I don’t want to get too far into form design but there are some general guidelines that are worth sticking to.

4) Avoid error messages (where possible)

If a customer sees an error message something has gone wrong. Customers who see error messages are less likely to give you their money.

5) Make paying easy, but not so easy people don’t feel in control

There’s a balance between the easy of making payments and a customer feeling in control. Amazon’s one-click system is wonderful if you’re buying paperbacks and stationary but if you’re selling £3000 holidays then it’s probably not the right solution for you. The backlash against in-app payments is an example of what can happen when customers are not in control of their payments.

6) Visual design doesn’t matter too much for checkout pages

Looks can kill a sale but they won’t make one. I’ve seen a big London design agency do a redesign of a checkout that made zero difference to conversion – it went from a 2002-style 800px wide design to a shiny contemporary look but didn’t change any of the processes. This isn’t to say you can get away with your checkout looking shitty:

7) Miscellaneous, other, etc.

Summarising

Every site will have it’s own design challenges but there are four overarching principles for good checkout experience design:

Checkouts are a transactional experience so design them with that in mind.

What have I missed? Got any good examples? Let me know in the comments.

Comments (3)

  1. Jan Srutek

    Great post Ed. Having just been through a checkout redesign, your tips are totally aligned with our thinking.

  2. Gopi

    Good read. I’ll keep these in mind the next time I design an e-commerce site. Thanks!

  3. Lucy Wilson

    Great read Ed. All points resinate very well, especially the note on visual pages not mattering too much for the checkout!