User interface is really important

I came across a terrific little demonstration of why UI matters. You can go try it out right here: why interface matters from Bagaar.

I think it’s likely self-explanatory, but I’m going to expand on it just a bit. In a technical sense, there’s actually very little wrong with this form. However, even on just the front page….

• The default condition is either hidden, less prominent than a different choice, or set to the opposite of what you’d expect (you see this on the cookie notification and the terms and conditions).
• Error notifications & field requirements are below the form and not prominent.
• Instead of using labels or placeholder text, the form has default values which must be deleted before filling in your information. This is a problem both for accessibility and usability.
• The form divides up the email address into three fields unnecessarily, breaking the flow of filling it out and making it near-impossible to use a password manager to complete the field.
• The password includes arcane, pointless requirements (this is particularly common online)
• On smaller screens, the form is pushed down too far to see it at a glance (and in particular the password requirements)

Here’s the crazy part: there’s more wrong here that I haven’t mentioned, but all of the items above are things I’ve seen forms do in production environments, even from large companies.

It’s one of the reasons why, frankly, experience counts in setting up forms (and web UI in general). Bad or inconsistent UI frustrates users (I didn’t finish filling out this form even after a minute or so, and I’ve definitely set a username and password in less than 10 seconds, even when generating a unique 20-character password.

This is a great demonstration, and it’s worth your time to give it a spin.