It took me a while to understand what all the fuss was about. To me it is not immediately understandable that it's a mockup of a credit card's back. The reason? The proportions aren't right. The form is too wide and the corner radius is too short.
Having said that, it's a good concept.
Very nice. I'd suggest styling the select menus (even just giving them a background color, so they're drawn without the aqua). It'll probably let you bump the font size of them up too, which could push the billing zip in line with the CCV.
This is one of my favourite things I've seen on Dribbble. I hate that it seems so obvious now. I love when people think out of the box, but it ends up being something that we should have been doing all along.
38 Responses (page 1 of 2)
Working on some new payment UI.
over 1 year ago
Great implementation of a really common UI pattern. Well done. And welcome to Dribbble!
over 1 year ago
Thanks Jason! Happy to be here.
over 1 year ago
Yea this looks good Sean. I like how the labels are very subtle. People know what to do, no need to emphasize it.
over 1 year ago
Pro
Tim Van Damme
Brilliant concept!
over 1 year ago
I like how intuitive it is to fill out. welcome!
over 1 year ago
Pro
Brad Haynes
It feels like the back of a credit card, brilliant!
over 1 year ago
Wow, that's just genius!
over 1 year ago
Pro
Philip Renich
Just echoing everyone else here. Great work. More forms should be this intuitive, copying the physical card is brilliant.
over 1 year ago
Pro
Mat Marquis
Yeah, what everyone else said. Great approach, man.
over 1 year ago
That is just brilliant!
over 1 year ago
brilliant. seriously.
over 1 year ago
#win
over 1 year ago
Pro
Oliver Twardowski
Sean, this is by far the best credit card input form I've ever seen!
I'll definitely copycat your idea when I need it! :)
over 1 year ago
I see what you did there. win.
over 1 year ago
This looks awesome Sean! Think you just started a design trend.
great to see you on Dribbble, I just got drafted today!
over 1 year ago
It took me a while to understand what all the fuss was about. To me it is not immediately understandable that it's a mockup of a credit card's back. The reason? The proportions aren't right. The form is too wide and the corner radius is too short.
Having said that, it's a good concept.
over 1 year ago
Pro
Josh Hemsley
Wow yes... you my friend have just created a monster! Great concept!
over 1 year ago
Pro
Prekesh Chavda
i'm angry i didn't think of this,
brilliant!
over 1 year ago
Genius!
over 1 year ago
Pro
Clint Balcom
Very clever. There's a fair chance I, and others, will be <del>stealing</del> drawing inspiration from this in the future.
over 1 year ago
Pro
Jordan Singer
Sean, would you mind if I rebounded this with my mock-up of this awesome UI?
over 1 year ago
Rebound
Credit Card Form
by Jordan Singer
This is a mock-up of @seanami's Credit Card Form shot. Just added some text shadows, and other touchups.
over 1 year ago
Very nice. I'd suggest styling the select menus (even just giving them a background color, so they're drawn without the aqua). It'll probably let you bump the font size of them up too, which could push the billing zip in line with the CCV.
over 1 year ago
This is one of my favourite things I've seen on Dribbble. I hate that it seems so obvious now. I love when people think out of the box, but it ends up being something that we should have been doing all along.
over 1 year ago