How to design a user form

User form - you must have seen them and i am sure you have filled them one time or the other. If not online on a website then i bet you must have filled them in front of the shopping mall or applying for a new bank account or new credit card. User forms are a convenient way to capture and grab the user details and there needs. Forms are used when business does not have the time to spend individual man hours with each costumers, when similar type of information needs to be collected from the user's.

In this article i will help you create a form keeping in mind the business perspective. I will see that the usability is take care at a high level, to take care of usability of the form i will write another article. Loading so much information in one is not good - as INFORMATION OVERLOAD or human memory 6+-2 concepts in User experience design.

Business need: As i told earlier that the need for form comes into picture when the business feels that they are not in a position to apply 1 on 1 human resource to capture the details from its costumers. Business can either request its user to fill the forms online or offline.

As a designer how would you go for the form design for a particular process? Think on this question and it will lead you to conduct a FOCUS group or a meeting with the business process owner to understand the flow of the information that will be collected using the forms. Now let us create a step by step process to get the FROM right as per the business need.

Xylo





Step 1: Understand the business need

Step a meeting with the SME (Subject matter expert) who is working on the process for which the form creation is requested. You can write an e-mail setting up the business context and the questions which will help you to gain more information. A sample e-mail would look like this.

----------------------------------------------------------------------------------------------------------------------------------------------------

Business context: We are planning to create a new form for your XYZ process. This form will be available online where users can fill it. This information will be collected by your department and processed.

Questions:

1. What is the key peice of information that is importnat for your departemnt to process the requests

2. What information are not mandatory

3. Define the whole process by taking a sample example. The complete methodology would be helpful.

----------------------------------------------------------------------------------------------------------------------------------------------------

Step 2: Business Scenarios definition

The business scenario needs to be understood, as the form that will be created should be able to suffice all the possible business scenarios.

Step 3: Form flow

Give value to the form flow, what sections of the form should come first and how the information flow should be there. Give emphasis on the hierarchy of the sections.

Key take aways for usability

I will be writing a separate article on form usability. I would like to suggest some key pointers that will make the form usable and take care of major usability issues.

1. Information grouping : Group the information in larger chunks, for example when you are asking the users about his details we can have these sections

> Tell us about yourself - name, age, gender

> What u do - profession

> Where do u live - address, street, ZIP, state country etc

> What u like - reading, playing etc

2. Make it a talk show: Use phrases that seems like a person is asking these questions to the users. Above the personal information - TELL US MORE ABOUT YOURSELF etc will increase the intrest level of user's.

3.Pagination: Use pagination if the form is too long.

4. Progress bar at top will help a lot if the form is long.

I think my purpose is solved here, to emphasis on the point that the form should match the business flow not vice versa. The information collected by the forms should be used by the business. If business does not need it, avoid including that field in the forms.
Post a Comment