Learn from the best and increase E-commerce shopping cart conversion rates with every UX (user experience) and UI tool available. Preparing for a new consumer shopping cart for end customers to directly buy products for Cisco I wanted to establish a baseline of best practices. I researched the latest UX leaders opinions, analytical data, tips and the most comprehensive UX survey I could find at the time. ( Baymard Institute 2012 Checkout Survey). Watch and enjoy. I hope this information is helpful to others.

1. CONSUMER CHECKOUT BEST PRACTICES
DECEMBER 1, 2014

2. 68-74% of consumers abandon
their shopping carts before
making a purchase.
(Baymard Institute, 2014 Cart Abandonment Rate Statistics)
(Barilliance, 2013 Survey)

3. Why Do ConsumersAbandon Shopping Carts
Our focus will be on what can be improved
by changing the user experience.
Let’s hide the user behavior we can’t affect
and any changes a business department
would have to approve, i.e. lowering prices.

4. Consumer Checkout Best Practices

5. Best Case Examples
Let’s look at the top rated
checkout experiences and adopt
the best in class traits.
(Based on Baymard Institute, 2012 Survey)

6. Baymard Institute 2012 EcommerceCheckout Survey

7. Crate & Barrel
Ranked #1 in User Experience checkout by
Baymard Institute 2012 survey.

8. Emphasize checkout button
Path back to browsing is
clearly marked but
differentiated from
Checkout to eliminate
user error
Put Checkout button on top &
bottom of page for ease of use
Crate & Barrel

9. MakeTotal Cost clear and separate from other items
Give the consumer an estimate of the shipping and total
cost based on lowest price and current browser
geographic location
Allow user to easily edit cart items
Crate & Barrel

10. Give customers the option
of checking out as a guest
Offer options to make the
checkout even faster. In
this case skip some steps
by using defaults.
Allow Returning
customers sign-in without
leaving checkout workflow
Crate & Barrel

11. Clearly show how few
steps are left in the process
Keep the total of the
order visible during the
process whenever
possible
Take formatting out of the
issue (eliminate user error)
Crate & Barrel
Display security badges
and make the extra
information easily
accessible without
cluttering process

12. Show confirmation of
addresses after entery
Clearly display what the
function of the page is
Allow user to easily
correct any mistakes
Crate & Barrel
Show how shipping
address affects delivery
dates and shipping prices
Give shipping options but hide so
user is not overwhelmed by
choices or distracted from
purchase.

13. Offer security assurances
next to payment method.
Offer multiple payment
methods. Consider
PayPal
Show hints for finding
security code
Crate & Barrel
Default shortcuts to save
the customer time. Allow
Opt Out.
Prefilter the expiry date
from todays date

14. Allow for easy editing
Display all order data
collected clearly.
Allow for last minute
editing of quantity on the
review page
Crate & Barrel
Show the Continue and Submit
buttons at the top & bottom of the
page for easy access
Show the product being
purchased as
thumbnail
Allow users to ‘save cart for later’ reduces
frustration for the unconvinced

15. Symantec
Ranked #2 in User Experience checkout by
Baymard Institute 2012 survey.

16. Simplified suggested
products
Symantec Help is always near at
hand
Options have been
simplified and have clear
pricing upfront
Savings are shown at the
top level and simplify
how to save
Clear action for button
text

17. Product page layout has
removed almost all
distractions
Symantec
Prominent picture, title
and description reaffirm
product added
Options have been
simplified and have clear
pricing upfront
Money-back guarantee
reduces purchase risk.
Remove obstacles for purchasing. Extra information
route is there if needed

18. Symantec
Security Guarantees
Easy editing of cart
contents
Discount code hidden so
user doesn’t get coupon
remorse
Clear button functionality
relates to text
Credit Cards are shown
before user enters checkout
workflow. No surprises.

19. Symantec
One page checkout layout
simplifies process and gives
appearance of few steps
Checkout process appears
as three short steps
Allow for guest checkout.
Emphasize login for simple
existing account.
Security badges improve trust

20. Symantec
Shows cost confirmation
Defaults country based on IP
address
Shows confirmation of info
entered and allows for easy in-
cart editing

21. Symantec
Shows automatic CC selection
visual confirmation based on
CC# validation
Shows confirmation of info
entered and allows for easy in-
cart editing

22. Autozone
Ranked #3 in User Experience checkout by
Baymard Institute 2012 survey.

23. AutoZone
Path to checkout is clear
Give the user plenty of
shipping or pick up options.
Default to most common
choice to aid customer.
Allow for editing of quantity at
any time
Suggest other products based
on customer data

24. AutoZone
Make data entry as quick as
possible. Here one click
address duplication should
cover most users. 80/20 rule
Show simple and short
checkout process steps

25. AutoZone
Allow customer to become an
insider. This allows them to
slowly add information but
also allows them multiple
ways to save money.
Default to one shipping
option. Defaulting to the least
expensive will help develop
trust with customer.
Clearly mark total.
Have button text clearly state
what the function is.

26. More Examples at Baymard Site
There are 100 sites and 53 usability
guidelines in the survey.

27. What have we learned?

28. Simple Improvements • Show all costs / cost estimates / cost ranges as
soon as possible. Estimate if possible.
• Make simple clear streamlined navigation. No
surprises in the shopping or checkout flow.
• Solid Website experience. Optimized for all
browsers and load speeds. Lowest to highest.
• Streamline process. Cut out distractions. Don’t
risk current sale by chance of further sales. Show
user how many steps are left.
• Eliminate / condense/ hide any extra steps and
find ways default to fewer steps.
• Display security badges and info through links.
• Offer multiple shipping options but default to
one to streamline experience.
• Don’t have website time out affect checkout and
shopping process. Save cart options based on IP
address and cookies.
• Allow user to pay in all currencies.
• Allow as many payment methods as possible.
Display early to inform user. No surprises.
• Allow for most popular payment methods of
intended audience.

29. OtherTraits to Adopt

30. Allow customers to checkout as Guests

31. One site saw a $300 million
increase in one year by allowing
Guest checkout.
(Source: UIE.com, 2009)

32. Design a mobile optimized checkout
experience.

33. 48% use or would like to use a
smartphone to shop while in-
store or on the go.
(Source: Cisco, 2013)

34. 37% of consumers are more likely
to purchase on a mobile-
optimized site.
(ExactTarget, 2014 Mobile Behavior Report)

35. Offer Multiple Payment Methods

36. Some vendors have seen a 15%
jump in cart conversion just by
added one payment method.(Shopify
2011)

37. MatchTarget Markets Payment Popularity
Different countries will have different
payment method popularity. Make sure cart
payment method is not alienating part of your
audience
- In this case we see PayPal as the second most
popular method in the US.
- PayPal, and other online payment methods of the
advantage of ease.The user only has to enter
PayPal login and password.
- PayPal will also store shipping and billing info and
export to business shopping cart

38. Crutchfield saw a 33.7%
conversion rate increase by
adding PayPal Mobile Express
Checkout. (Internet Retailer 2011)

39. Before the Cart
Make purchasing path as clear as possible

40. Integrate Easy Purchasing into Entire Site

41. Use Call-out to directly speak to consumer and
route to separate
‘Buy Now’ site or Product Specific Site
BUY
NOW
Suggestions for routing consumer purchasing
Use current site navigation,
integrate ‘Buy Now’ options in
Product Catalog & How to Buy
Less
work
Preferred

42. • Include onlyVital Fields
• Allow Checkout as Guest
• Make data entry as fast as possible
• Make path to checkout obvious
• Remove Distractions, Not Content
• Simplified flow. As Few Steps as possible. See #1
• Show Progress.
• Build Lightweight. Load Quickly.
• Provide Security Reassurances
• Give multiple payment methods
• Create mobile friendly version
• Offer multiple ways to save money
Short CheckoutGuidelines

43. THANKS FOR WATCHING