Form style

13 Responses

1. Pro Sean Singleton

   Looks very clean Matthew... I don't know that I like the color on the actual dropdown button... Maybe use a red or other colored outline similar to what you have on "Name on Card" to denote an error?

   My $0.02 :0)

   almost 2 years ago

2. Pro Anton Kudin

   i think red elements should have dark red outline, the same way the green button has dark green 1px outline. right now its gray which to me looks odd.

   almost 2 years ago

3. Pro Corey Haggard

   Matthew, I am loving the idea and direction. I am however, @Sean. I love the border treatment you have for the form input fields.

   almost 2 years ago

4. Pro Matt Hamm

   Nice. How come "name on card" input has outside border and "card number" does not?

   almost 2 years ago

5. Simon Willans

   @Matt Hamm - it's after failed validation I'm guessing, and name on card is required.

   I'd be consistent with your styles of required fields. Both should go red, or both should go grey.

   almost 2 years ago

6. Pro Matthew Smith

   If you look at the tags, you'll see that "Name on card" is :focused, and then red denotes error :)

   @Sean, red is an error color, it's appropriate here especially considering the audience. Thanks for your input though :))

   almost 2 years ago

7. Anthony Armendariz

   very very slick.

   almost 2 years ago

8. Pro Philip Renich

   I think I'd buy anything with a form that purty :)

   almost 2 years ago

9. Simon Willans

   Ah, fair point - I retract my comments :P

   I'd probably go ahead and add a bit of a subtle texture and rounded corners to the error message. Seems a little bit mismatched.

   almost 2 years ago

10. Pro Tiago Pedras

    @Simon: I believe that Matthew added the sharp rectangle on the error to get more of the user's attention, letting him know that that's a "bad and important thing" and not a "rounded cool and sleek notice".
    The red just enhaces that, of course.

    almost 2 years ago

11. Pro Miro Keller

    While I agree on the attention grabbing issue, I also think a bit of refinement on that message would enhance the whole a little bit. My gut says I'd try to make the interior white with a very subtle grayish gradient, rounded corners and a thick red border, also with some subtle lighting... Just fantasizing....

    almost 2 years ago

12. Nick Husher

    Maybe I'll be going against the grain, but I think it's perfectly obvious what's going on here. My only concern is that, on the select fields, there's an awkward space between the end of the label and the beginning of the placeholder text. Perhaps centering or left-justifying the select box?

    almost 2 years ago

13. Pro Matthew Sanders

    Good start

    over 1 year ago