Taking payment from a card, how much help is needed?

Question

I've noticed more recently the reduced amount of hints and help on card payment forms. Some are only offering help for CV2 code (the 3 digit one on the back). My question is...

Has payment functionality been around so long now users just know how to do it instinctively? How much help does a user really need to complete a payment? Is there ever such a thing as too much help with this type of thing?

Answer 1

I guess you will have to leverage the ammount of help you want to display without making the form too clogged.

As always, it depends on the kind of user you have. If they are internet-savvy then they already know what to do. If they are the n00b type (normally elder people, such an irony) then you will probably need to build in big tool tips or even make it a multi-step form.

Since Paypal is arguably the most used payment gateway, it useful to see how they do it:

As you already mention, the only aparent tooltip is to explain the CCV number. But some recommendations come to mind:

• I always like when the form detects my card's brand and displays its logo (Amex, Visa, etc). It is inmediate feedback that you are inserting the right number.
• Make tooktips available for each input, or at least for the ones that could be more confusing (like the expiry date). You can do this by either showing extra information while the field is focused, or by providing a small help icon (?) on the side that will pop-up help information if clicked.

SmashingMagazine has an article about guidelines in an e-commerce checkout form, and it is always good to re-read ALA's form usability checklist.

Answer 2

Consider who your users are. If your main customer base is 20-35 year old, working in the web industry. They are going to need little if any help filling in a payment form.

If the site was for a broader user base, my personal opinion would be to add hint icons where appropriate. On click the hint would explain what should be entered.

For example for card number (the xxx digit number in the center of the card, maybe with a visual). If the hint is handled in the correct way it shouldn't distract the expert user, while clearly indicating to novice users that further info is available.

Answer 3

I suppose the answer is to provide enough help for the most novice user, while keeping this outside the line of attention of the expert user. So for me, I want to know which fields you need filling in, so give me a red asterisk, and I will fill in everything without any assistance, and work out what format of start and end date etc are wanted. However, for a novice, some help and hints to the right of the form lines will assist them in identifying what fields and what format they are required in. It might even make sense to have a picture of a card, and lines to indicate what information goes where. As long as it does not interfere with my inputs, whatever works.

And I would agree with and extend @Patrick, that entering the card number first, detecting the type, and then only asking for the relevant information, and indicating the relevant field length ( cvv is 3 characters except on amex where is it 4 ), to make the rest of the form easier to fill out for everyone.

I have built this functionality on a site. If I can do it, then it should be easy for others to - it isn't rocket science. And it makes it far easier to enter just the right data.

Answer 4

I would add one simpler step to the proposal made by Naoise Golder here.

You can identify what type of the Credit Card user is using by analysing first four digits of the number (so called Issuer Identification Number).

This will remove one step from the form which will make the process more usable.