Apple’s Checkout: Credit Card Flaws

(Originally posted on the Usability Matters Blog on December 22, 2009.)

Every week I collect a bunch of recommended reads in my browser tabs, hoping for a few spare minutes to skim through them. This week, one such article was Luke Wroblewski‘s blog entry, The Apple Store’s Checkout Form Redesign.

I really enjoy how straight-forward Luke is with his analysis in this article (and everything he writes, his book being no exception). He includes fantastic examples from Apple’s previous checkout form and its new checkout form. However, having just purchased a MacBook online, I have to disagree with his positive assessment of Apple’s new credit card form.

The form is as follows (note I’m using the Canadian form here so it’s missing the Discover card):

As Luke explains, Apple no longer asks users to identify their card type (Visa, MasterCard or AmEx) up front. Because we can infer a person’s card type based on their credit card number, all we really need is that number.

This is absolutely true. We have been asking people to enter unnecessary information for years. However, the problem is exactly that: people are used to entering this information.  So when we get to Apple’s form, we eagerly look for a place to identify our credit card.

My brain while using the form: “Lo! Look at those shiny images showing card types! I will click on Mastercard, for that is my card type.

A re-enactment, in pictures:

And then:

Then, the loud sigh. I gave up and started typing my credit card number in. And then the form did this:

All other cards are greyed out, and my card type was magically highlighted.

I am sure that Apple included the card type images as a way of telling users what cards they accept, but the images seem clickable because they are a) images and b) in a place where the user would normally expect to interact.

If I were to redesign this form, I would let users interact with the images if they want to. Let them select MasterCard up front if it makes them happy, but switch to Visa in the end if that’s the type of card number they enter. Users who choose to identify their card up front will be happy, and users who don’t identify their card up front won’t know what they missed.

Anyone else have an opinion on this?

(Thanks to LukeW for the inspiration to write about this issue.)

One thought on “Apple’s Checkout: Credit Card Flaws

  1. Hi there – Interesting. I looked at his article a few months ago when researching inline field labels and Apple’s new form uses them. I needed precedence that the concept works. It was a decent article.

    My feeling on your point about card type comes down the progress. I think it’s a progression and in the end users will adapt, and also like it better. You bring up a good point. What’s your experience in the HCI worlds with this…. are there concepts of inertia and adoption friction out there? I’d love to read more about that. Hmmm. Time to hit Wiki and find some rabbit holes… And, to answer the implied question, no, I wouldn’t have tried to click the images :)


Leave a Reply

Your email address will not be published. Required fields are marked *