Consider this scenario, you complete a form, click on submit button and the system show all sorts of errors that you made while filling out the form. As shown in the screenshot below, there are two obvious issues with displaying errors so late and in such format.

Adeel Javed - UX Patterns For Enterprise Applications

  • First, it is not immediately obvious which fields are causing the error message, so you need to go through each field to investigate.
  • Second, the error messages are not helpful e.g. in this case which field has an invalid format, is it the phone or email or both?

So in order to avoid such infuriating scenarios, follow the patterns listed below.

Instant Validations

Perform instant validations (upfront) on all fields instead of delaying errors and waiting until the end when the user is ready to submit. This helps users in making sure that everything is in order as they are filling the fields.

Adeel Javed - UX Patterns For Enterprise Applications

Descriptive Messages

If you are not providing inline error messages, then make sure your error messages are detailed enough to point to the correct one. This way at least users know exactly where to go in order to resolve the issues.

Adeel Javed - UX Patterns For Enterprise Applications

Both patterns help reduce time spent on resolving issues and avoid the frustration that comes with not knowing what’s wrong.

Want to learn more about UX Patterns? Download your copy of “UX Patterns for Enterprise Applications” here.