As a developer I can appreciate that dealing with user input is a pain. Dealing with anything messy humans do is always more annoying than handling nice clean inputs from an API. Developers and designers are human too, and they should think about the experiences they are creating, and how a little bit of consideration for the user can turn a frustrating process into a moment of delight.
- Required fields: Indicate visually when a field is required, and ask yourself if the field is actually required for what the user is trying to do (delight them and they’ll come back and share more information incrementally). Especially in a world of security leaks I like to minimize what I share and you should help with that.
- Formatting (phone and credit card numbers) is irrelevant: Should I enter my cell as (425)-555-5555, 4255555555, 425 555 5555 or something else? Actually all of those should be valid as it doesn’t take much effort to strip out spaces, dashes and brackets when you’re validating a credit card or phone number. If you need a particular format for your database or display then re-format it… but don’t force the user to comply with a rigid structure to make your life easier.
- Don’t be redundant: Don’t make me tell you what type of credit card I’ve entered the number for. Using a simple issuer lookup you can tell me if I just entered an Amex or a Mastercard. If you need me to write an look-up API for you I will, just leave a note in the comments.
- Passwords are a pain to remember: Just because you think the password rules on your site are obvious (at least one capital, one digit, only special character is an underscore and it must start with a different letter than your username) users have lots of passwords. Give them a reminder next to a where they have to enter it what those arbitrary rules are, ideally on initial entry and as an absolute must if validation fails.
- Don’t ask me the same thing twice: In the US a ZIP code can tell me the City and State. Same in Australia or New Zealand or the UK and pretty much anywhere else. Can anyone explain to me why I have to enter both 90210 and Beverly Hills, California on a million forms? By all means display the City/State for me to confirm but don’t waste my time asking me to do a computers job. That thing I said about look-up APIs earlier, still true
- Don’t be forgetful: Computers are good at remembering stuff, if developers are not being lazy. If I fill in a field or check a box on a form and something goes wrong with validation the only field I should reasonably be expected to re-enter is the password (and if you validate that and it passes assume I know my password and don’t make me rekey those asterisks again). If I checked “accept Ts&Cs” or “Don’t email me crap” the first time… I probably meant it so don’t forget it because I didn’t get my phone number in exactly the format you like.
- On-the-fly, context sensitive validation is awesome: Make use of onchange and onblur events and Ajax to check each field as I go to save the user scrolling up and down a page to find what failed. Basic validation, like credit card checksums, for fields that are easy to miskey should not require a full form submission
- When things go wrong, show me: When you finally get to a full round trip validation and have to show the user some errors you need correcting don’t just bundle some obscure messages at the top of the page – use visual cues and clear explanations to guide them to get it right
By making the process simple and eliminating points where the user can stumble your helping ensure that your form is not a roadblock where the user might get frustrated and abandon the process. When you go to the supermarket you look for the shortest line, or the easiest way to checkout, and you get frustrated if the process isn’t smooth. It’s just the same on the Web.
Even if you think you’ve gone beyond the things I mention above have you gone far enough? Are you watching your logs and other telemetry to see what fields users are stumbling on? Could you streamline the process further?
Your challenge: As designers and developers you should embrace the opportunity to streamline your users experience, and use every tool at your disposal to deliver a great user experience.
