Eight steps to an intuitive UI

11/29/2016

Everett McKay UX Design Edgeeverettm@uxdesignedge.com, @uxdesignedge

A bold claim

UI design is an objective, principled form of human communication, not a subjective art!

11/29/2016

Searching for a definition—if you can’t define it, you can’t design it!

Intuitive UI definition

Everybody wants an intuitive UI

Having an intuitive UI is a top goal for any UX project

To users, describing a UI as intuitive is the highest praise they can bestow

Funny thing: nobody really knows what an “intuitive UI” is

11/29/2016

Some popular definitions

Are these useful definitions?

Simple, easy to use, better

Really “dumbed down” so any idiot can get it

An “unrealistically high bar” that most UIs can’t achieve

Familiar, easy to learn

Whatever Apple does

It depends—it’s personal and subjective

Not sure, but I know it when I see it—it just feels right

The dictionary definition is useless

A typical dictionary definition:

Instinctive (based on behavior or knowledge we are born with)

11/29/2016

My definition

A UI is intuitive when target users understand its behavior and effect without use of reason, memorization, experimentation, documentation, or training

More simply, an intuitive UI is immediately self-explanatory

Ever heard this one?

It’s intuitive once you learn it!

11/29/2016

A clear sign your UI isn’t intuitive

An intuitive UI shouldn’t need a manual or training

Why do you care?

The technology world has changed!!

Old world: Solve a problem well, people will buy your solution even if they need training

New world: People expect to figure things out immediately, without training or documentation

Reasons: They don’t want to—a new generation of users

They don’t have to—mobile apps are setting expectations

RTFM doesn’t work with modern software!

11/29/2016

Are you going to read the manual?

Mobile apps are setting UX expectations

Radical claim: Mobile apps are setting the UX quality bar and raising customer expectations

If I can use my $2 mobile app without training, why can’t my $20K business app be just as easy to use?

11/29/2016

How do I design thee to be intuitive? Let me count the ways

Intuitive UI attributes

The definition is a good start

We can determine if a UI isn’t intuitive just by applying the definition

But to make a UI intuitive, we need more

11/29/2016

Let’s consider the interaction lifecycle

Steps required for interaction—the user

Sets a goal

Finds an interactive UI that might achieve the goal

Performs the interaction

Observes the results to determine if goal is achieved

An intuitive UI helps users achieve their goal at each of these steps

Without the use of reason, memorization, experimentation, assistance, or training

Is this UI intuitive?

11/29/2016

From a health care professional job posting tool

11/29/2016

Intuitive UI is consistent

Consistency is crucial to being intuitive

Jakob Nielsen’s Law of UX (rephrased):

Users spend most of their time using software other than yours

But interaction consistency is far more important than visual consistency

Benefits of small improvements achieved through inconsistency are easily outweighed by the lack of familiarity

Q: What does the swipe gesture do in mobile?

11/29/2016

How do you deactivate this plugin?

Hint: We could be in the wrong place

The Design of Everyday Things

Donald Norman’s concept of affordance “If a door handle needs a sign, then its design is probably

faulty.”

My translation: If a UI needs a label to explain its interaction, the design has

failed

Users shouldn’t have to experiment to understand the interaction

11/29/2016

Is this intuitive?

11/29/2016

Does everything need to be intuitive? Surprisingly…no!

Strategically unintuitive

Now that we know what it means…

Most interactions should be intuitive

But some interactions just aren’t worth it

Let’s explore…starting with common excuses

11/29/2016

Our users are trained professionals!

Our users are experienced, trained professionals. You can't just walk up and use this product! This product isn’t for your mom!

So these experienced professionals need training to understand your confusing, unintuitive UI?

11/29/2016

But people learn all the time, right?

A common counter argument: people learn things all the time!

Yes, people can learn—but will they? And will they remember?

Having to learn is fine for advanced, infrequent, optional interactions

Do you want the success of your product dependent upon people learning for essential interactions?

11/29/2016

Common unintuitive UI

Advanced, infrequent, optional commands Might not be worth making discoverable

Shortcuts and gestures Not a problem if advanced and redundant

Inevitable discoverability Users can’t not find these

Delighters Experienced users are rewarded by finding them

Advanced modes You don’t want users to find these accidentally

Games and puzzles are unintuitive

We enjoy the challenge of solving them

11/29/2016

An intuitive Where’s Waldo?

Intuitive UI has a cost

Discoverability

May result in clutter, feature might be inappropriate for some users

Affordance

May look cluttered and heavy

Predictability

May require too much explanation

Forgiveness

Might not be practical or may harm performance

11/29/2016

Levels of intuitiveness

All users will get

Trained users mightremember

11/29/2016

What about “single trial learning”?

It’s reflected in the intuitiveness levels

Sensible Single trial, figured out on your own

Learnable Single trial+, somebody showed you

Guessable Multiple trials, figured out on your own

Trainable Multiple trials, somebody showed you

Yes, people do learn things, but the retention rate is very low

Often more like “Multiple trial forgetting”

Some UI can be unintuitive if strategic

…instead of accidental

Most unintuitive UI is accidental

Sensible and learnable are good alternatives

11/29/2016

How to make decisions and get your team on board

Intuitive UI in practice

A process for making design decisions

Grade the interaction (using Pass/Fail)

Don’t be surprised if any attributes are missing

Is the interaction critical?

Aim for fully intuitive

Is the interaction advanced, infrequent, or optional?

Aim for sensible or learnable if fully intuitive isn’t practical

Find a simple change to fix the problem

11/29/2016

Hiding a crucial interaction

Suppose your team is designing a new version of a popular operating system

An executive would like to hide the entry point for all program interactions

Exec says “our users get it—they don’t need the training wheels anymore!”

How do you decide?

11/29/2016

Let’s work it through

Grade the interaction (using Pass/Fail)

Not discoverable, FAIL!

Is the interaction critical?

Find a simple change to fix the problem

Keep on the task bar

10 things that don't require user testing

1. If you hide things, users won't find them

2. Users won't know something happened unless you tell them

3. Confusing labels are confusing

4. Nobody understands your custom icons

5. Users don't like to wait

6. Unhelpful help isn't helpful

7. …

11/29/2016

Fixing a top call generator

You file a bug to fix the UI for a top tech support call generator

Bug gets resolved as “Won’t fix—superficial cosmetic detail”

Dev refuses to fix it: “makes total sense to me!”

How do you get your engineering manager on board?

What won’t work

Claiming the problem is personal and subjective

Claiming it’s unfamiliar

Claiming it’s unintuitive

11/29/2016

What will work

Describing the problem with an objective vocabulary

Almost done!

Summary and wrap up

11/29/2016

If you remember only 5 things…

1. Don’t use the term “intuitive” without defining it

2. Instead, design for the eight intuitive attributes Discoverability, affordance, comprehensible, predictability,

responsiveness, efficiency, forgiveness, explorability

Don’t expect to be intuitive if any are missing

3. Intuitive UIs are self explanatory If a task requires thinking, memorization, experimentation,

assistance, or training, it’s not intuitive by definition

4. Consistency is part of making a UI intuitive

5. But not everything has to be intuitive

11/29/2016

Feel free to ask me questions

everettm@uxdesignedge.com

Lekker!

Eight steps to an intuitive UI

Design

OOUUTTSSHHIINNEE TTHHEE CCOOMM … · and 3X quieter performance. ASUS Exclusive Innovations STRIX-GTX1080-A8G-GAMING ... Tweak Till Your Heart's Content With an intuitive new UI,

Protecting Consumers in the Digital Currency Economy · Usability VIII. Develop platforms with a simple, intuitive, well-designed user experience and user interface (UX/UI). IX. Provide

3-inch Screen Fingerprint Time Attendance Terminal · 3-inch Screen Fingerprint Time Attendance Terminal Features Remarkable user experience • Intuitive and stunning UI designed

Mini MCR-SL-UI-UI

UV Activator · 2019-09-04 · UV Activator Attractive to water, Attractive to patients! Intuitive UI Power White – Ready to activate Red – Stand by mode Dimensions 13.8”(h)

The Hybrid Cloud Application Performance Playbook...intuitive UI that makes it easy to deploy and configure—whether in public, private, or hybrid cloud environments. And as your

Make Data Analytics UI Intuitive

300Mbps Wi-Fi Range Extender - static.tp-link.comUS) 6.0.pdf · · Universal Compatibility – Work with any Wi-Fi router Features · Intuitive Web UI – Ensures quick and simple

WEB DEVELOPMENT UI AND UX DESIGNING IT CONSULTANCY … · WEB DEVELOPMENT UI AND UX DESIGNING IT CONSULTANCY MOBILE APPS MARKETING & ANALYTICS SOFTWARE CENTRIC SOLUTIONS ... INTUITIVE

Signal Integrity Consulting€¦ · Original AEL code was implemented by Suhas Jawale! Signal UI Pre-pulse Noise UI Noise UI-1 Noise UI-2 Noise UI-3 Noise UI-4 Noise UI-5 Noise UI-6

Beta Presentation Mobile Avionics Weathercse498/2012-01/schedules/all...•Easy to use and intuitive UI (user interface). •Use of FAA flight charts instead of Google Maps Federal

Creare UI semplici, intuitive ed efficaci con la Pattern Library di Contactlab. Web Components in produzione

Threat Intelligence Management Practical Exercise · •Single appliance and simple licensing •Uncluttered and intuitive UI: ThreatScape™ •Wire-rate threat detection for complex

Digital Full Colour Multifunctional System MX … · • Google Drive, Google Cloud Print, Gmail, ... The intuitive Easy UI mode makes it easy for ... Thanks to their intuitive operation,

(:UUIUUIUIUIIUIUU u UI U UI UI u It UIUUIUUIUIS Sort out ...hawksscience.weebly.com/uploads/1/3/5/7/13575549/can_you_planet_f… · (:UUIUUIUIUIIUIUU u UI U UI UI u It UIUUIUUIUIS

XonTel XT-60/XT-120 PBX s - Amazon Web Services · XonTel XT-60/XT-120 Overview ... BRI Trunk ... Intuitive and graphical UI brings point-and-click configuration

Implementing Multi-Touch Gestures with Touch Groups and ...rkros/papers/TouchState_CHI2019.pdf · be counter-intuitive and error-prone, particularly when the UI involves custom gestures

SimMeme: Semantic Based Meme searchbrity/docs/simmeme_demo.pdf · system’s intuitive UI. Subsequently, we will review the results and the explanations for their selection and ranking

Q2 2020 Intuitive Investor Presentation - Intuitive Surgical

lennlQ3 Clear & bright 5 HD IPS display Classy metal …...Intuitive Wiko UI including battery tips, widget and settings Large memory space to install multimedia contents Game changer