Experiment with simplified, interactive forms

Aim to make forms on your site as painless as possible. Put yourself in the customer’s shoes. Do you like filling out forms? Most people don’t. Look for ways to alleviate friction and simplify flows so that it’s easier to complete the process.

Reduce the number of required fields

The faster a form is to fill out, the less time there is to second guess a decision. More customers are likely to fill out and submit a simple form over a complex form.

Review each question you ask in your forms and decide what is absolutely necessary. Make those fields required to fill out. Anything left over is essentially “optional” at that point and you can:

• Remove these optional fields entirely to simplify the experience
• Leave these optional fields, but allow the prospect to leave them blank (not required fields)

Example: Longer form vs. shorter form

These two forms are for account creation. The first is from Sephora. It’s arguably not super long, but compared to the second form from Dermalogica, you can get a sense of how much easier it would be for a potential customer to fill it out.

Many of the items Sephora asks for could be removed and asked for after the account was created.

Try clickable answers, instead of fields

Think outside of the form field box and inject some life into your forms. Anything that saves your prospect time and effort is going to come across as a win. Try adding elements where visitors only have to click to answer, instead of entering info.

Clickable elements

When there are only a few answers the prospect might provide, try clickable elements instead of text fields:

• Sliders
• Buttons
• Images that act as buttons
• Radio buttons for lists of items
• Multiple choice checkboxes to select multiple items

Example: Mint Mobile (Desktop version)

To help potential customers find the right plan, Mint Mobile offers a little questionnaire that estimates the best plans to select from. Instead of form fields, they use buttons and a slider bar so that there are only two clicks to see the results.

Dropdown menus

Another option to consider is leveraging dropdown menus for selectable options. This can be useful for both a small list or a large list of options. For larger selections, dropdowns might present a cleaner design.

Example: Laseraway

In one iteration of their booking form, they’ve simplified the form by adding a dropdown menu to ask which type of service the customer is interested in.

Try showing a progress bar on longer forms

How excited do you get about filling out a long form? Instead, try having stages where you only present a few questions and include a clear indicator of how many additional stages are left.

While the end result increases the number of clicks, there are few key benefits:

• Each stage in the form is much smaller than the original form.
• The smaller form sections can be much less overwhelming. Whitespace is our friend.
• The progress bar offers a clear path to the finish line, which sets the right expectations and can seem quite reassuring.

Test out different designs to see which ones resonate most with your audience. Perhaps one version will test better with one audience and a different version will test better with the other audience.

Example progress bars:

Below are three flavors of progress bars (Policygenius, Capital One, and Debt Relief). The design should be inviting, match your brand, and include added context for the person filling out the form (i.e. “What’s the next step going to have me do?”).

‍