When I tried to register for the first time in the site www.surveymonkey.com I come across a few interesting UI pattern.
www.surveymonkey.com registration form
Few interesting things about this form design,
- Labels are bold, prominent and right aligned.
- Input box blue border and light yellow background attracts the user’s eyes towards the where they to act on.
- Clear inline help messages (Up to 50 characters, no white space). It’s for better than allowing people enter data with white space and then while submitting the form giving an error message.
- Font size clearly show the importance of the text.
- The horizontal gray line is guiding the user that the to portion is the area where the user has to enter data and the bottom area is to act (Click).
- Links are prominent, clear, bold and blue in color.
- “Create a new account” button is definitely have more importance than the cancel button. The yellow color is playing its role to convey the importance to the users.
One more interesting helping mechanism is, if you try to click anywhere on the page (without entering data in any of the form fields) it immediately changes the text box border color to red.
One more interesting helping mechanism is, if you try to click anywhere on the page (without entering data in any of the form fields) it immediately changes the text box border color to red.
Tags: UI-patterns
I found this post while surfing the net music lyrics. Thanks for sharing I’ll be back regularly.
This is a great site. Good clean interface and nice informative articles. I will be coming back in a bit, thanks for the great article.
This post was very nicely written, and it also contains a lot of useful facts. I appreciated your professional way of writing this post. Thanks, you have made it very easy for me to understand.
I was just browsing for relevant blog posts for my project research and I happened to stumble upon yours. Thanks for the excellent information!