Making beautiful forms; Square and Recurly

http://functionsource.com/post/beautiful-forms

by colinprince • 15 years ago

84 28 15 years ago

mgkimsal8• 15 years ago

I just got done putting together a basic CC form for a project, and they insisted that we have a separate pulldown indicating what type of card the user was going to enter. I argued against it, and was voted down.

One of the justifications was, by forcing a pulldown, you're telling the people what cards are accepted. However, showing icons and text does the same thing. There are no good justifications for it, imo. But, until people stop coddling end users from 1996, we'll be stuck with bad form input habits.

For goodness' sake, I saw a RESET button today. And not just a regular RESET button, but a custom icon, about 50% the size of a normal input button, butted up next to the 50% smaller 'submit' button.

WHO ever says to themselves "hrm... shoot - I just entered in 40 instead of 50 in field 7 of 29 fields - I wish there was a way I could erase everything and start over!". No one was pining for that functionality in 1995, but for some reason we got it, and every browser maker since then has seen fit to faithfully recreate it.

Sorry... slight tangent there...

rhizome• 15 years ago

I bet it's used to wow clients who don't know web programming. "If you want to start over, just click this link and BOOM, everything empties out." Nevermind that, as you note, nobody ever wants to start over.

mgkimsal8• 15 years ago

And on top of that, there's no undo :)

jasonlotito2• 15 years ago

> There are no good justifications for it, imo.

Your opinion isn't any more justified. There is a strong case for having the selection be there. You'd be surprised what happens to the average user when you removes the credit card selection field, especially when you can't accept every single credit card out there. I've actually spent time with this.

If you really want to make a case for removing it, demonstrate with actual numbers how it will make the company more money.

mgkimsal8• 15 years ago

As I mentioned in another reply, you have to have a client willing to pay for it.

My opinion is backed up with experience that problems end up being caused by people choosing "mastercard" but entering a visa number (for example). It's more errors that have to be dealt with, and causes confusion and in an earlier project, abandoned carts, or increase in phone calls to 800 numbers to talk to someone to place an order.

Can I say it was specifically that? No, but I did see higher than anticipated abandonment rates after wrong CC numbers/types were chosen.

But... hey... "that's not our site" and "our users are different". So... unless a client wants to pay for A/B testing (and wait for a statistically useful number of users to use both versions), they just go with whatever they want. And they'll rarely want to spend more money to prove themselves wrong.

ceejayoz• 15 years ago

> You'd be surprised what happens to the average user when you removes the credit card selection field, especially when you can't accept every single credit card out there.

PayPal handles this gracefully. There are icons of the (four?) types of CC they accept above the field. As you type, the ones ruled out by the first couple digits lose opacity and the card type you've entered remains displayed.

aaronblohowiak• 15 years ago

A/B test every argument.

mgkimsal8• 15 years ago

If they pay for it, sure, but clients rarely want to pay for extra work, especially it may prove their original beliefs wrong.

donw2• 15 years ago

Maybe framing your argument in terms of the direct value (or loss) to their business would have helped.

Maybe something along the lines of this:

"Of course, this is entirely your call. I just want to make sure that we're all on the same page about why I disagree with adding a separate pulldown.

By adding a separate pulldown, you're asking the user to make a choice. One of the choices they can make is to not complete their purchase.

Would you teach your retail cashiers to ask each customer if they were really sure that they wanted to buy today? Are they certain that today is the day to give your business money?

Because that's what adding an extra step to the checkout does. The only possible effect will be to decrease the number of customers that will complete a checkout.

That's why I'm against adding that pulldown."

mgkimsal8• 15 years ago

no retail cashiers, but point taken, and that sort of was the point - forcing people to make more choices - to think about stuff - opens up the chance for them to choose to not buy, and/or make mistakes.

Thanks :)

weego• 15 years ago

The user chose to be at this site, chose to pick an item to purchase and then chose to go into payment processing. The idea that suddenly an extra drop-down is going to outrage someone into questioning their entire choice-path is hugely unlikely, and infact the example here is a site that knows it's demographic won't be scared off by what seems at first glance to be a fairly ambiguous user input. If say Amazon tried this I would suggest their A/Bs would have this style of form failing for most demographics.

pbreit2• 15 years ago

I think that would be a terrible response. Without seeing test rests I'm not even sure no drop down is better considering it's entirely expected by users. Does something that insignificant really warrant such a snarky response? In fact the best stores that I go to always ask things like "did you find everything you were looking for?" before checking out.

seclorum• 15 years ago

> No one was pining for that functionality in 1995, but for some reason we got it, and every browser maker since then has seen fit to faithfully recreate it.

Ever done some real data entry? Serious data entry, that is, where its all you do, all day. Thats where the RESET button came from - traditional data entry jobs, which, without that button, just wouldn't be as productive.

I concur it doesn't belong on a typically-not-optimized-for-quick-entry web form, but I wanted to point out that it is really very useful if you are doing a ton of data entry.

budu3• 15 years ago

It looks great. I like it. I just wonder if too much javascript magic on a credit card processing form might make users feel uneasy about security.

mgkimsal8• 15 years ago

In what way? Most users don't ever think about "javascript" as a thing. It might alarm techies, perhaps?

ez77• 15 years ago

For what is worth, it alarms me that my bank doesn't let me access my account with javascript disabled...

Zev• 15 years ago

Be sure to read the comments as well; the guy who built the form for Square in the first place points out some other subtle details that the form has.

wnight• 15 years ago

It's an empty page.

Making beautiful forms; Square and Recurly

Related Stories