: How to create an eye-catchy and easy to use form? I have the following form (to the right), and my intent is that its: Eye catchy Simple to use We are not a professional designer, hence

@Chiappetta793

Late to the show, but here is what I would do:

First off, it goes against standard to ask for a full name, so I would split up the name field into first and last name fields.

Second, I would match the colors to that of the app. I'd drop the border and replace it with a gray border with a subtle dropshadow. That teal should be your action color, that way people know anytime they see that green, it is an actionable element (ie, buttons, filters, navigation, etc.)

Third, bring your font sizes up and make your fields a little bigger, this will make the form appear more friendly and inviting.

Fourth, make sure all the fields are the same size and distance apart, and make sure the form is centered.



I know I mentions this in a comment, but I'll leave more detail down here over the placeholder vs label argument.

Placeholders have specific places, they look great and can be very helpful when used right. It's important to not use solely a placeholder however. This is because many browsers ( and people not using javascript ) will not be able to see the form or the form's instructions.

Here is my example of your recreated form as well

Vote Up Vote Down

@Welton168

Here're a few suggestions for your UI:


Use a larger font size for readability.
Re-word the second sentence into a non-conditional sentence."Provide
the information requested below for early access to our platform."
Use "Sentence case."
Use place-holder information to prompt for desired responses.

Vote Up Vote Down