Seeing Outside the Box: Why Parts of Your Design Are Invisible Lisa Fast, Neo Insight December 10, 2014

2 © Customer Carewords Ltd. customercarewords.com Task 5 – Cloning Does Microsoft support producing multiple copies of a Windows Embedded POSReady 2009 image, using cloning? Task Performance Critical Issues TPI = 0 Median time on task (sec) = 162 Target time on task (sec) = 30

3 © Customer Carewords Ltd. customercarewords.com

Seeing Outside the Box Why Parts of Your Design Are Invisible

Lisa Customer Carewords Partners

Great designs are focused on supporting tasks …

Visual designs can support or sabotage tasks

Apply Digital Psychology To Support Tasks

Perception Gestalt Principles predict what people notice

Financial managers Human resources managers Purchasing managers Insurance, real estate and financial brokerage managers Managers in health care Financial auditors and accountants Financial and investment analysts Securities agents, investment dealers and brokers Other financial officers Civil engineers Mechanical engineers Electrical and electronics engineers Petroleum engineers Information systems analysts and consultants Database analysts and data administrators Software engineers and designers Computer programmers and interactive media developers

Financial managers Human resources managers Purchasing managers Insurance, real estate and financial brokerage managers Managers in health care Financial auditors and accountants Financial and investment analysts Securities agents, investment dealers and brokers Other financial officers Civil engineers Mechanical engineers Electrical and electronics engineers Petroleum engineers Proximity Principle

Financial managers Human resources managers Purchasing managers Insurance, real estate and financial brokerage managers Managers in health care Financial auditors and accountants Financial and investment analysts Securities agents, investment dealers and brokers Other financial officers Civil engineers Mechanical engineers Electrical and electronics engineers Petroleum engineers Similarity Principle

Managers Financial managers Human resources managers Purchasing managers Insurance, real estate and financial brokerage managers Managers in health care Finance Financial auditors and accountants Financial and investment analysts Securities agents, investment dealers and brokers Other financial officers Engineers Civil engineers Mechanical engineers Electrical and electronics engineers Petroleum engineers

Managers Financial managers Human resources managers Purchasing managers Insurance, real estate and financial brokerage managers Managers in health care Finance Financial auditors and accountants Financial and investment analysts Securities agents, investment dealers and brokers Other financial officers Engineers Civil engineers Mechanical engineers Electrical and electronics engineers Petroleum engineers Computing Information systems analysts and consultants Database analysts and data administrators Software engineers and designers Computer programmers and interactive media developers Common Region Principle

Managers Financial managers Human resources managers Purchasing managers Insurance, real estate and financial brokerage managers Managers in health care Finance Financial auditors and accountants Financial and investment analysts Securities agents, investment dealers and brokers Other financial officers Engineers Civil engineers Mechanical engineers Electrical and electronics engineers Petroleum engineers Computing Information systems analysts and consultants Database analysts and data administrators Software engineers and designers Computer programmers and interactive media developers Common Region Principle

Excperpted from 100 Things Every Designer Should Know about People,Susan Weinschenk Risk: Boxes Influence Perception

Proximity Page is a Common Region No Similarity

Common Region Proximity

 Perception What we notice  Attention What we focus on

Attention – will you notice something unexpected?

h?v=IGQmdoK_ZfY Daniel Simons on You Tube at: See also:

50% don’t see it “We experience far less of our visual world than we think we do….” - C. Chabris, D. Simons, ‘The Invisible Gorilla and Other Ways Our Intuitions Deceive us’ “We experience far less of our visual world than we think we do….” - C. Chabris, D. Simons, ‘The Invisible Gorilla and Other Ways Our Intuitions Deceive us’

75% think they will notice

100% of web designers think you will see everything

Inattentional Blindness: focus attention on the expected

What IS expected? Next step of task is on BODY of page 2006, Nielsen F-Shaped Pattern

1. Perception +Box is a separate region +Box isn’t in close proximity +Box looks dissimilar 2. Attention + Box is in unexpected location = Invisible

Errors dropped 75% - Applied Similarity (Color) & Proximity

 Perception What we notice  Attention What we focus on  Memory What we remember consciously and unconsciously…

Q: What do ‘other sites’ do that impacts behaviour on your site?

Behaviour ‘primed’ by ad exposure

“There’s nothing obvious telling me this is somewhere I could report a fraud.”

Ignored in the past = less likely to see in the future

Tullis Study 1: Messages with and without Images A B C D From: ‘Are People Drawn to Faces on Web Pages’

Heatmaps (red = most time looking)

Least ‘Box-Like’ = More Looks & More Successful Clicks Total Number of Fixations Total Fixation Time (secs) Number of Clicks Per Design

Focus Attention on the Task & Direct It Tullis, Siegel & Sun 2009

1. Perception +Task step in a box 2. Attention + Box is in unexpected location 3. Priming + Box looks like an ad = Really Invisible!

What to do?

1. Apply perceptual principles appropriately

2. Recognize you have illusions about attention

Challenge your illusions sign up at whichtestwon.com

Think about what’s expected

3. Avoid using images for task steps

4. Avoid anything that looks like an ad

5. Most important: test test test

Now go check your site for:

53 © Customer Carewords Ltd. customercarewords.com Thank you customercarewords.com WWW.