Skeuocard

It's very good, but the OCR font is going a little too far for me.

Perhaps existing forms make you select the type of card as an extra check.

I really like this EXCEPT for the awful image loading. It should preload the images up front as a single sprite and swap them in and out as needed.

Upvoting because this is so beautifully executed and I'd love to see people test this out on their checkout process.

That said, my experience indicates that this is not going to convert well.

To mirror the author's own quote:

"Every question a user has to ask themselves during the checkout process is another reason for them not to complete it."

What's presented here is a drastically different experience from the norm.

It doesn't behave the way you'd expect if you've ever bought anything else online.

Beyond that it has to load images dynamically based on card type which, on a slow or interrupted connection, will create even more confusion.

I love the concept, I love the execution, I just don't think this is going to be a conversion driver.

But I'll test it anyways.

It's a cute interaction, but for credit-card forms you want to be obvious rather than cute. Showing all the fields a user expects to fill out instills confidence and prevents questions like "where do I input my name and card expiry date?" "what about the security code?" "where is the billing address?" etc. People would typically not start filling out their credit-card details with those doubts in their minds.

One additional nitpick - it says "YourBank" at the beginning, so while I was aware this was supposed to a credit-card form because of the title of the submission, it can also be mistaken for a bank account number submission.