!["HTML5 is still incredibly important to us. We get two times the mobile
traffic [on m.facebook.com] than from iOS and Android combined."
Mick Johnson
Facebook iOS Product Manager](https://image.slidesharecdn.com/denverstartupweek-howdoyouchoose-20121024-121023191846-phpapp02/75/Pick-Your-Poison-Mobile-Web-Native-or-Hybrid-20-2048.jpg)
Uploaded byEffective
Pick Your Poison – Mobile Web, Native or Hybrid?
The document discusses the different approaches to mobile application development, including mobile web, hybrid, and native technologies, each with its own pros and cons. It emphasizes the importance of user experience and the consequences of poor mobile app performance on brand perception. The guide offers criteria to help decide on the appropriate technology based on specific application needs and user goals.
More Related Content
Similar to Pick Your Poison – Mobile Web, Native or Hybrid?
Pick Your Poison – Mobile Web, Native or Hybrid?
- 1. Pick Your Poison– Mobile Web, Native, or Hybrid?
- 2. Introduction Shane Church | Technical Lead [email protected] Blog: http://www.s-church.net http://www.effectiveui.com Twitter: #effectiveui
- 3.
- 4. Why Does YourMobile Experience Matter?
- 5. Say if amobile app is not useful, it results in a negative 69% perception about the brand 32% Have told others about a bad experience with a mobile app Have avoided downloading applications from a company 13% due to a previous bad experience with another app offered by that brand -Harris Interactive, November 2010
- 6. Have downloaded anapp based on a review or 66% recommendation Have recommended an app because of a positive 57% experience -Harris Interactive, November 2010
- 7. Worldwide Smartphone MarketShare Windows Phone Linux Others Windows Phone LinuxOthers Symbian Symbian Blackberry Android iOS Blackberry Android iOS Q2 2011 Q2 2012 Source: IDC
- 8. The Available Poisons Whatdo each of the technology choices entail?
- 9. Mobile Web Accessed overthe Web, Mobile Web apps are built using Web technologies including HTML5 and JavaScript. Pros: Lowest barrier to first time use Cost effective multi-device support You control application updates Broadest possible reach Cons: Limited access to device hardware User interactions not native
- 10. Mobile Web Examples http://www.bostonglobe.com http://usa.kapersky.com http://m.foodandwine.com
- 11. Hybrid Built using acombination of HTML5 and JavaScript and packaged with a framework like PhoneGap or Appcelerator Titanium or a custom native shell Pros: Full device capabilities Cost effective multi-device support Sticky app and control over content Cons: User interactions not native Need to build native wrappers for multiple platforms
- 12. Hybrid Examples Logitech Squeezebox DirectTrac NBC (PhoneGap) (Orubase) (Appcelerator)
- 13. Native Built using platformnative languages and tools like Objective-C for iOS, Java for Android, and .NET for Windows Phone Pros Sticky application access Richest interactions can be built Full device capabilities available Cons Need to build for multiple platforms Typically more expensive to build Requires specialized developer expertise for each platform
- 14. Cross-Platform Native Built using.NET and Xamarin’s Mono Touch for iOS and Mono for Android and Visual Studio for Windows Phone Pros Same pros as traditional native development Use a common development language 70-90% code reuse between platforms Cons Some delays in accommodating OS updates Dependence on a third party vendor
- 15. Native Examples iOS Android Windows Phone 7 Pearson eCollege
- 16. Native Examples iOS Android Windows Phone 7 Chase Mobile Banking
- 17. The Facebook Conundrum Whatdoes Facebook’s switch from HTML5 to native on iOS mean?
- 18. Facebook abandons HTML5on iOS InfoWorld – September 6, 2012 Facebook Kisses HTML5 Goodbye With Rebuilt iOS App MacNewsWorld – August 25, 2012
- 19. “We deliberately madea trade off to get to scale. We used HTML5 to test and try things out, and people love that in the browser, but they have different expectations of a native IOS app. So with this release we rebuilt the app from scratch over the last 9 months and the main improvement is performance. Now there’s a lot more code built in Objective-C than HTML5.” Mick Johnson Facebook iOS Product Manager
- 20. "HTML5 is stillincredibly important to us. We get two times the mobile traffic [on m.facebook.com] than from iOS and Android combined." Mick Johnson Facebook iOS Product Manager
- 21. How to PickYour Poison A guide to selecting the right technology approach for your application
- 23. Ruling Out theMobile Web Do you need access to device hardware capabilities like the camera, or accelerometer? Do you need a presence in the app stores (Google Play, iTunes, Windows Phone Marketplace)? Does your app need to take advantage of push notifications?
- 24. Going Native Doesthe app need to perform any processor or graphics intensive operations like 3D graphics or real-time calculations i.e. most games? Does the app need to be functional offline? To what degree?
- 25. Am I aHybrid? What is the goal the user wants to accomplish by using your app? How sensitive is the app to variance in network performance? What is the platform matrix that you want to support? What is your tolerance for supporting multiple apps and operating systems? What percentage of the market are you comfortable ignoring?
- 27. Case Study How IAddressed This Question For An EffectiveUI Client
- 28. Cartegraph Targeting MunicipalGovernments Needed an app for mobile field workers who processed multiple work orders for assets such as signs, benches, and fire hydrants Already in the process of developing a Web-based tracking application for desktop clients Needed the ability to upload pictures and access mapping functionality
- 29.
- 30. The User IsKey
- 31. We now havethe foundation for easy to deploy, composite applications. But those applications will live or die on the acceptance of their human interfaces. Anthony Franco EffectiveUI Founder and President
- 32. There Is NoOne Right Answer Remember That User Experience Matters
- 33. Recommended Tools andReferences
- 34. Mobile Web DevelopmentTools jQuery Mobile – http://jquerymobile.com/ Sencha Touch – http://www.sencha.com/ Twitter Bootstrap – http://twitter.github.com/bootstrap/
- 35. Native Development Tools Apple iOS – https://developer.apple.com/ Google Android – http://developer.android.com/ Windows Phone – http://dev.windowsphone.com/ Blackberry – http://developer.blackberry.com/
- 36. Hybrid Development Tools PhoneGap – http://phonegap.com/ Appcelerator Titanium – http://www.appcelerator.com/ SyncFusion Orubase – http://orubase.com/ appMobi – http://appmobi.com/ Motorola RhoMobile – http://www.motorola.com/Business/US- EN/Business+Product+and+Services/Software+and+Applications/RhoMobile +Suite Corona – http://www.coronalabs.com/
- 37. Articles ASP.NET MVC3 - Develop Hybrid Native and Mobile Web Apps Shane Church – MSDN Magazine – March 2012 http://msdn.microsoft.com/magazine/hh852592 Facebook For iOS App Is Now 2X Faster Josh Constine – TechCrunch – August 23, 2012 http://techcrunch.com/2012/08/23/facebook-for-ios-faster/ Windows Phone - Building an App for Both Windows Phone and iOS Andrew Whitechapel – MSDN Magazine – October 2012 http://msdn.microsoft.com/magazine/jj658972
- 38.
- 39. Download These Slides http://www.slideshare.net/effectiveui Questions and Discussion Shane Church | Technical Lead [email protected] Blog: http://www.s-church.net http://www.effectiveui.com Twitter: #effectiveui
Editor's Notes
- #3 13 years developing mobile solutionsStarted on Palm OS11 years developing mobile solutions on Microsoft platformsMSDN Magazine March 2012 – ASP.NET MVC 3: Develop Hybrid Native and Mobile Web Apps(Printed copies of my MSDN article are available up front following the presentation)Slides posted on Slideshare. QR code at the end so you don’t have to take extensive notes.EffectiveUI – 2011 SD Times 100 for Mobile, 2012 SD Times 100 for User ExperienceIf you are tweeting this presentation, use the hash codes #effectiveui and #denverstartupweek
- #8 The mobile marketis changing rapidly.In the last year, only Android and Windows Phone have increased market share worldwide.This week, Microsoft is releasing Windows 8 and Windows Phone 8, Apple announced the iPad Mini, and Google will be making an announcement on the 29th.— Android (Google Inc.) — 104.8 million units, 68.1 percent share (46.9 percent a year earlier)— iOS (Apple Inc.’s iPhone) — 26.0 million units, 16.9 percent share (18.8 percent a year earlier)— BlackBerry (Research in Motion Ltd.) — 7.4 million units, 4.8 percent share (11.5 percent a year earlier)— Symbian (mostly used by Nokia Corp.) — 6.8 million units, 4.4 percent share (16.9 percent a year earlier)— Windows (Microsoft Corp.) — 5.4 million units, 3.5 percent share (2.3 percent a year earlier)— Linux — 3.5 million units, 2.3 percent share (3.0 percent a year earlier)— Others — 0.1 million units, 0.1 percent share (0.5 percent a year earlier)
- #10 Browser based applicationsMost mobile device platforms allow the user to “pin” a site to the main menu to have the site act more like an appWith responsive design, the same site can serve desktop, tablet, and smartphone users
- #11 Screenshots of Mobile Web
- #12 PhoneGap and Titanium package the HTML/JavaScript code with appropriate binaries into installable packages for each platformPhoneGap Build allows for building applications onto platforms that you don’t have the tools for locally (i.e. Windows users building for iOS)PhoneGap and Titanium package your HTML/JavaScript into the application that is distributed so offline use is supportedIn a custom shell, HTML/JavaScript (as described in my MSDN article), site is served from your servers, requiring a network connectionCustom shell gives more customization options and also allows for growing from a pure mobile Web solution to a hybrid one as needed
- #13 Hybrid Screenshots
- #14 Tools tend to be OS specific (iOS only on Mac, Windows Phone only on Windows)Any solution leaves out significant percentages of the market
- #15 Relatively new player in the spaceAll of the performance benefits of a fully native application with the benefits of cross platform code reuseOnly supports the “Big 3” of iOS, Android, and Windows Phone
- #16 NativeScreenshotsPearson eCollege White Label App by EffectiveUINative for each platform
- #20 The key point here is user expectationsUsers have different expectations
- #21 Despite the headlines, the Web is still incredibly important.Lesson here is that you don’t need “an app.”
- #23 Technology choices live on a continuumThe only pure choices are mobile Web and nativeAnything else is a “hybrid”Even the new Facebook iOS app still uses HTML
- #24 If you answer yes to any of these questions, you cannot meet your needs with a pure mobile Web app.Think hard about “needing” a presence in the app stores – You don’t necessarily need an app for that
- #25 If you answer yes to intensive applications you need a native applicationIf the app needs to be fully functional offline, you need a native applicationHTML5 provides an offline manifest file for offline use, but it is limited
- #26 These are all gray area questions
- #27 Another perspective is to move from content, to behaviors, to context, to experience, and finally to technology choices to enable all of the above.The user needs and experience needs to drive all of the technology decisions, not the other way around.
- #29 Use MSDN screenshots here
- #36 All are free to download except iOS.iOS requires $99/year developer accountWindows Phone tools are free but publishing to Windows Phone Marketplace requires $99/year account
- #37 PhoneGap and RhoMobile are free.Most of the others have “freemium” offerings
- #38 Printed copies of my MSDN article are available up front following the presentation