[rorrr2]

The main problem, and many designers make that mistake, is that you're modeling a physical thing inside an app for no good reason.

Other than the nice visuals it doesn't help anything.

As a designer, you should think of how to make the process of entering the CC more efficient and less distracting, so your conversions don't go down the drain.

A simple clean design with standard input fields will outdo your pretty design any day of the week.

p.s. Does your design even work if JS is disabled?

[josho]

> The main problem ... is that you're modeling a physical thing inside an app for no good reason.

There is a very good reason to model the physical card. On the assumption that most folks enter their CC information by taking the card out of their wallet & copying the information from the card into the form. Then for those folks following the physical object makes it easier for the user to locate the expiry date & CCV code on the back.

I assume that folks like us that use CC auto-fill tools are a minority. And yes for us this is totally unnecessary.

PS. Do any non-tech savvy people disable JS? And if so, why?

[jarek]

The number of people who don't know where the CVV code is located is dwarfed by the number of people who are roughly familiar with their card and would instead be confused by an unfamiliar-looking form.

You learn where the CVV is the first time you successfully buy something online. You learn how this specific form design works the first time you enter a website that uses it. Which do you think is going to be happening more frequently?