So you have a form, and you want to make it 'good'. Where do you start?
There are many checklists on the internet. InformIT has a nice general one about web forms. Make use of that and your form should definitely improve. A List Apart always has high quality entries and their article on usable forms is no exception.
Alternatively you could work by steering clear of what makes a form 'bad'. For example, here are 5 ways to make sure that users abandon your forms.
Maybe a government-sanctioned approach is more your liking. The Australian Government Information Management Office, or AGIMO, outlines best practice for putting forms online. The third entry on this page of better practice guidelines is the Australian National Audit Office (ANAO)'s suggestions for producing user-friendly government forms.
In addition to these high level checklists, there is plenty of detailed design advice. For example, there are articles on:
- Whether to use colons;
- Where to place field labels; and
- How to manage character limits in free-text fields.
But how does one make sense of all these different instructions? What's needed is an overarching model that can be used to direct all forms design activities and from which these other guidelines can all be derived.
The 4 Cs of Good Form Design
Formulate Information Design has developed just such a model. We call it the 4 Cs of Good Forms Design. We explain the model this way.
Forms make most people cringe. Why? Because forms are generally boring and painful.
Do they have to be this way? Yes and no.
Forms are a bit like going to the dentist. Both are necessary evils. A good dentist, like a good form, shouldn't cause you any pain. But neither are likely to ever be much fun.
So what is it that makes a form painful? Take a moment to reflect on what you don't like about doing your taxes. Tax forms are typically a great illustration of what aspects of a form's design make it painful. They:
- are confusing
- are long
- are burdensome and
- rarely just 'work' and make sense.
Therefore, if a form's characteristics are the opposite of these, it should be painless. These positive characteristics are the 4 Cs:
- Clever and
The 4 Cs in detail
Let's look at these charactistics in a little more detail.
In this context, we define clarity as
the form-filler understanding, with minimal effort, what to do with the form as the designer intended.
A very simple illustration appears in Figure 1 below. In asking for income information, the survey has failed to say whether the amount should be gross (i.e. before income tax) or net (i.e. after income tax). No doubt the resulting information was a mix of both, rendering it essentially useless.
Clarity is influenced by many things, including but not limited to the language used, layout of the form and actions that are available to the user. When designing these components, you are aiming to marry the purpose of the form with the perspective of the form-filler. It is for this reason that it is so important to have an in-depth understanding of your specific users and the context of use.
Another very important approach for enhancing clarity is consistency. Consistency (e.g. of language, layout and actions) makes the form predictable and learnable. Humans are very much creatures of habit - we act in the future according to our experience of the past. A predictable form therefore fits very well with our way of working.
Conciseness is about gathering the required information in the most efficient way possible. Consider the question shown in Figure 2, from a market research survey:
The more concise way to ask this (double-barrelled) question would be just:
How many children do you have?
As another example, this part of an online Medicare form breaks the address into too many input fields.
A word about conciseness and length
Many people mistakenly believe that a good form is short. They aim for the fewest possible number of pages or screens and the least number of questions.
However, quality is not linearly related to length. This is because things that add length, like questions tailored to different circumstances, often improve the experience for the person filling out the form.
Take the following question from a previous Australian e-Tax form as an example. Perhaps attempting to keep the form as short as possible, the designers have created a complex question that I certainly had to read twice:
A less confusing approach would have been to ask the direct questions:
1. Since your last notice of assessment, has your family name changed?
If yes, go to 3.
If no, go to 2.
2. Was your family name shown correctly on your last notice of assessment?
If yes, go to 4.
If no, go to 3.
3. What family name was shown on your last notice of assessment?
This may make the form seem longer, but the task of filling it out is greatly simplified. Moreover, when it comes to electronic forms, like e-Tax, space is not at a premium as it is for printed forms.
Therefore, we strongly recommend against using counts of pages, screens or questions as a measure of a form's quality.
Making the form clever reduces the workload for the user.
The most basic level of cleverness comes from "sequencing". Sequencing is the process of directing the user around the form, skipping questions that don't apply to them. The revised tax question above uses sequencing to ensure that only those people whose family name in the current tax form is different get asked about their family name on the previous tax form.
Forms intelligence really comes into its own in the electronic realm. Here, sequencing can be automated, inputs can be restricted (e.g. number of children must be at least 0) and many other smarts, like calculation of totals, can be built in.
Forms that aren't smart are not only burdensome, they are frustrating. Consider the screenshot shown in Figure 5. Here the form has not realised that the address the user entered is exactly the same — barring capitalisation — as the address found in their database. Making this connection would have saved the user a step (and possibly some hair).
Finally, a good form works with the form-filler, i.e. is co-operative.
Being co-operative is all about stepping into the form-filler's shoes, and doing what will make the experience better for them. Specifically, co-operative forms:
- manage expectations
- match the user's mental model
- provide definitions and explicit boundaries
- give background information and explanations and
- are consistent but flexible.
In the electronic medium, being co-operative is also about:
- confirming before submission, and allowing modification and
- being bug free and stable.
In other words, co-operative forms don't frustrate!
In the example below, the designer was not being particularly co-operative when they left out almost half of Australia's states and territories, namely the ACT, Northern Territory and Tasmania. Worse still, they use the terms "metro" and "regional". These terms are well known by market researchers but not consistently understood by the general public. If I live in one of Australia's biggest country towns, Orange, do I answer metro or regional?
A better option may have been capital city versus rest of state. Another option would be to ask for the user's postcode, and let the backend system work out the relevant category.
This example highlights how being co-operative is often about providing extra information, so that the form-filler and the form designer are "on the same page". Ideally, such contextual information is built into the question. For instance, in Q1 of the revised tax form example above, context comes from the words "Since your last notice of assessment".
In the next example (Figure 7), the extra information is about why the question is being asked. It's a good idea to provide such information when asking questions that may seem, to the form-filler, to be overly intrusive. In this case, during their Gmail sign up process, Google provides a good explanation of why they ask for a secondary email account.
Being transparent and inclusive in this way can improve not only data quality, but response rates as well. Recently I declined to complete a supporter feedback survey for a charity because they asked for a lot of personal information up front, with no explanation of why.
This is just the beginning
In this article we have only just introduced the 4 Cs of Good Form Design. There is much more that can be said about each of the 4 Cs and how different form design principles relate to them.
Over time, we hope to write much more about the 4 Cs and evolve the model. In the interim, we're very interested to know whether you find the 4 Cs a useful approach for critiquing your forms. Please be sure to get in touch with us with any questions, queries, comments and suggestions you have.
Postscript: 2 June 2009
We weren't joking when we said that we wanted to evolve the 4 Cs model.
Late last year Formulate presented 4 Cs at a conference. One of the delegates who attended the session suggested that instead of the original "contextual", the broader concept of "co-operative" might be even more suitable. We thought about it and tested the idea against several real-life cases, and decided it was a better way to go. Co-operative encompasses context but also other key facets of the experience, like ensuring the form-filler is always in control.
As such, we have just updated the model, and thus this article, to have the fourth C be co-operative. We hope that like us, you find this makes the model even more complete and useful.