mobileoptimization-p1-editorial-banner-copy.jpg:us

How to optimize the mobile app checkout experience

Your mobile app or website are crucial drivers of conversion, often representing a make or break opportunity for winning new business. Here are some tips on how to optimize the checkout experience within your mobile app.

With customers migrating their purchase-behavior steadily away from the desktop over the last several years, there’s no question on the increasing ubiquity of mobile shopping. According to Statista, during the third quarter of 2020, smartphones accounted for 71 percent of retail site visits in the United States and generated 56 percent of online shopping orders, while desktop computers generated only 27 percent of retail website traffic but generated 42 percent of all purchases.[1]

To capitalize on this growing trend, your mobile app or website experience must be crucial drivers of conversion, often representing a make or break opportunity for winning new business. Here are some tips on how to optimize the checkout experience within your mobile app.

“During the third quarter of 2020, smartphones accounted for 71 percent of retail site visits in the United States.” - Statista

mobile-optimization-blog-inline-71-statista.png

For mobile app development, the bar is high

Customers who download your app are looking for a seamless and fast shopping experience with a smooth, predictable flow through checkout. Some of the best apps out there fight for customer loyalty by leaving no stone unturned. Wanna track your order in real time? Perhaps make last-minute changes or cancel an item? If there’s a great app, there’s a way — It’s become second nature for customers to expect a detailed, end-to-end shopping experience with everything they need, all in one place.

Don’t drop the ball at checkout

One critical component to a great app experience is offering customers their preferred checkout options. Millions of customers already have preferred payment methods that they look for on all eCommerce cites, so adding several options could improve your conversion rates. Amazon Pay is one such option that makes it easier for shoppers to checkout in a fast, secure and familiar way — with no additional account creation required.

“6% of users abandoned one or more orders due to lack of their desired third-party payment option.” - Baymard Institute [2]

mobile-optimization-blog-inline-6percent-abandoned.png

Sometimes, a customer will have their login or payment information saved in their browsers, and when they switch to using a mobile app they have to enter it all over again. Even worse, they’ll have to dig for their wallet, shuffle through various credit cards and then enter long numbers in a bunch of tiny input fields. What a drag, right? With checkout solutions like Amazon Pay, there’s no need — customers can skip those cumbersome steps and breeze through purchase using their already-stored payment methods from Amazon.com.

A happy customer stays in the app

mobile-optimization-blog-inline-happy-customer.png

Secure webviews are another way to keep customers engaged in your mobile app experience, allowing you to display website content without redirecting the customer to the browser. This keeps customers within the context of the App while allowing them to experience the seamless Amazon Pay checkout flow. If you already have Amazon Pay offered within your app, think about integrating Amazon Pay on your website to take advantage of the retention and elevated experience secure webviews can provide.

Adding Amazon Pay to your native app

Ready to get started? Follow these simple steps below to offer Amazon Pay in your native application:

  1. If you have not yet signed up for Amazon Pay, please register to start.
  2. Add the Amazon Pay Button image to a page in your app. Start the Amazon Pay checkout flow in a Secure WebView when the buyer clicks on the image.
  3. After the buyer selects their preferred address and payment method, they will be redirected to checkoutReviewReturnUrl which should take the buyer back to the app. Note that the URL will include a checkoutSessionId parameter that you need to pass to your native app for the next step .
  4. Call get checkout session to retrieve the buyer’s name and address .. Display the information in your native app and use it to calculate shipping costs (if applicable).
  5. When the user is ready to complete checkout, call update the checkout session using the checkoutSessionId to set the following information:
    1. Final charge amount
    2. Additional order metadata
    3. The checkoutResultReturnUrl that the buyer will be redirected to after Amazon Pay is done processing their order.
  6. Once you’ve updated the checkout session, the API response will include an amazonPayRedirectUrl. Open the URL in a Secure WebView so that Amazon Pay can process the order.
  7. Once Amazon Pay has processed the order, the buyer will be redirected to checkoutResultReturnUrl which should take the buyer back to your native app. To complete the transaction call complete checkout session and display a thank you or confirmation page.

Your customer can now use Amazon Pay to purchase your products from their device without ever having to open their wallet.

For Amazon Pay documentation, please see the link here.

[1] Statista, Share of devices used for online Christmas shopping by consumers in selected European countries in 2020.
[2] Baymard Institute report on Mobile Checkout Optimization, in collaboration with Amazon Pay, 2020