When the internet came along, cards were seen as the obvious option to process payments online. However, as we’re about to see, payment cards were not built for the online world. In fact, they are seen as inefficient, inconvenient and expensive for those buying and selling online. In the world of UX, cards are especially hard to work with since they require a lot of manual input, security features and cause many issues for merchants.
Customers have already built a mental model of how to make a payment online: enter card and personal details into a form, hit submit, and the payment is processed.
Although in theory it sounds simple, it usually doesn’t happen that way. Making a payment online is prone to errors, and can often be time consuming and inefficient — it’s very different to simply tapping a card like you would in person.
Here are some examples of the problems that arise making paying online a process full of friction:
High cognitive load
There’s still a lot of mental effort that goes into completing card payments. Consumers need to complete a lot of different fields, and can often be overwhelmed with making small decisions, and have to ask themselves questions such as:
What cards are accepted?
Do I need to enter my card number with or without spaces?
What’s the expiry date format? (Some cards include the format MM/YY while others include the full year YYYY)
Is this form secure? How do I trust this merchant?
Home page syndrome
Many checkout pages are confusing with a garage of links. That translates into too many buttons and makes it clunky to navigate.
Time-consuming
Users need to fill in at least 5 inputs before proceeding and double check that the information is correct. 53% of sites don’t auto format spaces in the credit card number field, which increases the chance of errors and makes it hard to check the number.
Clunky mobile experiences
More people than ever are making payments on their phones. Most merchants don’t offer quick, easy mobile payment options, which leads to customers being forced to type a long string of numbers into a tiny screen.
No standard form input
Security codes are often not standardised. Every card brand has their specific convention (CVC2, CID, CSC etc) and it can be 3 or 4 digits. The same goes for postcode entry as well as the expiration dates, which often use different formats.
Security
Card details are relatively easy to hack. More than 23 million card details can currently be bought on the dark web for anyone to buy. Resulting in card not present fraud being 81% more likely than point of sale fraud.
Lack of information
Users are not usually updated on what is happening after they click “Submit” and the microcopy will often use jargon or not explain clearly the payment process. Very few merchants include a loading state or successfully redirect the consumer back to the merchant website.
Error handling
When there are mistakes in the data, typos and missing data, this translates into system errors, invalid information and card errors. In fact, 53% of sites don’t use Luhn validation, a very simple tool to determine whether a credit card number is correctly typed in. All these errors make it very easy for a customer to abandon the checkout page.
Merchant issues
For merchants, cards can cause a lot of headaches. They often come up with reconciliation issues, and cards have lengthy settlement processes. Most importantly, the fees are high, and they’re only getting higher — Mastercard and Visa have already raised their fees in 2021.
What needs to be improved to help conversions?
When designing the payment experience, there are a few UX practices that need to be taken into account to ensure high conversions:
User motivation
What motivates a user to complete a payment? Understanding the drive of a user and emotions when going through a payment flow is vital when building a payment solution.
User type
The payment flow needs to cater for first time users as well as returning users. This is also true for both desktop and mobile users.
Keep it simple
The more options there are, the more time users take to make their decisions. It’s important to break down the payment flow into smaller steps to decrease cognitive load and avoid overwhelming users. For example, merchants are better off using methods such as fallback (proposing a different option if the first one doesn’t work), rather than offering all payment methods at the beginning.
Visual hierarchy
Merchants should aim to structure the content into visually distinct groups with a clear hierarchy, in the order that people understand and see. For example, making buttons large and easy to click on while making legal language smaller.
Familiarity bias
People prefer familiar experiences. It’s also true that most decisions are not actual decisions — they are in fact, habits. Merchants can use this to their advantage by implementing common patterns when designing the checkout experience.
Progressive disclosure
Users are less overwhelmed if they’re exposed to complex features gradually, so merchants should focus on breaking down the steps and maximising the functionality at every step of the journey.
Where do A2A payments come in?
Account to account (A2A) payments are helping revolutionise the online payment flow, and adoption is growing rapidly.
With A2A, users connect their bank account directly with the merchant via a licensed third party that uses the Open Banking rails. That means they can forget about using cards, inputting long strings of numbers and filling in forms on a tiny mobile screen.
Both consumers and merchants benefit greatly from A2A payments. Here are a few ways how:
Security
As we’ve mentioned above, merchants are in a constant battle against card fraud, the high cost of chargebacks and increasing operational costs. When you remove the middlemen, merchants are able to keep fraud and chargebacks to a minimum and make the checkout more secure.
Faster settlement
With Open Banking, merchants get paid more quickly. Instant account-to-account payments remove the need to use card networks and other time-consuming intermediaries.
Cost
By removing costly middle-men A2A payments can be provided at a lower cost than card payments and aren’t at the mercy of huge card networks, allowing merchants to save a large amount on transaction fees.
Reconciliation
Account-to-account payments are irrevocable. Not only does this minimise the cost for reconciliation and chargebacks, but it makes it a lot easier to automate.
Better experience
Most importantly of all, A2A payments are made for digital, and can be easily and smoothly integrated into the checkout process.
Take a read of part 2 here.