What is User Experience?

Agendao What is UX? o Cognitive frictiono UX myth bustingo Principles & tacticso Current Apps and Siteso Want to learn more about UX?

UX != UI

UX

UI/UXUI

UX != UI

UI

Design & Technology

Science & Research

UX != UI

CXUX

What is CX?

“How a person feels about interacting with a brand.”

What is UX?

“How a person feels about interacting with a product.”

What is UX?

“How a person feels about interacting with an application.”

What is its purpose?

Happy

Satisfied

Productive

Why do we care?• Word of mouth• Increase salesHappy• Increase loyalty• Less support requests• Ideas vs complaintsSatisfied

• AdvocatesProductive

What is UX?

“The measure of friction between a user and their goal.”

Types of Friction

Cognitive

Emotional

Cognitive Frictiono Needless brain activityo The brain’s CPU cycleso Conscious o Subconscious

Cognitive Friction Example• Legacy application• Slow performance• Increased complexity• No immediate

feedback• Difficult to use• Required hidden fields

Cognitive Friction Example• Increased performance• After user testing,

feedback indicated that users complained about the new system being slower and asked to have the old system back !?!!

Cognitive Friction Example• Visual noise• All fields shown by

default• A lot of scrolling• Navigation “helpers”

were ignored• Saved button not

visible

UX myth busting• Developers are thought to believe these myths• Incorrect or outdated information• Least at risk

o Web developerso Mobile developers

• Most at risk o Experienced developerso Enterprise developers

• Knowledge is power!

10 UX MythsCounting Clicks“The user should never have to click more than n times to do something”• We are not robots• They will click as long as…

o The cognitive friction is lowo They are getting close to their goal

• Clicks matter in highly repetitive taskso Why does the user have to do that so

much?

1

10 UX MythsWhitespace“White space is wasted space! We need to show the user as much data as possible”• Fear of whitespace comes from

o Days of terminals and low-res displayso The mythical “Power User”o Not knowing the user’s goals

• It can lower Cognitive & Emotional frictiono Helps the brain process the screeno Help user focus on goalo User is more relaxed

2

10 UX MythsScrolling is bad“Everything should fit on one screen. Users hate to scroll!”• Vertical scrolling is no big deal• Even users that say they hate

to scroll do it • Be careful with horizontal

scrolling3

10 UX MythsSmall details do not matter“It’s good enough like this. Let’s just ship it!”• Small details can dramatically

improve UXo Reducing the user’s frictiono Focusing the user’s attention on their goal

• Especially important if you are selling somethingo The $300 million button

• Visual details are registered by the braino Quality is skin deep – to the brain

4

10 UX MythsMore choices “The user may want to do this or that. Power users want it all!”• Presents roadblocks to users

o Instead of a straight path user faces forkso Choices can really raise Cognitive Friction

• Slow users down and make UI harder to learn

• Users will often say Yes to more choiceso Stop offering!o Give them one really good way to do

something.

5

10 UX MythsUsers make good choices“The user knows what they need. They will select the right option.”• Most decision making is

subconscious• Multiple choices can paralyze

the thought process• Some users just guess• Users may make choices that

lessen the UX• Low Cognitive Friction

6

10 UX MythsUsers know what they want“The customer is the king! They will drive the features and requirements.”• Want != Need• They will request more than they

can handle• People are horrible at estimating

the value of features• Beware of requests made in

group settings• Find out the user’s goal

7

10 UX MythsUsability > Beauty“Users just care if it’s usable. They don’t care what it looks like.”• Users judge the initial quality

and credibility by its appearanceo For web and mobile apps, users may

abandon them before discovering the good stuff

• Good visual design lowers Emotional Friction which improves the overall UX

8

10 UX MythsLet’s do it like…“Apple, Microsoft, Google, Amazon, etc. They spend billions on R&D!”• Amazon’s menu system may

not be appropriate for your application

• Do not follow them blindly• It makes sense when you are

integrating into their platform

9

10 UX MythsUX is a project step“The code is done. Let’s UX the UI and ship it!”• Improving the user’s

experience is a continual iterative process

• The earlier you start in the development process, the better results you’ll get!

10

Principles & tacticso Understand the user’s visiono How the brain “sees”o Individual tacticso Better togethero Incremental UX Improvementso Lower Cognitive Friction

Shapes• Breakdown items into a series of shapes• Match it to data encoded in memory• Review finer details

Applying Tactics

Shapes

Whitespace• A crowded UI requires the user’s brain to use

central vision which makes cognitive friction HIGH• Using whitespace allows the user’s brain to use

peripheral vision • It allows the brain to rest while processing the UI• It helps users focus on important information

Whitespace

Grouping• Make UIs easier to understand by grouping

information• Avoid crowded groups• Avoid repeating groups without visual separation

Grouping

Alignment• Misalignment increases Cognitive Friction• The brain can detect small misalignments• There are many alignment options• Be consistent• Align with reading direction

Alignment

Attention• Movement in peripheral vision is powerful• If user focus is needed

o Movement in peripheral vision will DISTRACTo Keep the UI CALM

• If the user attention is neededo No movement in peripheral vision will not ATTRACTo Use movement to get the user’s ATTENTION

• Signal important changes using subtle animations

Attention

Color• Clashing colors make Cognitive and Emotional

Friction HIGH• Avoid text/background color combinations

o Blue or Green Text on Red Backgroundo Red or Green on Blue Background

• Contract between text and background color keeps Cognitive and Emotional Friction LOW

Attention

Current Apps and Sites

Current Apps and Sites

Current Apps and Sites

Current Apps and Sites

Want to learn more about UX?

Want to learn more about UX?

Want to learn more about UX?

Thank you!