6. Our plan for today…
8:30am - Noon
What makes mobile UX different?
Two Design/Mobile UX Exercises:
• Identifying Mobile Needs
• Ideating in the Wild
Noon – 1:30pm - LUNCH
1:30pm – 5:30pm
Mobile prototyping essentials
Three Mobile Prototyping Exercises
• Storyboarding
• Practice Ruthless Editing/Translating GUI to NUI
• Creating an In-Screen Prototype
7. 8:30am - Noon
What makes mobile UX different?
Similarities and differences between
designing for web and mobile
Three most important attributes of
great mobile experiences
A set of mobile design principles
Three mobile design activities
8. 8:30am - Noon
What makes mobile UX different?
Similarities and differences between
designing for web and mobile
Three most important attributes of
great mobile experiences
A set of mobile design principles
Three mobile design activities
9. 8:30am - Noon
What makes mobile UX different?
Similarities and differences between
designing for web and mobile
Three most important attributes of
great mobile experiences
A set of mobile design principles
Three mobile design activities
10. 8:30am - Noon
What makes mobile UX different?
Similarities and differences between
designing for web and mobile
Three most important attributes of
great mobile experiences
A set of mobile design principles
Three mobile design activities
19. Seated in a relatively predictable environment
Large screen enables multi-tasking
Keyboard and a mouse for input
19
20. Seated in a relatively predictable environment
Large screen enables multi-tasking
Keyboard and a mouse for input
20
21. Highly variable context and environment
Small screen size and limited text input
UI takes up the entire screen
Difficult to multi-task and easy to get lost
21
29. Even in situations in which aa spirit of
Even in situations in which spirit of
exploration and freedom exist, where we are
exploration and freedom exist, where faculty
free free to experiment to work beyond physical
are to experiment and work beyond physical
and social constraints, our cognitive habits
and social constraints,
our cognitive habits often get in the way.
often get in the way.
Marshall McLuhan called called it
Marshall McLuhan it “the rear-view
mirrorrear-view mirror effect,” noting that
“the effect,” noting that “We see the world
“We see the world through a rear-view mirror.
through a rear-view mirror. We march
We march backwards into future.”
backwards into the the future.”
43. “The rapid development of cell phones is killing
early cell phones much faster than it's killing any
of the early, older legacy technologies.
I think that is a real principle... something you
have to understand if you're going to be in this line
of work. It's very romantic. It's very fast moving.
You are building dead lumps of plastic.
When people come out and they show you an
iPhone, or an Android... they are showing you
larval versions of something much more
sophisticated.
The world you are building right now is the ground
floor for something much larger -- and the soil
beneath that ground floor is violently unstable.”
Rapid Evolution
-- Mobile Monday Amsterdam – November 2008
43
53. Lessons Learned from Web
We borrowed broken models.
Too focused on tactics.
We confused the solution with the need.
We didn’t focus on what the web
could do well.
55. Design Principles
Uniquely Mobile
Mobile is a unique & different medium
- focus on what it can do well.
Technology can guide, but should not
be the focus.
Focus on needs instead of tactics and
solutions.
62. Design Principle: Uniquely Mobile
Focus on what mobile can do well
• Small form factor • Gesture
• Limited battery • Sound/Voice
• Inconsistent network • Image/Video
access • GPS
• Vast and unpredictable • Animation
contexts of use • Facial Recognition
• Highly personal • Sensors
• Microphone and
• Touchscreen
Speaker
68. Research Techniques
INVASIVE
Prototype
Deprivation
Testing
Study
Diary Studies Contextual
interviews
RESEARCHER RESEARCHER
NOT PRESENT PRESENT
Online
Survey Shadowing
Traffic Shop Alongs
Studies
LESS INVASIVE
68
69. Research Techniques
INVASIVE
Prototype
Deprivation
Testing
Study
Use Two Techniques
RESEARCHER
Diary Studies Contextual
interviews
RESEARCHER
NOT PRESENT PRESENT
Online
Survey Shadowing
Traffic Shop Alongs
Studies
LESS INVASIVE
69
70. Solution Speak…
Solution Need
Database of Dr. Names Find a Doctor near me
Map Get from point
A to Point B
Calendar I need to know what
may happen
Email I need to
communicate
Facebook Updates I need to feel connected
LinkedIn I need to manage my identit
Search I need to find information
70
107. Your Design Challenge!
How might Starbucks use mobile devices to
improve their customer experience?
107
108. Your Design Challenge!
Step 1: Identifying Needs
1. Divide into groups
2. Head to the nearest
Starbucks.
3. Observe mobile users in a
mobile context
4. Develop a list of
customer needs based on
your observations using the
needs worksheet.
30 Minutes
108
109. Your Design Challenge!
Step 2: Sympathy to the mobile context
1. Head to the streets
2. Ideate in the wild –
Create 2-3 concepts
based on the needs
your team identified
30 Minutes
109
122. Look inside
the book
Add to cart
Shipping! Free two-day
shipping
REALLY! Get it new
Look inside OR used! Collectible!
the book
Sell mine
Maybe a kindle!
122