The mobile landscape is incredibly fragmented with a huge pool of devices and operating systems. This presentation shares tips and guidelines on how to navigate this maze and help design/develop better mobile applications.
14. Compact software programs that perform
specific tasks for the mobile user.
A software application that runs in a handheld
device such as a smartphone or other portable
device.
16. Native Mobile Web
Internet Access Not required Required
Performance ✓ ✖
Hardware access ✓ ✖
OS access ✓ ✖
Hardware & Platform
dependent ✓ ✖
Installation Must be installed URL link
Distribution App store Not required
Updates Reinstallation Simple
39. Platforms that your users on
Other major players in the market
Only installed apps get used
40. 1st Quarter 2010 Worldwide Smartphone Market Share
50%
Market Share
25%
0%
Symbian RIM iOS Android Windows Linux Others
Mobile
Source: Gartner (May 2010)
Gartner Says Worldwide Mobile Phone Sales Grew 17 Per Cent in First Quarter 2010
http://www.gartner.com/it/page.jsp?id=1372013
41. March 2010 Mobile Platform Market Share: iOS vs Andriod (By region)
US
UK
India
China
Hong Kong
Taiwan
Malaysia
Singapore
Thailand
Australia
0% 25% 50% 75% 100%
iOS Android All others
Source: AdMob
AdMob Mobile Metrics Report March April May 2010
AdMob Mobile Metrics Report - Southeast Asia Q1 2010
67. “... mobile-optimized experiences produced an
average 75% higher rate of engagements per
visit for mobile user.”
Source: Ed Hewett, Omniture
Do Mobile-optimized Experiences Improve Engagement
on “Super” Phones and Tablets like the iPad?
111. “Avoid displaying an About window, a splash
screen, or providing any other type of startup
experience that prevents people from using
your application immediately”
Source: Apple
iOS Reference Library
iPhone Human Interface Guidelines
115. “... I don't need three splash screens telling me
I'm playing Scrabble, made by EA, and ‘Every
Word Counts’... I want to load the game and
play, not wait through their branding...”
- App Store comment
164. 44px
44px
44px
Source: From Click To Tap
http://www.slideshare.net/maxvoltar/from-click-to-tap
165. Give enough space 44px
44px
44px
Source: From Click To Tap
http://www.slideshare.net/maxvoltar/from-click-to-tap
166. Give enough space 44px
Account for accidental
touches 44px
44px
Source: From Click To Tap
http://www.slideshare.net/maxvoltar/from-click-to-tap
167. Give enough space 44px
Account for accidental
touches 44px
Think Bigger hit-area 44px
Source: From Click To Tap
http://www.slideshare.net/maxvoltar/from-click-to-tap
169. "Given the typical input limitations of a mobile
device, the interface must as far as possible
minimize user input.Where possible, use
selection lists, radio buttons and other controls
that do not require typing."
Source: Mobile Web Best Practice, W3C
170. "Although unavoidable in forms that need
information form the user, avoid using text boxes
and text areas as much as possible. It’s difficult
for the user to enter content into free text inputs
such as text boxes..."
Source: Mobile Design and Development, Brian Fling
187. Don’t...
... assume a need
... be short-sighted
... trivialize choice of platform
... gloss over bits & bytes
188. Don’t...
... assume a need ... go chasing waterfall
... be short-sighted
... trivialize choice of platform
... gloss over bits & bytes
189. Don’t...
... assume a need ... go chasing waterfall
... be short-sighted ... assume browsers are equal
... trivialize choice of platform
... gloss over bits & bytes
190. Don’t...
... assume a need ... go chasing waterfall
... be short-sighted ... assume browsers are equal
... trivialize choice of platform ... downplay user experience
... gloss over bits & bytes
191. Don’t...
... assume a need ... go chasing waterfall
... be short-sighted ... assume browsers are equal
... trivialize choice of platform ... downplay user experience
... gloss over bits & bytes ... be online only
197. Don’t...
... favour branding over users
... load too much too fast
... re-invent the wheel
... do roll-overs
... forget to guide your users
198. Don’t...
... favour branding over users ... disrupt the experience
... load too much too fast
... re-invent the wheel
... do roll-overs
... forget to guide your users
199. Don’t...
... favour branding over users ... disrupt the experience
... load too much too fast ... squeeze the world in
... re-invent the wheel
... do roll-overs
... forget to guide your users
200. Don’t...
... favour branding over users ... disrupt the experience
... load too much too fast ... squeeze the world in
... re-invent the wheel ... make user type
... do roll-overs
... forget to guide your users
201. Don’t...
... favour branding over users ... disrupt the experience
... load too much too fast ... squeeze the world in
... re-invent the wheel ... make user type
... do roll-overs ... forget to test
... forget to guide your users
202. Don’t...
... favour branding over users ... disrupt the experience
... load too much too fast ... squeeze the world in
... re-invent the wheel ... make user type
... do roll-overs ... forget to test
... forget to guide your users
205. References
User-centered design of mobile solution (NAMAHN)
http://www.namahn.com/resources/documents/note-MobileSolutions.pdf
AdMob Mobile Metrics
http://metrics.admob.com
The Best & Worst of the Mobile Web (mobiThinking)
http://mobithinking.com/white-papers/best-and-worst-of-the-mobile-web
Mobile Web Best Practices 1.0 (W3C)
http://www.w3.org/TR/mobile-bp/
206. References
Automatic Form Filling on Mobile Devices
http://www.medien.ifi.lmu.de/pubdb/publications/pub/deluca2007pmc/
deluca2007pmc.pdf
Mobile Design and Development (Brian Fling)