4

All about usability heuristic #2: Match between the system and the real world

 1 year ago
source link: https://uxplanet.org/all-about-usability-heuristic-2-match-between-the-system-and-the-real-world-693328620894
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

All about usability heuristic #2: Match between the system and the real world

Let’s count down the instances where we could have seen the violation of this heuristic principle -

Ever worked with a knob not working like-a-knob but like-a-button or something else?

Or if you’ve ever driven a car, recall the 1st time you encountered gears shifting work, how simple was that then?

Or encountered a dialog box in any app/software that was full of jargon that just went over your head?

All these above need reforms from the point of view of the “match between the system and the real world”!

But what exactly this heuristic implies?

0*Q_iizq64jpxJS9oj

Isn’t this the kind of cart you see on E-com as well? (Photo by Bruno Kelzer on Unsplash)

As per the NNgroup, Jakob Nielsen’s 2nd heuristic principle, “Match between the system and the real world” states “The design should speak the users’ language. Use words, phrases, and concepts familiar to the user, rather than internal jargon. Follow real-world conventions, making information appear in a natural and logical order.” Let’s break it down and understand -

A mature person blabbering around seems to be mad no? Either that person is truly mad or doesn’t care what I interpret and do. The same goes for your system design when it spurts out unfamiliar words, phrases, and concepts to users. It gives the impression that either your business doesn’t understand or cares about me, lack of empathy shows up. These negative user emotions consequently affect the business. Therefore this heuristic says “The design should speak the user’s language. Use words, phrases, and concepts familiar to the user, rather than internal jargon.”

In the era when we live more online than offline, we pretty much know everything essential to interact in the digital world. Still there occur some instances where your learning falls apart and you need to learn new things. How do you feel about it then? All of us love to be in familiarity. Learning new things is an added cognitive load, hence we may resort to alternatives that don’t demand much of our mental activity. So this heuristic says “Follow real-world conventions, making information appear in a natural and logical order.” This will shorten the learning curve of your system.

so what’s the benefit of using this in designs?

You can see this “Match between the system and the real world” heuristic upholding almost everywhere you feel design being invisible literally. It brings intuitiveness to your system and so the learnability enhances and so the usability. This all adds to the user’s trust in your business.

“Good design is actually a lot harder to notice than poor design, in part because good designs fit our needs so well that the design is invisible,” — Don Norman, author of “The Design of Everyday Things”

To hit this heuristic in your designs you should have an understanding of your user’s mental model, current ways of working, and their language so that you know how their real world actually is. And to be more precise, this real world includes all the past and current experiences users have with the physical or digital world.

who’s employing this heuristic?

Attaching down 3 good examples of where this heuristic has been used.

Example #1

1*OmYlCnbHTZEs89q3Li-zrg.jpeg

Amazon home screen with easy-to-understand labels and icons

Amazon — Send Money, Scan any QR, Pay Bills, and Keep shopping for, all these are more in the conversational language we use, and so quite simple to understand. And the bottom navigation bar consists of icons that we can relate to — Home, Profile, Cart, and Menu, which is all the evolution from skeuomorphism (a design concept that imitates the real-world look, feel, and interaction)

Example #2

1*uxmfoDJoL6QS07BAdvKdPA.jpeg

Scanning animation on Paytm

Paytm — Scan a QR and you’ll get a scanning animation that is, blue scanner rays moving up & down in a blue outlined box. Isn’t it similar to how we perceive scanning to be? This animation helps us recognize and act on it intuitively.

Example #3

1*VpEsnrqp80IRjFioCFT14A.gif

Spotify — Open the app and you’re welcomed with a card/banner. This is not an animation but a gesture I was performing. How cool it is no? It’s damn similar to how you’d swipe the card on a smooth table and throw it off the table


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK