0

How can I make a user understand a form?

I have a form which is quite complicated I am afraid. But I need to make the user understand what each field is for. Sure, there is a user guide for this system, but I don't want to make the user depended on that piece of document.

What is the best (and visually appealing) way to give the user the information? Should I add a paragraph of text in the beginning of the form? Or should I add a description to each field? Info-icon with tool tip or just plain text with input field? I am also afraid the user will drown in all information or info-icons.

How have you been solving this kind of issues?

Improve this question
3
  • Have you been through a sanitization process of seeing whether all the fields are still relevant, required and used? At the time the user is completing the form? I ask because we recently redesigned a 26 page adoption form, it was discovered during the analysis phase that portions of the form were not completed until a follow-up meeting and information had been gleaned from 3rd parties. Allowing us to cull 9 pages from initial completion.
    – DarrylGodden
    Jan 30, 2017 at 12:05
  • Ah, this form is not that extensive, thank god :) There is no more than 10 input fields for the user to fill out. The problem is that it is difficult to fill it out if you don't know exactly what to put in the fields, which they hopefully will, at least after using the system a few times. But still, it is important to let them know how it works and what it is for the first time as well. I guess the form needs information or instructions... in some way
    – efrethe
    Jan 30, 2017 at 12:14
  • 2
    Some things I can think of: clear labels, description if needed, tooltips, placeholders.
    – Alvaro
    Jan 30, 2017 at 12:50

3 Answers 3

Reset to default
2

The first thing I always go for in form design is chunking: is there a way you can break the form up into logical sections so that rules and definitions can be shared across a number of fields in one go? Break the form down into bite-sized pieces where your user can make use of the knowledge they have about on field to fill in a few more.

After that, I tend to look at the order the chunks are presented in: is there a logical progression in the way the information is requested? Try to make use of a natural progression to help the user understand what will be expected next based on what they are looking at now.

You can also help to reduce the cognitive load by making sure the interface is clear and not too busy - if you have the luxury you can also break your form into a few pages as long as the length of the page sequence and the users position within the sequence are clearly signalled to the user.

Improve this answer
1
0

@Andrew mentioned some goods points in his answer. Logical and natural progression are a must with complex forms. However, assuming you've already reached a point where the form is logically broken down as far as it can be, here are a few additional possibilities to consider:

  • If you have fields that are only necessary based on a user's input, then you could keep them hidden unless triggered. See :CSS checked pseudo class.

  • Rather than having a bunch of blue ? circles next to each field you could use hover-over tool tips. See CSS3 tooltiptext.

    NOTE: You would want to set the mouse-over trigger delay to approx. 1-2 seconds. As was stated earlier the users will eventually learn the form, they won't want the tooltips popping up every time they drag the mouse over the field. A simple note somewhere on the form to alert them of the tooltips is all you would need.

Improve this answer
0

Design patterns for tool tips, labeling, and progressive disclosure can only go so far without user research so I suggest you to do a quick usability test of those 10 fields with an actual user. Doing so will enable you to learn if the labels you're proposing work or if a particular design pattern would be useful in your situation.

Since it's specifically about form fields, you can create a rough prototype on paper (or a static prototype on Powerpoint) that you could show to an actual user. You might be surprised how such a simple idea works.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.