Introduction to Mobile
User Experience Design
Anthony Hand, M.S.I.
Sr. Mobile User Experience Designer, iSkoot
anthony.hand@gmail.com
Sponsored by

About Anthony Hand
 M.S.I. in Human-Computer Interaction,
University of Michigan, 1999
 (e) anthony.hand@gmail.com
 iSkoot
Sr. Mobile User Experience Designer

VOIP/IM software for mobile phones

www.iSkoot.com

 Formerly at:
Nokia Enterprise Solutions

SavaJe Technologies (mobile OS platform)

 Solo project: FloSpace
www.FloSpace.com

First product: FloPrompter

 An innovative & affordable teleprompter for your PC
October 17, 2007 Introduction to Mobile User Experience Design 2

Let’s Get Acquainted
 Workshop’s Target Audience
 Who are we?
What brings us here today…?

Roles include documentation &/or

design?
October 17, 2007 Introduction to Mobile User Experience Design 3

Agenda
1. Mobile Industry Overview
• The Mobile Value Chain
• Introducing “Smartphones” and “Feature Phones”
2. Design Philosophy
• High level design mantras
• What is the mobile experience?
3. Mobile OSes Compared
• Concepts and examples
• Design tools
October 17, 2007 Introduction to Mobile User Experience Design 4

Agenda: What Else…?
Additional interest areas beyond the
agenda?
October 17, 2007 Introduction to Mobile User Experience Design 5

Apologies
Apologies in advance for all of the jargon…
And try not to memorize everything…
October 17, 2007 Introduction to Mobile User Experience Design 6

Special Thanks
 DocTrain East
For sponsoring today’s workshop

 iSkoot
For lending phones

October 17, 2007 Introduction to Mobile User Experience Design 7

Introduction to Mobile User
Experience Design:
Mobile Industry Overview
Anthony Hand, M.S.I.
Sr. Mobile User Experience Designer, iSkoot
anthony.hand@gmail.com
Sponsored by

Who are mobile users?
Common images of mobile users…
October 17, 2007 Introduction to Mobile User Experience Design 9

Who are mobile users?
Increasingly important in developing world
October 17, 2007 Introduction to Mobile User Experience Design 10

The Telecomms
Industry
 Extremely competitive, dynamic chain:
Regulators, operators, manufacturers, ODMs, OS

vendors, developers, content providers, users
 Extreme regional variation
2/2.5G, 3G, 4G

Service availability

Usage: SMS example

 GSM vs. CDMA
GSM countries: day vs. night/weekend phone

 Developing world leapfrogged to mobile
 More cameraphones sold than standalone digital
cameras
 These dynamics can impact your design &
documentation…
October 17, 2007 Introduction to Mobile User Experience Design 11

The Operators
 1000 wireless network operators worldwide
They’re not “carriers”

 Highly Competitive
Driven by ARPU & Brand

Example: Phone and content portfolios

 Control Freaks
Fear becoming “dumb pipes”

 “Walled Gardens”
Design requirements

 Example: Verizon
VOIP

 Distribution
Phones (US, Japan)

Software: “On Deck”

 Conservative
Tier 2 or 3 carriers more adventurous

October 17, 2007 Introduction to Mobile User Experience Design 12

The Regions
W.
APAC Japan Americas EEMEA
Europe
• • 47M in 2006 • 282M in 2006 • 175M in 2006 • 185M in 2006
301M in 2006
• • Mature • US: driven by • Up 7% YOY • Up 21% YOY
“Wild West”
• • Replacements • Tighter
TV: S. Korea market: replacements
• • 16% growth in
Ultra low cost 10.9% for features, competition in
unit growth: growth, Latin America fashion ultra low cost
• Cost sensitive: • Moto Pink
India, China, 4Q06 over market
Philippines 4Q05 subsidies RAZR: 2005
• China: Pen • iMode • Operators Xmas Must
• Operators  • No subsidies
input control phone
devices distribution
Gartner, “Market Share: Mobile Devices, 4Q06 and 2006”
October 17, 2007 Introduction to Mobile User Experience Design 13

The Manufacturers
2006 Wordwide Mobile Device Sales by
Manufacturer
2.4
6.3
7.4 16.2 Nokia
11.8 Motorola
Samsung
Sony-Ericsson
LG
BenQ
21.1 Others
34.8
990 million phones shipped in 2006
Over 1 billion expected for 2007
Gartner, “Market Share: Mobile Devices, 4Q06 and 2006”
October 17, 2007 Introduction to Mobile User Experience Design 14

The Users
 Audience brainstorm!
“Where does the revenue come from?”
October 17, 2007 Introduction to Mobile User Experience Design 15

The Users
Where does the revenue come from?
 Handset sales
 Accessories
 Ringtones: $600M US
UK: Crazy Frog outsold Coldplay 4:1

Ringbacks

SMS: >1 trillion messages

Games

Music

Data

TV: E.g., VCast

VOIP: Threat?

October 17, 2007 Introduction to Mobile User Experience Design 16

What are non-
smartphones?
Mass market mobile
phones
Called “Feature

Phones” as a category
Less processing power

Less memory

Smaller screens

Usually support Java

third party apps
Less capable PIM

More affordable

October 17, 2007 Introduction to Mobile User Experience Design 17

What’s a
“smartphone”?
“A full-featured
mobile phone
with personal
computer-like
functionality.”
(Wikipedia)
“Open OS”

 “Native” installable
applications
PIM

Email

Browser (xHTML)

Expensive

October 17, 2007 Introduction to Mobile User Experience Design 18

The Smartphone OS
Market
2006 total: 80 million
Source: Sony-Ericsson, Canalys
October 17, 2007 Introduction to Mobile User Experience Design 19

The Killer App
What’s the killer app for mobile phones?
Voice!
Nothing should compromise that.
October 17, 2007 Introduction to Mobile User Experience Design 20

Introduction to Mobile User
Experience Design:
Design Philosophy
Anthony Hand, M.S.I.
Sr. Mobile User Experience Designer, iSkoot
anthony.hand@gmail.com
Sponsored by

Making a Call
Small group brainstorm:
You are a mobile phone designer on a
new device.
Your user: “I want to call someone.”
How are you going to help your user
make that call successfully?
(Yes, that’s wiiiiiide open…)
October 17, 2007 Introduction to Mobile User Experience Design 22

Making a Call
1. Call Logs: Allow you call a recent number, a
missed number.
2. Voice Command: Car or handsfree
3. Long press: Speed dials
4. Shortcuts: On screen or special keys
5. Integration with other apps: Call from a
received SMS; call a number in a web page.
6. Time of Day: always call spouse after work
7. Visibility: Need a bright screen to see in daylight
It’s all about CONTEXT…
October 17, 2007 Introduction to Mobile User Experience Design 23

1. Context is King
social
task
temporal
environmental physical
October 17, 2007 Introduction to Mobile User Experience Design 24

2. My Mobile
 Devices are personal
 Enable customization
Work with phone themes

 Use built-in security
 Be relevant
Setting a Phone Lock (BlackBerry)
Celltop Gadget Client (Brew)
Phone themes (S60)
October 17, 2007 Introduction to Mobile User Experience Design 25

3. Unleash the UI
 Mobile devices have limited UI capabilities.
Poor stock UI components compared to desktop

No pointer (for most)

Lists rule

 But there’s plenty of room for innovation!
ZenZui:
Zooming UI, gadgets
EQO (IM product, Java)
iPhone touch gestures,
“bare essentials” UI
October 17, 2007 Introduction to Mobile User Experience Design 26

4. Degrade Gracefully
 Optimize the UI for more capable devices
 Be prepared to adapt the UI for less
capable devices
Calendar on Nokia 9300
(S80 platform)
Motorola RAZR
V3m Calendar
Calendar on Nokia E61
(S60 platform)
October 17, 2007 Introduction to Mobile User Experience Design 27

5. Dive into Data
Data connections are reliable

More people are signing up for data plans

Work offline (if possible)

Be sensitive to data costs

Plan for unexpected data connection loss

The corporate directory ::
Nokia Business Center on Nokia 9300
Google Maps (Java)
October 17, 2007 Introduction to Mobile User Experience Design 28

6. Mobile Mashups
 Unlike a PC, core apps were made for mashups
Telephony, Contacts, Calendar, SMS, Camera

 With data connection, innovative services
 Bluetooth to other devices, services
Traffic Came Viewer
(FlashLite) NextCode
Yahoo! Go on iPhone
(Camera, Client, & Web Services)
(Web + Telephony)
October 17, 2007 Introduction to Mobile User Experience Design 29

7. Head Where Puck is Going
 Know what today’s devices are capable of…
 But start thinking about tomorrow’s devices
GPS, WiFi, LBS, Bluetooth, Gadgets, Flash, Haptics

Google Maps ::
Internet radio :: 3D Tilt-a-World::
GPS + Data
WiFi connection, Flash UI Camera angle
as input
October 17, 2007 Introduction to Mobile User Experience Design 30

8. Remember the Classics
 Keep in mind the core design principles
For example, Jakob Nielsen’s Ten Usability

Heuristics
http://www.useit.com/papers/heuristic/heuristic_list.html
Also: Edward Tufte, Alan Cooper…

October 17, 2007 Introduction to Mobile User Experience Design 31

9. Engage!
 Remember that mobile applications must
be engaging (like all successful apps!)
 User-Centered Design process is essential!
 My favorites…
Breakdown Game Mobile.News.com
Music & video
(Java) (Web)
to go!
October 17, 2007 Introduction to Mobile User Experience Design 32

The Mobile Experience
End users see this:
October 17, 2007 Introduction to Mobile User Experience Design 33

The Mobile Experience
But the reality is much more complicated…
Hardware Operating Operator Client Network
System Customizations Software
• Memory • Stock UI Controls • Features • Availa-
• Device & App
bility
Customization
• Screen • Design & Nomen. • Brand & Business
Conventions Requirements • Access
• Service
• Qwerty vs. not
Integration
• Security • Distribution
• Battery & Signal
• Themes
• Installation
• Ergonomics
• Upgrade
•Key size
• Administration
•Reach & layout
•Feel in hand
•Speakers
Where does one layer end and the other begin?
October 17, 2007 Introduction to Mobile User Experience Design 34

The Mobile Experience
 “It’s not a PC!”
 Designers and companies want to offer as
PC-like an experience as possible
So many limitations…

 Advanced users are also expecting more &
more robustness
But it’s still a phone above all else

 Where to draw the line?
 10. Focus!
October 17, 2007 Introduction to Mobile User Experience Design 35