In 2012, shipments of smartphones and tablets surpassed shipments of laptop and desktop PCs by almost

200 MILLION UNITS

By the end of 2013, there will be more mobile devices on Earth than people

Mobile search has rown

over the last 2 years

500%

Mobile internet trac is predicted to overtake desktop internet trac by 2014

TOUGH CHOICES

Native App? Hybrid App? RWD? IT DEPENDS!

PROS TO NATIVE APPS

Use existin conventions and native UI elements Most responsive to touch, superior physics, complex animations Push notications, social media inte ration Marketin advanta es to bein in the App Store

CONS TO NATIVE APPS

Native developers arent cheap or plentiful, particularly for iOS Lon er dev time means hi her costs Apple App Store submission process Additional eort to support multiple platforms: iOS, Android, Blackberry, Windows

PROS TO HYBRID APPS

Oers many advanta es of native app Less development cost & eort

CONS TO HYBRID APPS

Not as responsive to touch/swipe, dicult to support complex physics Users expect native behavior and are subtly disappointed when it doesnt deliver

PROS TO A RESPONSIVE SITE

Easy to develop, deploy and update One site, many devices Works across platforms

CONS TO MOBILE WEB SITES

Lack of native UI elements Fewer complex animations Lack of exposure in the App Store Cant do push notications, cant inte rate with the users contacts/social media

SEAMLESSNESS erases the line between the physical and the virtual world

Touch makes immersion and seamless experiences possible

We are movin towards a mouseless future

Touch is thrillin because of the lack of mediation

Seamlessness requires the suspension of disbelief

Suspension of disbelief requires awless technolo y

Seamless desi n requires new, touch-specic patterns and paradi ms

User testin is the only way to validate seamlessness

SEAMLESSNESS TAKEAWAYS Enabled by the ma ic of touch Requires suspension of disbelief and awless technolo y performance Necessitates new, touch-specic UI patterns Destroyed by anythin clunky or unexpected Happens in the minds of users

What do users want to do? Why are they doin it? Where are they doin it?

There is no substitute for user research and user testin

User behavior is context-specic

photo credit: http://www.ickr.com/photos/sidewalk_yin /

Mobile-optimizin means research-driven, context-specic desi n

Use research to identify unique contexts for phone vs tablet vs desktop

26% of apps downloaded are only used once

More features != More app usa e

Cuttin superuous features creates more immersive experiences

30 SECOND RULE: If I cant do somethin in 30 seconds or less I will never use your app a ain

Immersive apps oer hi hly edited avenues for exploration

Quick wins build condence in new users

Seamlessness builds with familiarity

Speed and responsiveness lead to lon er, immersive interactions

Speed Familiarity Condence Exploration

Choose the ri ht metrics to measure and et client buy-in

Launch small and keep iteratin

Break sets of features out into multiple apps

PLANNING TAKEAWAYS

Extra features do not make an app extra immersive 30 seconds to your most critical function Oer carefully edited avenues for exploration Anticipate user needs and enhance the experience in context specic ways.

Desi n = problem solvin

Immersive desi n = solvin fundamental problems + layer of ma ic and deli ht

Navi ation is critical to your mobile experience

One door, one exit

Transitions and animations arent eye candy; they provide important user feedback

Use the z-axis to layer screens and describe relationships between content

Animation should always mimic real world physics

Good er onomics is key to creatin seamlessness

ima e credit: Josh Clark

Reduce the number of items on each screen

Secret panels and hidden doors streamline UI and oer en a ement for expert users

Only hide as much as you have to, and oer stron visual cues

Use familiar metaphors

Make the next action painfully obvious

Reward users for every touch

Super-realism extends interactions in a way thats both excitin and believable

DESIGN TAKEAWAYS

Optimize navi ation for discoverability Help users build mental maps Use animation to provide information, not eye candy Dont for et to consider er onomics Hide options in secret panels, but only when necessary Look for opportunities to create Super Realism

Nobodys ot this perfectly ured out yet

Go make somethin awesome

THANK YOU!
Follow me on Twitter: @heywren