The Mobile Question: Lessons in Design and Strategy for Your Mobile Experience ?

Big Design Edition#bigd10

Mobile projects?

?

hello.

@jeremyjohnson

#bigd10#TheMobileQuestion

http://ffffound.com/image/eae112c8d844f8ea4cc8ec58ac5917e4e2abe20e

http://ffffound.com/image/fcd72119888f6da60ae415fcee1c9dbdd36e35db

http://ffffound.com/image/f7a382ebc4ace7fade36c0542040320db1d0559e

pre 2007(or Bi)

mobile internet adoption = >12%

Hard time getting adoption with feature phones and carriers

pre 2007

today40% of Pandora users are mobile - and mobile now has more sessions (2.5x) than the desktop site(now adding 30,000 iPhone listeners a day)

?A)

B) far off

http://www.fubiz.net/2009/03/17/microsoft-sustainability/

http://www.engadget.com/2008/02/25/nokias-nanotech-morph-goes-on-display-signals-melting-devices/

http://www.readwriteweb.com/archives/gphone_concepts_and_possible_specs.php

http://images2.pocket-lint.com/images/nBhz/another-exploding-iphone-reported-france-0.jpg

hi

http://ffffound.com/image/8e68da2f5dd54408c5830cb96d3927708d71e823

It took the iPod 17 quarters to reach 30 million units. The iPhone did it in 10.

http://brainstormtech.blogs.fortune.cnn.com/2009/11/25/chart-ipod-vs-iphone/

B) far off

http://ffffound.com/image/42d4521ab29e3dbd7151cc855a69e21383f6b455

little less...

“Clients ask for applications to be designed and created but often, they can't see the next five years so they don't where they are going. For instance, the biggest companies in the World do not know what to do with mobile.”http://www.lukew.com/ff/entry.asp?1098

UX Lisbon: The Next 10 Years

“we need to go mobile...”

“we need an iPhone app...”

“...why [do] they ignore all devices except [the]iPhone. Not everyone has an iPhone. Could you speak to the non-iPhone users...” 12/2009

UX

Navigation Button

Combo box

Screen NameHome Edit

ON

YOU

http://images2.pocket-lint.com/images/nBhz/another-exploding-iphone-reported-france-0.jpg

me again

85+ Million

iPhones, in particular, can generate as much traffic as 30 basic feature phones

http://www.lukew.com/ff/entry.asp?1042&utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+FunctioningForm+(LukeW+Ideation+%2B+Design)

http://www.lukew.com/ff/entry.asp?1042&utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+FunctioningForm+(LukeW+Ideation+%2B+Design)

35% of smartphone owners browse the mobile Internet at least daily versus only 4% of featurephone owners

71% of all smartphone users use Internet88% of iPhone users use Internet92% of Android users use Internet

!"#

$"#

%&#

'%#

((#

)!#

((#

)*#

+,-./,.-

0112

!"#$%&'"("&)*(+,+(+-.&/0&1234&56678&92

!"#$%&'(&#'$)'*+&',$%%&-'.//'"0'12.-*/+"0&)

3"04$5&0*$.%'6'7-"/-$&*.-83"/8-$9+*':';<<='>+&'?$&%)&0'3"2/.08

$$#

)#

'3#

!!#

)3#

"&#

)*#

%*#

'$#

4567-85,

98:.5

0;;<=>?26/8?./20;;<=@7/-1A5,.0;;<8BA5,.0;;<0,:/58:

@

2$:%*-;&!$/+<-&!-=+"&!"%>-(?<"*-&@ 92

"Gill, David" <David.Gill@nielsen.com>

http://wapreview.com/blog/?p=6828

http://www.lukew.com/ff/entry.asp?1042&utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+FunctioningForm+(LukeW+Ideation+%2B+Design)

Smartphones make up a small percentage of the World's four billion cell phones but they differ drastically in their use.

non-smart phone users don’t use the mobile internet (much)

If it’s not EASY...

“...why they ignore all devices exceptiPhone. Not everyone has an iPhone. Could you speak to the non-iPhone users...” 12/2009

» iPhone OS increased from 33% in February 2009 to 50% in February 2010.

» Android increased its share from 2% to 24% year-on-year

» Symbian’s share of smartphone requests fell from 43% in February 2009 to 18% in February 2010.

http://www.intomobile.com/2010/03/29/admobs-february-2010-metrics-examine-the-use-of-smartphones-feature-phones-and-mids.html?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+IntoMobile+(IntoMobile)

http://arstechnica.com/apple/news/2010/03/iphone-os-still-dominates-mobile-web-android-on-the-way-up.ars

“BlackBerrys are still the best-selling smartphones in the U.S., and their web presence rounds down to zero...”http://daringfireball.net/2010/05/ipad_android_web_traffic_share

1 in 2 Americans Will Have a Smartphone by Christmas 2011from Original Signal

If you're not ready to bid farewell to the feature phone just yet, you might want to start preparing your goodbyes. Nielsen today said that by the end of 2011, smartphones will overtake feature phones up from a mere 10% in early 2008.

75+%

What do we need to do?

ACTION!

we = ?

Step 1:

Whatkind of mobile experience are you creating?

1) Mobile First

2) Content

3) Application or ecommerce

4) Entertainment

First Step in your mobile plan:What app/site are you building?

1) Are you creating a mobile first solution?

Definition:

A solution that first exists to fill a mobile need, or is more valuable on a mobile device.

1) Are you creating a mobile first solution?

http://www.biggu.com/

quick notes

» Start with a native application» Hit all major platforms (including web)» Be prepared to hire mobile experts» Market the app stores» Watch new devices as released

2) Taking your content mobile?

Definition:

Mostly text, or photos - very little “application style” interactions.

2) Taking your content mobile?

Usablenet's mobile platform, Usablenet Mobile (UM), is a fully managed service that extends a company's web site (or other source) functionality and content to a customized, dynamic, mobile view. Usablenet Mobile dynamically builds each mobile page based on the exact capabilities ofthe mobile phone accessing the client’s site.

To see the new mobile version, just go to techcrunch.com on any touch-screen mobile device. We’ll be adding full support for non-touchscreen models soon.

http://techcrunch.com/2010/03/17/techcrunch-mobile/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+Techcrunch+(TechCrunch)

quick notes

» Evaluate your internal skillsets» Research value to go mobile» Find out what devices your readers have» Research different development options

(mobile stylesheets, on-the-fly optimization, custom development...)

3) Moving desktop/web applications (or ecommerce) to mobile?

Definition:

Taking an interactive application or site and moving it to a mobile platform.

3) Moving desktop/web applications (or ecommerce) to mobile?

“Since we’re talking about an app for a phone, we might as well take advantage of voice.”

http://37signals.com/svn/posts/2234-launch-highrise-for-iphone

quick notes

» What technologies are your developers familiar with?

» Take stock of your features to see how they match up to devices

» Do you have services ready for a mobile app/site?

4) Going for entertainment?

Definition:

Games, sound or video experiences, that need deep phone integration and high fidelity graphics.

4) Going for entertainment?

quick notes

» Learn the pricing/gaming of the app stores» Be prepared to create native applications» Design matters!» Watch your reviews

“UI, Timing, Luck, and Features”

Mobile plan

1) Mobile First

2) Content

3) Application or ecommerce

4) Entertainment

What type of experience are you creating?

Time to get into design the process...

Step 2:

REMEMBER!!

Don’t forget your process!

What needs to go mobile?

quick answer...

NOT EVERYTHING!or at least use progressive disclosure!

Amazon example

“Good mobile apps focus on a few important tasks. Resist the temptation to make all the features of your main site into the ones that are most critical for mobile.”

http://www.lukew.com/ff/entry.asp?1028&utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+FunctioningForm+(LukeW+Ideation+%2B+Design)

Joe Marini's Designing and Developing for the Rich Mobile Webpresentation at Microsoft's MIX10 conference

Mobile plan

A. Are needed for your business

B. or, are specific to the mobile context

What needs to go mobile? List out top 3-5 features that:

Who are our mobile users?

goal vs. leisure

“I need to find a pizza joint”

“I’m just playing around”

http://www.bbc.co.uk/blogs/bbcinternet/2010/02/bbc_online_our_mobile_future.html

http://www.bbc.co.uk/blogs/bbcinternet/2010/02/bbc_online_our_mobile_future.html

goalleisure

leisure

mix

“only”

http://www.bbc.co.uk/blogs/bbcinternet/2010/02/bbc_online_our_mobile_future.html

goalleisure

leisure

mix

“only”

? ?

What are our users using?

?

analytics http://bango.com/mobileanalytics/default.aspx

http://arstechnica.com/apple/news/2010/03/iphone-os-still-dominates-mobile-web-android-on-the-way-up.ars

http://arstechnica.com/apple/news/2010/03/iphone-os-still-dominates-mobile-web-android-on-the-way-up.ars

Business Users?International Audience?Targeted Companies?

Mobile plan

A. What persona are you designing for?

B. What devices are they using?

Who are our mobile users?

How do you Design for mobile?

Free Printable Sketching, Wireframing and Note-Taking PDF Templates

http://www.uistencils.com/products/iphone-stencil-kit

http://www.teehanlax.com/blog/2009/06/18/iphone-gui-psd-30/

learn mobile ui

http://www.smashingmagazine.com/2010/03/11/forms-on-mobile-devices-modern-solutions/

The MUX Archetypes I propose are:

1. Application Centric

2. Activity Centric

3. Timeline Centric

4. Context (Location) Centric

5. Process/Task Centric

6. Emotion Centric

7. People/Identity Centric

“Can we look at a user interface and guess what it’s going to do for us? If the answer is a!tentative yes, it probably means its interaction model is based on a common archetype.”

http://johnnyholland.org/2010/05/17/archetypes-and-their-use-in-mobile-ux/

http://www.fastcompany.com/article/2010-year-app-apple-ipad-iphone-smartphone

try, play, use

Finger Mouse

Mobile plan

A. Touch, click, scroll, or tap?B. Get the devicesC. Homework: Try everything!

How to design for mobile?

What devices do we need to focus on?

The devices your users have...

analytics FTW!If you currently have users...

Data from current users muddling through your desktop site...

http://www.bbc.co.uk/blogs/bbcinternet/2010/02/bbc_online_our_mobile_future.html

“Now, for a growing majority of mobile strategies that don’t require a global presence on widely varying devices, the discussion begins with iPhone. [...] And iPad app may soon replace iPhone app as the starting point.

Frankly, as the adoption rate of iPhone increases and if iPad follows suit, it will become increasingly difficult to argue in favor of a starting point other than iPhone OS. The NPR iPad app, for one, provides a much more pleasant user experience than NPR.org.”

http://cameronmoll.tumblr.com/post/498950232/the-mobile-web-vs-the-objective-c-web

- Cameron Moll

http://www.bbc.co.uk/blogs/bbcinternet/2010/02/bbc_online_our_mobile_future.html

1st

A) mobile first

B) $$$

C)Super Developers

but, remember...

“Option A”90% =Content

» WAP HTML Based» Native BlackBerry

?

75%

HTML5 HTML5 HTML5

Mobile plan

A. Check your analyticsB. Survey your users

What devices do we focus on?

What technologies do we use?

1) This is hard!

2) Native is better...

Today’s World...:

Native iPhone: Object-CNative Android: JavaNative BlackBerry: JavaNative Palm: WebOSNative Windows Phone: Silverlight

Flash Lite / FlashHTML5 / CSS3

Let’s focus on this» PhoneGap» Etc...

The most useful for getting a rich experience to the most mobile internet users, at the lowest cost.

HTML5

HTML5 / CSS3Here are the pros of web app development:

» Web developers can use their current authoring tools.

» You can use your current web design and development skills.

» You are not limited to developing on the Mac OS.

» Your app will run on any device that has a web browser.

» You can fix bugs in real time.

» The development cycle is fast.

http://building-iphone-apps.labs.oreilly.com/ch01.html#ch01_id35931969

HTML5 / CSS3Here are the pros of web app development:

» Almost a silver bullet for “One Web”

» Works with URLs (you.com) or app stores (via phonegap, etc...)

» Highly skinable to different colors/designs

» Quick to prototype

HTML5 / CSS3Here are the cons of web app development:

» You cannot access the all cool hardware features of the phone.

» You have to roll your own payment system if you want to charge for the app.

» It can be difficult to achieve sophisticated UI effects.

They’re fixing these...

http://building-iphone-apps.labs.oreilly.com/ch01.html#ch01_id35931969

“In many ways, HTML5 is just the baseline of where mobile browsers are headed. Many companies, from carriers to handset manufacturers, are looking to mobile browser innovation as a key to their mobile strategies.”http://radar.oreilly.com/2010/05/mobile-operating-systems-and-b.html

http://www.tuaw.com/2010/04/09/adlib-apples-secret-web-app-weapon/

“It's a web app, but it doesn't feel like a web app”

http://www.iphoneuserguide.com/apple/2010/04/09/iphone3g/apples-iad-service-is-entirely-html5/

http://phonegap.com/projects

Mobile plan

A. Is native a must?B. What type of developers

do you have access to?C. Can something like

HTML5 work with your users/devices?

What technologies do we use?

Decision Time!

Application or ecommerce

Feature AFeature BFeature C

Application? YesMultiple Platforms? Yes

No

Audio, video, or camera needed?

No

Yes

Does in need to be available in the app stores?

Native app needed

NoWeb based app

The Mobile Question:

Lessons in Design and Strategy for Your Mobile Experience worksheet

» What kind of mobile experience are you creating?

Mobile First

Content

Application or ecommerce

Entertainment

time to design» What needs to go mobile?

List out 3-5 top features that are a) needed for your business, or b) are specific to the mobile context

1)

2)

3)

4)

5)

» Who are your mobile users?

List any current analytics or knowledge on mobile device usage:

» How do you Design for mobile?

(remember to engage your Design/User Experience team!)

List any known well designed, reviews apps that compete in your space:

» What devices do we need to focus on? THE DEVICES YOUR USERS HAVE!

» What technologies do we use?

Is Native a must?

Yes No

What types of developers do you have access to?

Goal Leisure

Can something like HTML5 work with your users/devices?

Yes No

Any additional info from analytics or surveys, etc...?

Make this into a workshop with your business owners.

Download from:

jeremyjohnsononline.com

Trends

The company [Yahoo] is also going to target local search because it believes it can leverage the intimacy of a user’s location to deliver better results. All the major players are doing this, but Yahoo is showing some innovation with things like Sketch-A-Search.

“Mobile search results should be actual stuff that you care about blocks away from you,” said David Katz, VP of North America at Yahoo Mobile. “There are a lot of opportunities to use location – it can be when you’re near a certain point, and there’s also a lot of opportunity pairing location with a time of day.”

LOCATION

Yahoo eyes mobile for growth

CHECK-IN

Foursquare’s Growth Not Slowing Down: 725,000 Users, 22 Million Checkins

http://mashable.com/2010/03/29/foursquare-growth-numbers/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+Mashable+(Mashable)

MOBILE GAMING

http://mashable.com/2010/03/23/ipad-psp-ds-games/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+Mashable+(Mashable)

iPAD

Big iPhone?

revised their shipping forecasts for the iPad, and they now expect to ship 8-10 million devices by the end of 2010.

http://mashable.com/2010/03/29/apple-10-million-ipads/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+Mashable+(Mashable)

iPAD

http://www.intomobile.com/2010/04/09/ipad-infographic-shows-app-breakdown-ipad-usage-and-regional-adoption-with-cool-visuals.html?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+IntoMobile+(IntoMobile)

450,0003.5 million apps

5/3 A million iPads sold in 28 days (2.5x faster than the iPhone)with 13 million app downloads.

http://www.readwriteweb.com/start/2010/04/why-you-need-to-be-developing-for-the-ipad-right-now.php

WINDOWS PHONE 7

WINDOWS PHONE 7

» Two screen sizes: 800x480 and 480x320» Native apps built in Silverlight» Browser is based on IE7 (could have

elements of IE8?)» Out by Christmas

What we know...

http://www.engadget.com/2010/03/15/windows-phone-7-series-will-be-wvga-at-launch-hvga-later/

ANDROID

FLASH ON MOBILE

Adobe essentially says Steve Jobs is a business-killing jerk (Update: “Go screw yourself Apple”)

http://www.engadget.com/2010/05/20/flash-10-1-for-android-beta-unveiled-hulu-a-no-show-froyo-now/

HTML5

How Google’s Chrome Web Store impacts smartphones

“Google believes that the web is the ultimate app platform and I tend to agree, particularly with all the capabilities that HTML5 will offer. It also thinks that smartphones will make desktops “irrelevant” in as few as three years.”

http://www.intomobile.com/2010/05/19/how-googles-chrome-web-store-impacts-smartphones.html?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+IntoMobile+(IntoMobile)

questions?

@jeremyjohnsonjeremyjohnsononline.com

Keep up with mobile trends now - follow: @mobilefeeds

thanks!

@jeremyjohnsonjeremyjohnsononline.com