Wai Law's profile

A neat form UI

A neat form UI
Admittedly forms are a bit dull and users are non too fussed about completing them unless they really have to.  However, they serve a purpose and can play a big part in the success of your business.  With a bit of planning and the right interaction you can inject some fun into this tedious task.

Take the referral form below.  The objective is clear here, we want the user to part with names and emails of their nearest and dearest.  In return we offer an incentive.  In this case they'll receive a small gesture of appreciation.

The Challenge
Create a form that allows the user to submit multiple referrals at the same time.
Refer a friend incentive content
The Solution
We create a neat little interface using some jQuery which allows the user to add further referrals on the click of a button.  We have also included a 'remove' button incase the user changes their mind or has made a typo.  The fields are kept to a minimum to for ease of completion.  Only the most important data is required.
The experience is further improved by adding an option of the user to reset the form if needed.  Simply add a 'reset' link which prompts an alert to make sure, this is really what the user wants and if it is they click ok and the form will be quickly cleared of all data.
Clean, simple and effective
Make it easy for your user to complete forms.  Offer them an incentive if it's relevant and only extract the primary information that is needed.  Make the form fun and functional with a direct journey and also a way to voluntarily end the journey.
A neat form UI
Published:

A neat form UI

Published: