Let’s Talk UI Design: Heuristic 9, Help Users Recognize, Diagnose, and Recover From Errors

Annnnd we’re off!

Ladies and Gentlemen today we’re gonna be talking about Jakob Nielsen’s Heuristic 9:  Help users recognize, diagnose, and recover from errors.  I’ll be using Beats Music’s sign up form as the example of choice.

So, recap:

Help users recognize, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.” 

beats

Umm….if there is an error, then the people need to know it.  Don’t over-complicate it, seriously.  Highlighting the text box with the error and saying “Oops, wrong password” is more than enough.  Or, even just highlighting the box and using an “X” if that is effective.

Beats Music smoothly used this heuristic in their login form above.

Let’s say for example a user inserts just the first part of his or her email address (sayianfred@, that’s it).  Once the user hits the sign up button the email box glows a bright red outline (excellent contrast), a bright red exclamation point appears (Recognition Rather Than Recall) followed by an off-white message stating that a valid email address is required.

That’s all that’s needed.  With this information the user quickly registers the error, checks his or her email address in the highlighted box, and effectively correct the mistake.  Flawless.

So…why’s this important?

People are not wired for reading, nor do they like being confused.  A mile-long paragraph dictating that “The inserted query did not register correctly in database 52BLAH BLAH BLAH” is useless to a user.  Above all, that’d make them feel stupid.  People do not want to feel this way.  As a designer it is up to you to answer a user’s error with only the feedback that’s necessary to recover from the error.

——User First, Designer Second——

Check this Out: 13 Tenets of User Experience

Alright guys I found this pretty interesting.

Check out this post about the 13 tenets of User Experience

This post dishes out some interesting info by UX Professional  .  He writes about 13 tenets he’s come up with in the last 13 years!

Seriously, it’s awesome!

Go Check These Out! Some Posts on Usability Testing and Usability Inspection

Guys and Gals, I’d like you to go check out my friend Kavin’s blog on Usability Testing Metrics.  I thought this was a great blog to keep in your arsenal just in case you forget what kind of information you’re trying to gather from Usability Testing.

Alternatively, if you wanna evaluate your interface yourself or gather some more useful data first then check out my bud Josh Sarver’s post on Cognitive Walkthrough, Streamlined Cognitive Walkthrough, and Focus Groups.  This single post can give you an awesome rundown of each method.

Let’s Talk UI Design: Heuristic 7, Flexibility and Efficiency of Use

IT. IS  COLD.

Just thought I’d get that off the chest here.  Hello again everyone!  Today we shall be discussing the seventh heuristic in Jakob Nielsen‘s 10 Heuristics of User Interface Design:  Flexibility and Efficiency of Use.  So this time I’ll be using Facebook as an example.

Ok, so to recap:

Flexibility and efficiency of use

Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions. “

facebook

Some people have more experience than others.  Allow shortcuts in your design for these people, because they know what they need and how to get to it.  Facebook keeping you logged in, or even messaging a friend on Facebook are two good examples.

Now as much as I have with Facebook, this heuristic was excellently put into play.  On your personal profile page, Facebook provides a Friends tab where you can find your friends and do whatever you need (checking profile, shooting a message).  It’s an excellent tool, one that Facebook really thrives off of.  OK, so let’s say I just wanted to send a friend a message.  Instead of diving in click after click to find my friend in the Friend’s tab I could use this nice right panel Facebook has so nicely provided for me that takes one, maybe two clicks.

This is a perfect tool for me, as I am a seasoned Facebook user who really only comes to Facebook for one or two items.  Now, for those who have different goals than I do may use the Friends Tab, but for me who is a user focused on what I need I have the flexibility to choose.

Alright, so importance?

Users are different.  Some users are savvy with an interface, some are not.  Some users have one set of goals, others have a different set.  As a designer, it’s important that you understand that inside your target audience will lie users of these categories.  You cannot design something for everyone, but you can design something effectively for users in your target audience on both sides of the spectrum.

 

——User First, Designer Second——