This document provides an overview of trends in mobile 2.0 and handset user experience from 2009-2010. It discusses the rise of social components, location-based services, and AJAX technologies in mobile applications. Usability guidelines emphasize ease of use, user research, and iterative design. Emerging platforms for social networking like Facebook Mobile are examined, along with examples like AroundMe. The document concludes with predictions about the growth of touchscreens, cameras, application stores and other mobile technologies.

1. Introduction to Mobile 2.0 and
Handset UX Trends: 2009-2010
Prepared for:
NCS Public Presentation
23 March 2009
Prepared by:
Scott Weiss, Executive Director

2. 2
Not Mobile 2.0

3. 3
Not Mobile 2.0

4. 4
Not Mobile 2.0

5. 5
Not Mobile 2.0

6. 6
Not Mobile 2.0

7. 7
Not Mobile 2.0

8. 8
Mobile 2.0
Social Components
 Networking
 Chat, instant messaging, commenting...
 Uploading photos and text (user-generated content)
 Presence
Localised Content
 Awareness of place
 Sharing of place content
AJAX
 Highly interactive widgets
 Animation
 Exact placement of graphics & widgets
 “Same page” UI (rather than lots of round-trips)

9. 9
Usability
Ease of use
By design
 Know your user
 Iterate designs before coding them
By research
 Ask users what they like and do not like about your concept
 Prototype the concept
 Ask users to do things with the prototype
 Observe their struggle and iterate the designs

10. 10
Mobile + Social Networking = ?
Benefits Challenges
Location-Awareness Privacy
Camera Availability Low Photo Quality
Constant Availability Input Awkwardness
Frequent Access Short Access Times

11. 11
Mobile Products in the Market
Nokia’s Ovi
Google’s Dodgeball
Facebook Mobile
 Mobile web, SMS, and photo upload features
MySpace
Gypsii
 gypsii.com/m
 Windows Mobile, Blackberry, and S60-based location-aware
social networking
BuzzCity’s MyGamma
 http://mygamma.com/
 WAP-enabled mobile social networking

12. 12
Mobile Facebook
Three UI’s available:
 Mobile application (native)
 Mobile web site
 Full web site, adapted to mobile
Mobile (native): Mobile Web: Desktop Adapted:
• Attractive/clean • Straightforward, sloppy • Messy, with high graphics
• Out of date with Facebook • Fewer features than desktop • Most desktop features
account site • Full advertising
• No stickiness • No advertising

13. 13
Mobile Facebook
Three UI’s available:
 Mobile application (native)
 Mobile web site
 Full web site, adapted to mobile
Mobile (native): Mobile Web: Desktop Adapted:
• Attractive/clean • Straightforward, sloppy • Messy, with high graphics
• Out of date with Facebook • Fewer features than desktop • Most desktop features
account site • Full advertising
• No stickiness • No advertising

14. 14
Mobile Facebook
Three UI’s available:
 Mobile application (native)
 Mobile web site
 Full web site, adapted to mobile
Mobile (native): Mobile Web: Desktop Adapted:
• Attractive/clean • Straightforward, sloppy • Messy, with high graphics
• Out of date with Facebook • Fewer features than desktop • Most desktop features
account site • Full advertising
• No stickiness • No advertising

15. 15
Gypsii
 Downloaded the link to my Blackberry
 Couldn’t log in...
Gypsii: Sign In Gypsii: Surf Around

16. 16
MyGamma
 Signup was straightforward
 First step was to text ‘GAMMA’ to 82772
 Got the link, went to the web site.
 The video tells the rest...
Sign Up Content Sample

17. Mobile Social 2.0 Tips
Focus on the user experience first
 What do mobile users want from a social networking product?
 How will their use differ from their desktop use?
 Design the mobile site
 And test it thoroughly!
Then think about monetisation

18. Localised Content and Usability
Allow user‐entry of city,
neighborhood, ZIP code,
intersec8on, or selec8on from a
map… Or even by landmark
Relying on today’s slow and
unreliable GPS can be
frustra8ng for the user
Some8mes people want to
localise where they are going
rather than where they are

19. 19
A Particularly Good Example: AroundMe

20. 20
A Particularly Good Example: AroundMe

21. 21
A Particularly Good Example: AroundMe

22. 22
A Particularly Good Example: AroundMe

23. 23
A Particularly Good Example: AroundMe

24. 24
A Particularly Good Example: AroundMe

25. 25
A Particularly Good Example: AroundMe

26. 26
A Particularly Good Example: AroundMe

27. 27
A Particularly Good Example: AroundMe

28. 28
A Particularly Good Example: AroundMe

29. AJAX and Usability
Wizzy graphics
and anima8on
can hide
deeper
usability
weaknesses

30. Pinch & Stretch Nightmare

31. Inconsistent UI
“Back button” functionality inconsistently available
Contact editibility only occasionally available
Moving from section to section awkward

32. 32
WebKit
http://webkit.org/
Used as the browser foundation by Safari, Nokia, Android...
Open Source application framework upon which a browser can be built
An open source project run by Apple
Components
 WebCore
 JavaScriptCore
 Drosera
 SunSpider

33. 33
The WURFL: Wireless Universal Resource File
http://wurfl.sourceforge.net/
XML configuration file that contains information about capabilities and features of
many mobile devices
Device data repository about mobile phones
Open source, free, and voluntary
Accessed by API at run time
Fosters community among developers
Luca Passani

34. 34
dotMobi
Mobile domain to support XHTML sites that conform to the .mobi standard
At its heart, a marketing campaign, but one oriented toward quality user experience and
brand trust
Provide tools and services to enable best-in-class usability:
 Emulator tool at http://mltd.mobi/emulator.php
 Page and site test tools at http://ready.mobi
 mobiForge developer community at http://mobiforge.com
 Best practices: http://mobithinking.com/sites/mobithinking.com/files/dotMobi_Mobile_Usability_Best_Practice.pdf
 Site builder tool at http://site.mobi
 Device Atlas at http://deviceatlas.com
– Database of mobile device information
– Accessed via API at run time

35. 35
Touch
• 2008 was the year of the bad touch screen phone.
• 2009 is the year of the iPhone knockoff...
from everyone.
• But there will be more bad touch screens.

36. 36
The Return of the QWERTY Keypad
• As consumers get tired of bad touch screens, QWERTY phones will
pick up demand.
• However, it remains to be seen whether touch+QWERTY will be the
winning combination...

37. 37
Touch Screen, Track Ball, & Joystick
• Allow one-handed single-mode use to place or answer a call.
• That means, only with the touch screen or only with the track ball, or
only with the joystick (or 5-way pad)—to answer and place a call.

38. 38
Animation & Sexy Graphics
• The iPhone and competitors use sexy transitions and animations to
cover up an underlying inconsistent and awkward UI.
• Delete buttons are all over the place.
• Back functionality is inconsistent (sometimes at upper left,
otherwise not available).
• Sometimes things zoom left and right, other times they zoom up and
down.
• Sometimes things just require too many strokes
to complete.

39. 39
Bigger, Better Cameras
• 5-megapixel standard, 8-megapixel not unusual
• Autofocus
• Zoom
• However, it’s just too hard to transfer
photos to a computer or via MMS
(or email)—exceptions noted!

40. 40
Hiding the Underlying OS
• Popular press criticise HTC handsets for not hiding Windows
Mobile enough...
• What about Android?
• What about LiMo?
• What about S60?

41. 41
Application Stores
• Apple pioneered the mobile-accessed application store.
• Google’s Android and RIM’s Blackberry are also offering stores.
• Microsoft purported to be working on an application store.
• Qualcomm’s BREW has had a hard-to-use store for a number of
years.
• Nokia, Nextel, and others have missed this
opportunity.

42. 42
The End of Pink Phones
We can all breathe a sigh of relief.

43. 43
Music, Finally Well-Done
• Music stores on the phones are a promising user experience
opportunity.
• Standard headphone jacks are smart—and they should be on the top
of the phone, not the left, right, or bottom!
• Side loading is the user experience worth considering: it’s a
nightmare in Windows Mobile, a breeze on the iPhone, but what
about S60 and other OS’s?

44. 44
Mapping & Location Awareness to a New Level
• Presence, direction, speed, all coming to phones in 2009.
• Google Maps leads in usability for base mapping applications.
• Navigation applications are a different story.

45. 45
HFI’s Global Offices
Chicago
Headquarters San Francisco
8700 W. Bryn Mawr Avenue
410 West Lowe 425 Market Street
Suite 800 South
Fairfield, IA 52556 Suite 2200
Chicago, IL 60631‐3507
Phone: (800) 242‐4480 San Francisco, CA 94105
Phone: (773) 714‐2362
(641) 472‐4480 Phone: (415) 955‐2734
Fax: (773) 714‐4910
Fax: (641) 472‐5412
Minneapolis
Boston
8400 Normandale Lake Blvd, Suite 920
1050 Waltham Street,
Minneapolis, MN 55437
Suite 410 Lexington, MA 02421
Phone: (952) 820‐4442
Phone: (781) 860‐7200
Fax: (952) 921‐2306
Fax: (781) 860‐7979
New York
Bal8more
One Penn Plaza
930 South Wolfe Street
36th Floor
BalOmore MD 21231
New York, NY 10119
Phone: (410) 327‐1012 / 1013
Phone: (212) 835‐1699
Fax : (410) 327‐1014
Thank You! Usable. Experience. Design.
London, UK
Mumbai, India Pondicherry, India
Unit 7, SrishO Plaza, 16 Albemarle Street
No.184, Mission Street
London W1S 4HW
Next to Killick Nixxon, Puducherry 605001
Off Saki‐Vihar Road, Andheri (E), Phone: +44 (0)207 290 3430
Phone: + 91 413 4210583
Fax: +44 (0)207 491 4118
Mumbai 400072 Fax: + 91 413 4210586
Phone: 91 (22) 4017 0400
Fax: 91 (22) 2847 5554
China
Bangalore, India Singapore
407, No. 555, Nanjing Road West
310/6 HR Complex, 2nd Floor 51 Tras Street, #03‐01
Koramangala, 5th Block Shanghai, China 200041
Singapore, 078990
Phone: +86‐21‐5213 2046
Bangalore 560 095 Phone: +65 6220 6431
Tel: +91 (80) 4150 7221/22/23 Fax: +86‐21‐5213 2062
Fax: +65 6220 6436
Fax: +91 (80) 4150 7220