6 Simple UX Tips to Improve Checkout Conversion

As a UX designer, we are always looking for ways to push the needle for our clients in the ecommerce space. Here is a quick list of things we have seen in the design industry to boost conversions and keep users coming back for more future purchases.

1. Break up your content into bite-sized pieces

The checkout and onboarding process can be very tedious. One thing to consider for a higher success rate in completion is to break all the steps into sections and add visual indicators. This does two things:

  • Allows the user to process the amount of information needed to be filled out without getting overwhelmed
  • A visual progress indicator helps the user see that they are almost complete

01-bite-size-info

2. Standardize all field and form entries

It’s important to evaluate all the information being presented to the user and ask yourself:

  • Is all the information needed? Is there anything that can be removed?
  • Are all the forms presented consistently and readable? Can the typing be reduced by leveraging buttons?
  • Is there a place to add masking in credit card and phone fields to make it easier for the user to scan proper entry?


The goal is to create a minimalist, yet, strong and effective approach to creating forms. By removing any fields that are not necessary, providing consistency across all fields; left inline labels, and masking in the proper fields, you create a faster and more efficient user experience. Masking is a way to show the user how the information should be entered correctly by using dashes, underlines, parenthesis, etc.

 

04-credit-card-mask05-credit-card-mask-filled


3. Provide error messages

Let the user know when they need to make a correction in real time while they are filling out the form instead of waiting until the end before they see an error.

07-error example

4. Display the proper keyboards

Nothing is more frustrating than trying to enter a phone number or credit card and the alphabetical keyboard pops up. A simple and quick win here is to display the proper keyboards in each situation. Below, are 4 standard types of keyboards;

  • Alphabetical (default)
  • Email (includes @)
  • URL (websites)
  • Phone (used for credit cards and phone numbers)

08-keyboard-types  

5. Auto Complete

Whenever possible, enable the auto complete capability  to help reduce the amount of fields the user has to enter when checking out.

09-auto-complete

 

6. Easy Payment Methods

10-applepay   11-venmo

12-paypal-stacked  13-masterpass

Leveraging ways to pay without having to enter credit cards helps make the checkout process less painful and more seamless. Offer multiple ways to pay to encourage users to purchase the item.

This is where we leave you

These are just a few easy ways to improve overall UX and conversion on your sites. Let us know if you’ve tried any of these solutions, or if you would like to learn more about improving UX and/or conversion. We’d love to hear from you!

 

 

This entry was posted in Best Practices, Ecommerce and tagged , , , . Bookmark the permalink.