I purchased the MacHeist bundle today. If you’re not familiar with it, its a collection of Mac Apps that this group puts together and sells rediculously cheap. I spent 20 bucks, only for one app that I really wanted (Flow by Extend Mac).
Regardless, this post is not about that bundle. It’s about my checkout experience. It was amazing. Textbook UI for checkout. Here’s a screenshot of the payment section:
Lets talk about what they did right here. Firstly, they allow you to pick between Credit Card and Paypal. Note, they don’t make you select which type of credit card you are using. They only support Visa and Mastercard, and they can use the digits of the card to determine which you are using, so they don’t need you to provide that information.
Next two fields are standard, “Name on Card” is easy is enough to figure out and if you don’t you know where to find your credit card number, you’ve got bigger problems.
Next is the expiration date. Lets talk about what makes this field so great. Firstly, they list both the month number and the name. This is very clear. It shows you that you are talking about months and displays the context in relation to the month number. The key here is that they number is first. This means that if your browser supports it, you can start typing with the field selected and get straight to the month number. Also note how this field is a two digit number? Add clarity as the numbers will align in the pull down.
Next is the security code, they have a little credit card graphic to indicate where to find your code. Very helpful.
Next you move on to the address information. There is a clear separation between the Credit Card info and the address info. Breaking forms up makes them easier to parse. None of this information is overly hard, but large blocks of form fields can be intimidating.
All in all, this is the best online checkout experience I’ve had for some time.