Providing Sufficient Information In Validation Errors

Nearly all web usability experts agree that validation should happen in real-time, while the user is inputting data.  But the technique doesn’t guarantee a pleasant user experience.

Take this hypothetical project management app as an example.  I can enter a Project:

Next I add a task to my project:

Oops, the software doesn’t want me to enter a due date for the task after the Project’s due date.  That makes sense, but if I don’t remember the Project’s due date, then I have to go back to a different screen in the software, lookup the date, and then try to enter a task once again.  Talk about frustrating.  Let’s save the user that frustration by providing the date in the validation message:

That’s better.  Now the user knows exactly what needs to be done to correct the data and move on to the next task.

Although this is a big improvement, I would rather help the user avoid entering bad data in the first place.  Nobody likes to be told by angry red text that they’re doing it wrong.  Let’s try showing tips next to the fields as she fills them out:

Ah, this I like.  The tone here is less “you did it wrong” and more “keep in mind”.  Most brands would probably want the language to be a bit friendlier, but you can see that this is already much better than where we started.

You may be thinking that is really obvious stuff, and you’d be right.  But I very recently ran across an application with the exact problem that we started out with.  So while there are a lot of buzzwords in UX to talk about, it’s the basic, everyday experiences that deserves most of our attention.