mobile & ux - in the eye of the perfect storm

Post on 17-Aug-2014

5.221 Views

Category:

Design

3 Downloads

Preview:

Click to see full reader

DESCRIPTION

Mobile & UX: Inside the Eye of the Perfect Storm The world of web application design is expanding at a rapid rate. We’re now expected to design great experiences across a huge variety of platforms, from small screens to large displays. The flood of iPad applications and successful online businesses are showing our executives that design matters. Why is all this happening now? Where is it all going? UIE’s own Jared Spool will show you how four driving forces—market maturity, the emergence of experience, Kano’s model, and Sturgeon’s Law—are increasing the visibility and value of design in organizations everywhere. He’ll show you what the next generation of design teams will look like and how you’ll get there. Jared will share: + When the emphasis of the marketplace shifts from features to experience and how not to get caught with a costly surprise + Why the best organizations go beyond designing for the users' activities and looks at their entire experience + How to ensure you're meeting basic expectations while integrating delightful components into your design

TRANSCRIPT

Illustrations by Jason Robb

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 1

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 2

MyCokeRewards.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 3

MyCokeRewards.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 4

FOX.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 5

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 6

MikePanetta.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 7

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 8

LCBT.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 9

Marriott.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 10

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 11

United

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 12

United.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 13

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 14

MyCokeRewards.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 15

MyCokeRewards.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 16

VerizonWireless.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 17

AT&T.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 18

Apple.com/iPhone

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 19

AirCanada.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 20

AirCanada.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 21

AirCanada.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 22

Boston.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 23

NYTimes.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 24

Sturgeon’s Law

90% of everything is crapAre your designs in the other 10%?

Are you considering the user’s perspective?

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 25

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 26

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 27

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 28

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 29

Altavista

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 30

Google

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 31

Accuweather

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 32

Umbrella Today

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 33

Umbrella Today

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 34

Air Canada

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 35

Air CanadaAir Canada

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 36

AirCanada.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 37

BART.gov

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 38

Amazon.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 39

Amazon.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 40

Amazon.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 41

BestBuy.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 42

BestBuy.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 43

BestBuy.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 44

Market Maturity

The features stage focuses on adding more into the design

The experience stage focuses on removing all but the essentials from the design

Is your market currently focused on technology, features, or experience?

Shifting from features to experience is the hardest thing an organization can do — and most fail

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 45

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 46

Six Flags: Mike Kazarnowicz, Joe Rollerfan (Flickr)

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 47

Disney World, Joe Penniston (Flickr)

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 48

Joanna8555 (Flickr)

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 49

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 50

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 51

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 52

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 53

Groupon

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 54

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 55

Grocon

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 56

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 57

Activities vs. Experience

Activities are discrete touchpoints with the users

Experience fills in the gaps

Mobile more often lives within the gaps

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 58

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 59

Investment

Delight

Use

r S

ati

sfa

cti

on

Frustration

Noriaka Kano

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 60

Shazam

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 61

Shazam

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 62

LimoRes

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 63

LimoRes

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 64

LimoRes

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 65

Google

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 66

Neutral Satisfaction

Use

r Sa

tisfa

ctio

n

Delight

Frustration

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 67

My CokeRewards

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 68

MyCokeRewards.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 69

MyCokeRewards.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 70

MyCokeRewards.com

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 71

Site

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 72

Investment

Delight

Use

r Sa

tisfa

ctio

n

Frustration

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 73

Kano’s Model

Three vectors: Performance payoff, basic expectations, and excitement generators

Have to meet basic expectations before excitement generators will work

Over time, excitement generators become basic expectations

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 74

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 75

Copy Writing

Information Architecture

Design Process Management

User Research Practices

Interaction Design

Information Design

Visual Design

Editing &Curating

Ethnography

Domain Knowledge

Business Knowledge

Analytics

Marketing

Technology

ROI

Social Networks Use Cases

Agile Methods

Storytelling

Critiquing

Sketching

Presenting

Facilitating

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 76

The Three Questions

Vision: “Can everyone on the team describe the experience of using your design five years from now?”

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 77

A flag in the sand…

…that everyone marches towards.

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 78

Easily moved when things change.

Everyone continues to march toward it.

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 79

The Three Questions

Vision: “Can everyone on the team describe the experience of using your design five years from now?”

Feedback: “In the last six weeks, have you spent more than two hours watching someone use your or a competitor’s design?”

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 80

Methods of Feedback

Usability TestingFive second testsTrade show/Cafe testingRemote usability tests

Field Studies

Customer SupportUser forums

Using it yourself (for self-designers)

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 81

The Three Questions

Vision: “Can everyone on the team describe the experience of using your design five years from now?”

Feedback: “In the last six weeks, have you spent more than two hours watching someone use your or a competitor’s design?”

Culture: “In the last six weeks, have you rewarded a team member for creating a major design failure?”

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 82

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 83

The Eye of the Perfect Storm

Invest to avoid Sturgeon’s Law

Focus on experience over technology and features

Fill in the gaps between the activities

Ensure you meet basic needs while you search for delighters

Build in a feedback process

Create your experience vision

Celebrate learning from taking risks

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 84

Free for Webvision Attendees

BillScott

HaganRivers

BrandonSchauer

KimGoodwin

LukeWroblewski

Greg & StephanieRewis

StevePortigal

Kevin Hoffman

UI16 On Demand VideosMobile Input

UX Leadership

Being Creative with CSS3

Multi-device Design Patterns

UIConf.com/giveaway

Mobile & UX - In the Eye of the Perfect Storm User Interface Engineering - www.uie.com

© Copyright 2012, User Interface Engineering. All Rights Reserved. 85

top related