Share on Facebook0Share on Google+0Share on Reddit0Share on LinkedIn0Tweet about this on Twitter

How to Integrate Payment Gateway in a Mobile App?

Fact. Mobile shopping is on the rise.

And we now pay for services using our phones more often than ever – paying for services like taxi rides, booking car rentals or accommodation or purchasing premium Wi-Fi access.

So, how to build a mobile app that accepts payments?

  1. You need an app concept, but let’s assume you have it already.
  2. You choose the optimal payment processing gateway and integrate it within your product.

And we’ll talk about point B in this guide.

But, before we move on to various mobile app payment gateway integrations, let talk about the user payment experience in general.

Payment Form UX Essentials

Mobile commerce will total $142 billion in revenues by the end of 2016 according to Forrester forecasts. The average order value for tablet purchases is $98.07 and $81.27 for mobile purchases.

Yet, the majority of shoppers are not quite delighted with their overall experience. Just take a look at the average mobile conversion rates:

image02

Pretty low, right?

So, before you move on to browsing various payment gateways for mobile apps, let’s talk about the key design principles for better customer experience:

Auto Formatting for Cards

Credit and debits cards are the two most popular mobile payment options with just 15.8% of shoppers giving preference to 3rd party payment systems like PayPal, Apple Pay, Google Wallet etc.

However, typing those 16 digits can be cumbersome from mobile.

Here are a few simple tweaks to make the entire experience more delightful:

  • Automate the formatting: for instance, the space will emerge automatically once the user typed 4 numbers.
  • Set up card distinguishing by the first four numbers. The most popular card types (Visa, MasterCard, and Amex) feature a signature four digit pattern. After those are being typed, you can show the user their card icon pattern to confirm that you are accepting this card type and offer a real-time verification simultaneously.

Display The Final Price Before Checkout

One the common reasons why shoppers abandon purchases is due to the unexpected additional costs being presented during the checkout.

Hence, clearly display the total payment information before hand. The number should already include shipping, discounts, processing fees if any.

End the payment form with a clear “Pay Now” button, which would inform the user that there are no more steps to take and their account will be billed once they proceed further.

Bonus point: If you choose PayPal as your payment gateway, you can choose to display the total price either based on their cross-currency rate or your bank’s currency conversion rate, which may be better.

To Store or Not To Store Payment Data?

There’s no good answer to that. Some users feel comfortable about storing their credit card details within the app for one-click purchases. Others feel reluctant, especially after the recent series of major data breaches.

In fact, Stripe – a popular mobile payment system – made a big blunder in the early days. After rolling out the new version of their Checkout tool, they offered users to optionally save their credit card data to use across different sites. As a result, a number of customers got upset and confused when seeing their card data typed for them at websites, where they have never shopped before.

Bottom line: Any mobile payment integration should come with the security in mind. Always opt for SSL encryption and HTTPS connection when building your integration. You can offer users to save their credit card details, yet it’s worth requesting them to type the CVV number each time to finalize the purchase.

Now, let’s move on to choosing the best way to start accepting payments in a mobile app.

shutterstock_289585244

How to Integrate Payment Gateway in a Mobile App

In this case, we won’t talk about supporting in-app purchases. This is a whole different story.

This payment functionality can be set up only through the Apple’s AppStore or Google Play services for iOS and Android devices respectively. You cannot sell digital goods using any 3rd party mobile payments app in this case.

However, as long as you are selling physical products or subscription plans for your software, then you can choose any payment gateway integration that suits your business needs most (and avoid the 30% payment cut Apple and Google takes from every app purchase made).

So, what are your options here?

Stripe

content_stripe_relay_press_image-0-0

Stripe is arguably the most popular payment processors out there.

As it was designed primarily for developers, integrating a payment gateway, in this case, is rather simple. Plus, there’s a lot of room for customization. Stripe has a variety of APIs for integration and supports a great deal of libraries – iOS, Android, Ruby, Java, PHP and a bunch of others.

You can check the full documentation here.

Cool Features:

  • Recurring billing.
  • Apple Pay/Android Pay support.
  • Social media payment integrations.
  • Detailed monthly reporting on all the financial activity.
  • Supports payments in 100+ currencies.
  • Accepts Bitcoin payments.
  • Allows creating beautiful custom payment forms to complement your brand.

Price List:

  • Rate: 2.9% + 30 cents per successful charge
  • Monthly fees: none
  • Setup fees: none
  • Currency conversion fee: 2%

Braintree

img

Braintree is another sleek solution and part of the PayPal family. It allows processing credit card, PayPal, Bitcoin, Apple Pay and Google Pay payments.

To integrate a payment gateway in a mobile app, you can use Braintree’s drop in checkout UI or customize the form up to your liking. Similarly to Stripe, the integration process is rather straightforward and requires writing just a few lines of code.

You can review all the essential documentation here.

Cool Features:

  • One Touch Payment – allows PayPal, Venmo, and Braintree users to authorize their purchase with one click.
  • Added security through the hosted fields feature – in this case credit card text fields are hosted remotely (according to PCI requirements) without creating additional tension for the users.
  • Available in 40 countries and supports 130 different currencies.
  • Two-day payment processing (unlike 7 days with Stripe)
  • Recurrent billing is also available.

Price List:

  • No fees for the first $50,000 processed.
  • Rate: 2.9% + 30 cents per successful charge
  • Monthly fees: none
  • Setup fees: none
  • Currency conversion fee: 1%

PayPal

shutterstock_217295572

Heads up, PayPal is the most popular digital wallet out there and 79% of US users have an account with it. A lot of customers, especially millennials, prefer to shop with PayPal when they don’t feel like providing their credit card data.

Using PayPal mobile SDK you can accept credit card, PayPal, and Bitcoin payments; create simple Payment Buttons with an HTML snippet or build an elegant custom payment form.

Cool Features:

  • Supports split payments.
  • Allows simple invoicing.
  • Makes managing payouts to multiple recipients really fast and simple.
  • Offers comprehensive reporting tools for all your financial activity
  • PayFlow Gateway allows businesses to connect their accounts to all major payment processors, while also accepting PayPal and PayPal Credit, authorizations and captures.
  • Allows hosting your own checkout page.
  • Supports over 203 countries and 26 currencies.

Price List:

  • Rate: 2.9% + 30 cents per successful charge. (less if you are processing over $30,000 per month)
  • Monthly fees: none or $30 for the PayPal Payments Pro package.
  • Setup fees: none
  • Currency conversion fee: Depend on your location – from 0.4% to 3.3%. Learn more on this page.

Here are some other industry players you may want to consider for your company:

  • Authorize.net – monthly and setup fees apply.
  • Worldpay – sign up fees apply.
  • Dwolla – just $0.25 per transaction over $10 and zero per those less than $10.
  • WePay – operates in the US only. No setup fees, standard 2.9% + 30 cents charge.

Both the design and the tech details of your payment form are essential for higher conversion rates and better customer experience. Technical glitches, shady security or complicated forms mean less revenue for your business.

If you need help with building an efficient mobile checkout experience, backboned by secure integrations, get in touch with Alty. We’d love to check on your project!

Rate the article
[Average: 5]
Want to Get our Digest to Your Inbox?
Great, You are Now Subscribed!
Hands-on Guides
4 Steps to Improving Your App’s Security

After putting so much work into designing, marketing, and maintaining a great app, the last thing you want is a security breach that could derail your users’ trust.

Slava Bushtruk
Hands-on Guides Startup Goodies
Mobile App Testing: Why You Should Always Test Your Apps?

Learn how to bulletproof your apps for excellency with the right testing approaches.

Leonid Gorev
Hands-on Guides Startup Goodies
Responsive Website vs. Native App: What To Choose & When

Mobile is the primary channel for content consumption. But what do you need – an app or a responsive website?

Slava Bushtruk