SlideShare une entreprise Scribd logo
1  sur  39
Pick Your Poison – Mobile Web, Native, or Hybrid?
Introduction
        Shane Church | Technical Lead
        shane.church@effectiveui.com

        Blog: http://www.s-church.net

        http://www.effectiveui.com
        Twitter: #effectiveui
Thank You




http://www.uncubedspace.com/
Why Does Your Mobile Experience Matter?
Say if a mobile 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
Have downloaded an app based on a review or
66%   recommendation

      Have recommended an app because of a positive
57%   experience




                            -Harris Interactive, November 2010
Worldwide Smartphone Market Share
                       Windows Phone   Linux Others
                                                                                     Windows Phone   LinuxOthers
                                                                                   Symbian

             Symbian                                                  Blackberry




                                                      Android
                                                                iOS




Blackberry



                                                                                                                            Android




                          iOS




                                 Q2 2011                                                       Q2 2012

                                                                                                              Source: IDC
The Available Poisons
What do each of the technology choices entail?
Mobile Web
Accessed over the 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
Mobile Web Examples




  http://www.bostonglobe.com   http://usa.kapersky.com   http://m.foodandwine.com
Hybrid
Built using a combination 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
Hybrid Examples




   Logitech Squeezebox   DirectTrac       NBC
        (PhoneGap)       (Orubase)    (Appcelerator)
Native
Built using platform native 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
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
Native Examples




      iOS              Android       Windows Phone 7
                  Pearson eCollege
Native Examples




       iOS               Android         Windows Phone 7

                  Chase Mobile Banking
The Facebook Conundrum
What does Facebook’s switch from HTML5 to native on iOS mean?
Facebook abandons HTML5 on iOS
                           InfoWorld – September 6, 2012

Facebook Kisses HTML5 Goodbye With Rebuilt iOS App
                           MacNewsWorld – August 25, 2012
“We deliberately made a 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
"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
How to Pick Your Poison
A guide to selecting the right technology approach for your application
Ruling Out the Mobile 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?
Going Native
 Does the 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?
Am I a Hybrid?
   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?
Case Study
How I Addressed This Question For An EffectiveUI Client
Cartegraph
 Targeting Municipal Governments
 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
Cartegraph
The User Is Key
We now have the 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
There Is No One Right Answer



   Remember That User Experience Matters
Recommended Tools and References
Mobile Web Development Tools
 jQuery Mobile – http://jquerymobile.com/
 Sencha Touch – http://www.sencha.com/
 Twitter Bootstrap – http://twitter.github.com/bootstrap/
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/
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/
Articles
 ASP.NET MVC 3 - 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
Thank you!
Download These Slides
                                http://www.slideshare.net/effectiveui




Questions and Discussion
Shane Church | Technical Lead
shane.church@effectiveui.com

Blog: http://www.s-church.net

http://www.effectiveui.com
Twitter: #effectiveui

Contenu connexe

Tendances

Day: 1 Introduction to Mobile Application Development (in Android)
Day: 1 Introduction to Mobile Application Development (in Android)Day: 1 Introduction to Mobile Application Development (in Android)
Day: 1 Introduction to Mobile Application Development (in Android)Ahsanul Karim
 
Introduction to mobile application development
Introduction to mobile application developmentIntroduction to mobile application development
Introduction to mobile application developmentChandan Maurya
 
Native, Web or Hybrid Mobile App Development?
Native, Web or Hybrid Mobile App Development?Native, Web or Hybrid Mobile App Development?
Native, Web or Hybrid Mobile App Development?Sura Gonzalez
 
Mobile Application Design & Development
Mobile Application Design & DevelopmentMobile Application Design & Development
Mobile Application Design & DevelopmentRonnie Liew
 
Android overview
Android overviewAndroid overview
Android overviewbhavani p
 
Introduction to Mobile Development
Introduction to Mobile DevelopmentIntroduction to Mobile Development
Introduction to Mobile DevelopmentPragnesh Vaghela
 
Mobile application design trend & history
Mobile application design trend & historyMobile application design trend & history
Mobile application design trend & historyRawin Windygallery
 
Facebbok Spartan
Facebbok SpartanFacebbok Spartan
Facebbok SpartanErol Dizdar
 
IOS vs Android presentation by Saikrishna
IOS vs Android presentation by SaikrishnaIOS vs Android presentation by Saikrishna
IOS vs Android presentation by SaikrishnaSaikrishna Tanguturu
 
Developing for Mobility
Developing for MobilityDeveloping for Mobility
Developing for MobilityScotty Logan
 
Native vs Hybrid vs Web
Native vs Hybrid vs WebNative vs Hybrid vs Web
Native vs Hybrid vs WebRuckit
 
"iPhone vs Andriod," Anthony Hand
"iPhone vs Andriod," Anthony Hand"iPhone vs Andriod," Anthony Hand
"iPhone vs Andriod," Anthony Handrayvillares
 

Tendances (16)

Day: 1 Introduction to Mobile Application Development (in Android)
Day: 1 Introduction to Mobile Application Development (in Android)Day: 1 Introduction to Mobile Application Development (in Android)
Day: 1 Introduction to Mobile Application Development (in Android)
 
Introduction to mobile application development
Introduction to mobile application developmentIntroduction to mobile application development
Introduction to mobile application development
 
Native, Web or Hybrid Mobile App Development?
Native, Web or Hybrid Mobile App Development?Native, Web or Hybrid Mobile App Development?
Native, Web or Hybrid Mobile App Development?
 
Mobile Application Design & Development
Mobile Application Design & DevelopmentMobile Application Design & Development
Mobile Application Design & Development
 
Mobile application design & development
Mobile application design & developmentMobile application design & development
Mobile application design & development
 
Android overview
Android overviewAndroid overview
Android overview
 
Android overview
Android overviewAndroid overview
Android overview
 
Introduction to Mobile Development
Introduction to Mobile DevelopmentIntroduction to Mobile Development
Introduction to Mobile Development
 
Project of mobile apps
Project of mobile appsProject of mobile apps
Project of mobile apps
 
Andriod vs iphone
Andriod vs iphoneAndriod vs iphone
Andriod vs iphone
 
Mobile application design trend & history
Mobile application design trend & historyMobile application design trend & history
Mobile application design trend & history
 
Facebbok Spartan
Facebbok SpartanFacebbok Spartan
Facebbok Spartan
 
IOS vs Android presentation by Saikrishna
IOS vs Android presentation by SaikrishnaIOS vs Android presentation by Saikrishna
IOS vs Android presentation by Saikrishna
 
Developing for Mobility
Developing for MobilityDeveloping for Mobility
Developing for Mobility
 
Native vs Hybrid vs Web
Native vs Hybrid vs WebNative vs Hybrid vs Web
Native vs Hybrid vs Web
 
"iPhone vs Andriod," Anthony Hand
"iPhone vs Andriod," Anthony Hand"iPhone vs Andriod," Anthony Hand
"iPhone vs Andriod," Anthony Hand
 

En vedette

Object-Relational Mapping and Dependency Injection
Object-Relational Mapping and Dependency InjectionObject-Relational Mapping and Dependency Injection
Object-Relational Mapping and Dependency InjectionShane Church
 
Prototyping with HTML, CSS & jQuery
Prototyping with HTML, CSS & jQueryPrototyping with HTML, CSS & jQuery
Prototyping with HTML, CSS & jQueryBermon Painter
 
Cartegraph Live HTML, CSS, JavaScript and jQuery Training
Cartegraph Live HTML, CSS, JavaScript and jQuery TrainingCartegraph Live HTML, CSS, JavaScript and jQuery Training
Cartegraph Live HTML, CSS, JavaScript and jQuery TrainingShane Church
 
HTML, CSS, JS & Jquery Introduction
HTML, CSS, JS & Jquery IntroductionHTML, CSS, JS & Jquery Introduction
HTML, CSS, JS & Jquery IntroductionIslam AlZatary
 
The Near Future of CSS
The Near Future of CSSThe Near Future of CSS
The Near Future of CSSRachel Andrew
 

En vedette (6)

Object-Relational Mapping and Dependency Injection
Object-Relational Mapping and Dependency InjectionObject-Relational Mapping and Dependency Injection
Object-Relational Mapping and Dependency Injection
 
Prototyping with HTML, CSS & jQuery
Prototyping with HTML, CSS & jQueryPrototyping with HTML, CSS & jQuery
Prototyping with HTML, CSS & jQuery
 
Jquery
JqueryJquery
Jquery
 
Cartegraph Live HTML, CSS, JavaScript and jQuery Training
Cartegraph Live HTML, CSS, JavaScript and jQuery TrainingCartegraph Live HTML, CSS, JavaScript and jQuery Training
Cartegraph Live HTML, CSS, JavaScript and jQuery Training
 
HTML, CSS, JS & Jquery Introduction
HTML, CSS, JS & Jquery IntroductionHTML, CSS, JS & Jquery Introduction
HTML, CSS, JS & Jquery Introduction
 
The Near Future of CSS
The Near Future of CSSThe Near Future of CSS
The Near Future of CSS
 

Similaire à Pick Your Poison – Mobile Web, Native, or Hybrid? - Denver Startup Week - October 24, 2012

UNIT_1_1626771386169.ppt
UNIT_1_1626771386169.pptUNIT_1_1626771386169.ppt
UNIT_1_1626771386169.pptHannaAnvar1
 
Types of mobile apps mobile app development
Types of mobile apps  mobile app developmentTypes of mobile apps  mobile app development
Types of mobile apps mobile app developmentWebwing Technologies
 
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptx
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptxMOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptx
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptxmuthulakshmi cse
 
When to choose and avoid react native for mobile app development
When to choose and avoid react native for mobile app developmentWhen to choose and avoid react native for mobile app development
When to choose and avoid react native for mobile app developmentFullestop
 
Hybrid app development
Hybrid app developmentHybrid app development
Hybrid app developmentHarshul Shah
 
Top Advantages of Cross Platform Mobile App Development
Top Advantages of Cross Platform Mobile App DevelopmentTop Advantages of Cross Platform Mobile App Development
Top Advantages of Cross Platform Mobile App DevelopmentXDuce Corporation
 
Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...
Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...
Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...SoftLabNY
 
Native, Web App, or Hybrid: Which Should You Choose?
Native, Web App, or Hybrid: Which Should You Choose?Native, Web App, or Hybrid: Which Should You Choose?
Native, Web App, or Hybrid: Which Should You Choose?Softweb Solutions
 
Mobile Development Platforms
Mobile Development PlatformsMobile Development Platforms
Mobile Development PlatformsAndri Yadi
 
Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...
Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...
Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...ReformedTech
 
MOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARI
MOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARIMOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARI
MOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARISivaSankari36
 
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...Katy Slemon
 
Mobile Application Development with WP7 & Others
Mobile Application Development with WP7 & OthersMobile Application Development with WP7 & Others
Mobile Application Development with WP7 & OthersAndri Yadi
 
Confused about Native vs Hybrid vs Cross-Platform ?
Confused about Native vs Hybrid vs Cross-Platform ?Confused about Native vs Hybrid vs Cross-Platform ?
Confused about Native vs Hybrid vs Cross-Platform ?Rosalie Lauren
 
Native, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your businessNative, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your businessMarkovate
 
Mobile app development
Mobile app developmentMobile app development
Mobile app developmentSanjay Kumar
 
Best cross platform app development frameworks for 2021
Best cross platform app development frameworks for 2021Best cross platform app development frameworks for 2021
Best cross platform app development frameworks for 2021Omega_UAE
 

Similaire à Pick Your Poison – Mobile Web, Native, or Hybrid? - Denver Startup Week - October 24, 2012 (20)

UNIT_1_1626771386169.ppt
UNIT_1_1626771386169.pptUNIT_1_1626771386169.ppt
UNIT_1_1626771386169.ppt
 
Types of mobile apps mobile app development
Types of mobile apps  mobile app developmentTypes of mobile apps  mobile app development
Types of mobile apps mobile app development
 
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptx
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptxMOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptx
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptx
 
When to choose and avoid react native for mobile app development
When to choose and avoid react native for mobile app developmentWhen to choose and avoid react native for mobile app development
When to choose and avoid react native for mobile app development
 
Hybrid app development
Hybrid app developmentHybrid app development
Hybrid app development
 
Top Advantages of Cross Platform Mobile App Development
Top Advantages of Cross Platform Mobile App DevelopmentTop Advantages of Cross Platform Mobile App Development
Top Advantages of Cross Platform Mobile App Development
 
Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...
Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...
Which Mobile App Development Process Is Right for You: Native, Hybrid, or Cro...
 
Native, Web App, or Hybrid: Which Should You Choose?
Native, Web App, or Hybrid: Which Should You Choose?Native, Web App, or Hybrid: Which Should You Choose?
Native, Web App, or Hybrid: Which Should You Choose?
 
Mobile Development Platforms
Mobile Development PlatformsMobile Development Platforms
Mobile Development Platforms
 
Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...
Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...
Native, Hybrid, or Cross-platform Development? What Type of Mobile App is Bes...
 
MOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARI
MOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARIMOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARI
MOBILE APPLICATIONS DEVELOPMENT -ANDROID BY SIVASANKARI
 
Hybrid Mobile App
Hybrid Mobile AppHybrid Mobile App
Hybrid Mobile App
 
Hybrid mobile app
Hybrid mobile appHybrid mobile app
Hybrid mobile app
 
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...
 
Mobile Application Development with WP7 & Others
Mobile Application Development with WP7 & OthersMobile Application Development with WP7 & Others
Mobile Application Development with WP7 & Others
 
Confused about Native vs Hybrid vs Cross-Platform ?
Confused about Native vs Hybrid vs Cross-Platform ?Confused about Native vs Hybrid vs Cross-Platform ?
Confused about Native vs Hybrid vs Cross-Platform ?
 
Native, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your businessNative, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your business
 
Mobile app development
Mobile app developmentMobile app development
Mobile app development
 
Best cross platform app development frameworks for 2021
Best cross platform app development frameworks for 2021Best cross platform app development frameworks for 2021
Best cross platform app development frameworks for 2021
 
Mobile apps Intro
Mobile apps IntroMobile apps Intro
Mobile apps Intro
 

Dernier

Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clashcharlottematthew16
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
Vector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesVector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesZilliz
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationSafe Software
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebUiPathCommunity
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfSeasiaInfotech2
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piececharlottematthew16
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr LapshynFwdays
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024The Digital Insurer
 

Dernier (20)

Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clash
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
Vector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesVector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector Databases
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio Web
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck Presentation
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdf
 
DMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special EditionDMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special Edition
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piece
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024
 

Pick Your Poison – Mobile Web, Native, or Hybrid? - Denver Startup Week - October 24, 2012

  • 1. Pick Your Poison – Mobile Web, Native, or Hybrid?
  • 2. Introduction Shane Church | Technical Lead shane.church@effectiveui.com Blog: http://www.s-church.net http://www.effectiveui.com Twitter: #effectiveui
  • 4. Why Does Your Mobile Experience Matter?
  • 5. Say if a mobile 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 an app based on a review or 66% recommendation Have recommended an app because of a positive 57% experience -Harris Interactive, November 2010
  • 7. Worldwide Smartphone Market Share 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 What do each of the technology choices entail?
  • 9. Mobile Web Accessed over the 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 a combination 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 platform native 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 What does Facebook’s switch from HTML5 to native on iOS mean?
  • 18. Facebook abandons HTML5 on iOS InfoWorld – September 6, 2012 Facebook Kisses HTML5 Goodbye With Rebuilt iOS App MacNewsWorld – August 25, 2012
  • 19. “We deliberately made a 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 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
  • 21. How to Pick Your Poison A guide to selecting the right technology approach for your application
  • 22.
  • 23. Ruling Out the Mobile 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  Does the 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 a Hybrid?  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?
  • 26.
  • 27. Case Study How I Addressed This Question For An EffectiveUI Client
  • 28. Cartegraph  Targeting Municipal Governments  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
  • 30. The User Is Key
  • 31. We now have the 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 No One Right Answer Remember That User Experience Matters
  • 33. Recommended Tools and References
  • 34. Mobile Web Development Tools  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 MVC 3 - 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
  • 39. Download These Slides http://www.slideshare.net/effectiveui Questions and Discussion Shane Church | Technical Lead shane.church@effectiveui.com Blog: http://www.s-church.net http://www.effectiveui.com Twitter: #effectiveui

Notes de l'éditeur

  1. 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
  2. Raise your hand if your have an iPhone? Android? Windows Phone? Something else?Raise your hand if you have changed devices in the past year?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)
  3. 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
  4. Screenshots of Mobile Web
  5. 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
  6. Hybrid Screenshots
  7. Tools tend to be OS specific (iOS only on Mac, Windows Phone only on Windows)Any solution leaves out significant percentages of the market
  8. 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
  9. NativeScreenshotsPearson eCollege White Label App by EffectiveUINative for each platform
  10. The key point here is user expectationsUsers have different expectations
  11. Despite the headlines, the Web is still incredibly important.Lesson here is that you don’t need “an app.”
  12. 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
  13. 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
  14. 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
  15. These are all gray area questions
  16. 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.
  17. Use MSDN screenshots here
  18. 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
  19. PhoneGap and RhoMobile are free.Most of the others have “freemium” offerings
  20. Printed copies of my MSDN article are available up front following the presentation