I really enjoy filing out forms. I know this sounds masochistic, but the structure really interests me. Collecting information is important to companies and their doing so is absolutely irrelevant to me. A few days ago I wrote about gambling as the ultimate user experience. You enter, throw your money at the casino, and walk out happy even after they rob you blind. Filling out forms is the anti-casino. You basically stand to gain very little, you have to deal with spam, concerns about privacy, and the absolute drag of filling out the forms themselves. Even if you’ve already signed up you may or may not remember your password (assuming you’re even using different passwords for different websites!) not to mention your screen name. There is absolutely nothing about this process that is even a little bit interesting. It’s dry, boring, and annoying. For those reasons, it’s also fascinating.
How can we make filling out forms similar to the casino?
The answer– Feedback
My old job had an elevator with a concave button that was flat. It detected your finger’s pressure, but it didn’t move inward; rather, it stayed static. Theoretically, a light should have appeared to indicate the elevator was on its way, but the system was old and the light probably burned out in 1986. This meant that I pushed the button frantically for several seconds and still had no idea if it worked or not. Couple this with the once-a-month elevator outage, and you can only begin to imagine out absolutely frustrating it was to use this elevator. The designers had absolutely no interest in designing anything that would help the people who actually took the elevator. The button didn’t press inward. Meditate on that for a moment. It was a flat surface. It’s akin to having your fingerprints taken. You push down on a hard surface; nothing happens. Additionally, the button didn’t have an up or down arrow. It was a small building with only five floors, but if you’re on the 3rd floor and you want to go to the 5th, all you can do is call the elevator. This added to the confusion. Finally, there was no outside indication of where the elevator was currently. If you’re on the ground floor and you see the elevator is on the fifth floor, then you know you’re going to wait longer than if it’s on the second floor. Without an indication, the design was even more flawed.
At my girlfriend’s office, the elevators aren’t so old. The buttons have a rubbery texture. They’re convex. They light up with an up/down arrow depending on which button you push. As soon as you push the button in, the button itself lights up. The elevator tells you what floor it is currently on so you know what to expect. In short, her elevator gives feedback.
Forms should mimic the elevator at my girlfriend’s office, but instead many are built like the elevator at my old office.
The easiest way to provide feedback is to show that a section has been completed accordingly. If, for example, each blank field is initially red and then once complete it is green, then the user can see clearly what must be provided and where to correct mistakes before they hit the submit button. This is just one example of feedback. More creative examples include parts that move depending on completion. Imagine, for example, a runner on the left side of the screen with a finish line on the right side of the screen. There are five blanks fields to fill in, and after each is filled the runner gets closer to the finish line. This level of feedback shows where the user is and also gives them motivation to complete the form. This is a similar technique to many of the gameification techniques.
There are two really excellent books on this subject.
Luke Wroblewski’s book “Web Form Design: Filling in the Blanks” and Caroline Jarrett and Gerry Gaffney’s “Forms That Work”. I have yet to read Wroblewski’s book although I’ve heard excellent reviews. “Forms that Work” is an interesting book and the website for the book is equally educational. I recommend them both.