Published on <a href="https://blog.prototypr.io/the-secret-to-designing-intuitive-products-d5be54228526?source=rss----eb297ea1161a---4">| Prototyping: From UX to Front End &mdash; Medium</a> Yazin Akkawi <img alt="" src="https://cdn-images-1.medium.com/max/1024/1*cGp85qYO50y7a7JiAspnFg.png">
<h4>What does “easy-to-use” or “user-friendly” or “intuitive” even mean?</h4>
In today’s business landscape,<a href="https://www.inc.com/yazin-akkawi/how-technology-has-given-design-a-new-meaning.html"> design has gained traction</a> as a key factor for success. From the commoditization of technology, to lower barriers to competition, design has become a <a href="https://www.inc.com/yazin-akkawi/4-highly-successful-ceos-say-this-is-what-drives-b.html">bottom-line investment</a> because of it’s ability to help brands differentiate and become more competitive. Good design:
<ul>
<li>helps companies improve brand equity — creating a visceral reaction and an <a href="https://www.inc.com/yazin-akkawi/why-emotional-intelligence-is-far-more-valuable-th.html">emotional connection</a> through beauty and simplicity.</li>
<li>drives intent — connecting products to customers’ needs and wants.</li>
<li>captures attention — translating information into effective communication.</li>
</ul>
Good design also helps make things “intuitive” and “easy-to-use.” But what does that really mean? We often hear these words in reference to products and services that require minimal training and mental effort.
<h3>The secret to intuitive UX? Mental models.</h3>
Question: when you see a photo on a social media app, what would you do to zoom in?
For me, it used to be double-tapping, a learned behavior from my use of other social media apps like Facebook. So when I first used Instagram about five years ago, I can’t tell you how many times I tried to zoom in on a photo by double-tapping.
So hypothetically speaking, if you attempted to zoom in on a photo of your ex-girlfriend with her new boyfriend, you would have accidentally “liked” the photo instead. That wasn’t hypothetical for me, unfortunately.
Double-tapping used to be the most common convention for zooming into a photo, until that convention was broken by Instagram.The reality is, if you’ve made this mistake too, it’s not your fault. It’s the designer’s fault for neglecting to take your mental model into consideration.
A mental model is a critical component of product design. According to <a href="http://www.wjh.harvard.edu/~lds/index.html?carey.html">Susan Carey</a>’s 1986 journal article, Cognitive Science and Science Education, a mental model “represents a person’s thought process for how something works (i.e., a person’s understanding of the surrounding world). Mental models are based on incomplete facts, past experiences, and even intuitive perceptions. They help shape actions and behavior, influence what people pay attention to in complicated situations, and define how people approach and solve problems.”
Good design aligns a product or service with its customers’ mental model — what users know (or think they know) about how things work. When a user’s mental model is disconnected from reality, they get frustrated, disengaged or, in my case, embarrassed.
<h3>Design makes products conform to users’ mental models.</h3>
Obviously, designing products that conform to users’ mental models requires first understanding them. Surprisingly, from my experience running a <a href="http://mstq.io/">design firm</a>, I’ve seen too many instances where companies create solutions based on their own mental models rather than their customers or users.
Remember, mental models are not at all based in facts, but rather, perception. There’s only one way to uncover mental models, and it’s to go straight to source: the customers themselves.
One of my favorite research methods to do so is <a href="https://www.google.com/url?sa=t&amp;rct=j&amp;q=&amp;esrc=s&amp;source=web&amp;cd=3&amp;cad=rja&amp;uact=8&amp;ved=0ahUKEwiTj6KQo4DZAhUmzIMKHQNXBX0QFggvMAI&amp;url=http%3A%2F%2Fwww.usabilitybok.org%2Fcontextual-inquiry&amp;usg=AOvVaw3D6OUpqHAekvYuCI4A-1OO">contextual inquiry</a>, which combines interviewing techniques with ethnographic observation, you can not only observe a user’s behavioral patterns, but you can get a sense of their expectations as well. It takes a little planning upfront, but can be organized fairly quickly and inexpensively.
<a href="http://boxesandarrows.com/card-sorting-a-definitive-guide/">Card sorting</a> is another research technique that many designers use to illuminate the mental models of their target users. This method can also be done completely remotely using digital tools like <a href="http://www.optimalworkshop.com/">Optimal Workshop</a>. It’s most effect for developing an overall layout of information, be it a website navigation, menus, and possible taxonomies — all things that are usual suspects to what creates confusion.
But not all mental models are uniquely subjective. People who have even the most rudimentary understanding of interfaces share a basic expectation of where components should be located and how they should function. Some examples include shopping carts, buttons, text links and search boxes — components that are consistent across most all interfaces.
While my intention is most commonly used to identify mental models of digital interactions, these two methods can also be used to generate suggestions of how to organize any service or physical space.
<h3>Design clearly communicates what users should expect.</h3>
In the <a href="https://www.amazon.com/Design-Everyday-Things-Donald-Norman/dp/1452654123">Design of Everyday Things</a>, Don Norman introduces the notion of affordances in design, applying a term that, until then, had never left the realm of psychology.
An affordance describes the relationships that individuals perceive within an object or an environment. A bottle screw cap affords twisting. A hinged door affords pushing or pulling. A staircase affords ascending or descending.
Language plays such an important part of setting expectations for users. An input field that asks you for your “Full name” affords entering your name into it. Language provides clear guidelines on not only what you should be doing, but also what you could be doing. Entering letters, like your name, is different than entering numbers, like your phone number and you can tell which one you’re able to do by the context of the text.
Familiar, metaphorical patterns that imitate real objects are also used to communicate expectations. For instance, an email doesn’t require an actual envelope — it never has — and neither do settings require dealing with gears. But we’ve grown to associate those visual cues with the action in both the physical and digital world.
What’s even more important than signaling what you can and should do with a product, is what can’t do. Negative affordances can be thought of as specifically indicating a blocked action, such as when you have an inactive button or a button that looks inactive. The most common instance of this is when a button or a link is greyed out.
You’re probably wondering “OK, I have supporting language, metaphorical patterns and negative affordances, but how do I know if it’s working?”
Here’s the key: a <a href="http://practicaluxmethods.com/product/visual-affordance-testing/">Visual Affordance Test</a>. Simply put, print out your screens and ask test users to highlight what they believe to be clickable, and moreover, what each click does. 10–20 tests will suggest where the faulty affordances lie.
<h3>Just take the first step.</h3>
There are several methods for gaining deeper insights into mental models, and I’ve only outlined a few. For most teams, methods like card sorting, basic immersion and time spent evaluating affordances will suffice. In any case, taking the first step if you suspect that erroneous mental models exist is most important.
This article was originally published <a href="https://www.inc.com/yazin-akkawi/the-secret-to-designing-intuitive-products.html">here</a>.
<iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2Ff51076%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2Ff51076%2F&#038;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252Ff51076%252F%253Fenpose&amp;key=d04bfffea46d4aeda930ec88cc64b87c&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0"><a href="https://medium.com/media/b85dfbb5286d8a25cf2e754b9462cf45/href">https://medium.com/media/b85dfbb5286d8a25cf2e754b9462cf45/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=d5be54228526" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou">
<hr>
<a href="https://blog.prototypr.io/the-secret-to-designing-intuitive-products-d5be54228526">The Secret to Designing Intuitive Products</a> was originally published in <a href="https://blog.prototypr.io">Prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.

The Secret to Designing Intuitive Products

What does “easy-to-use” or “user-friendly” or “intuitive” even mean?

Top Stories