SlideShare a Scribd company logo
1 of 84
Download to read offline
Native
                  vs
            Web
                  vs
        Hybrid
Mobile Development Choices
Jason Grigsby • Web Visions 2009
 @grigs on Twitter • jason@cloudfour.com
   cloudfour.com • userfirstweb.com
           mobileportand.com
Early 2008
“It’s about usage. Not units”

• Number of queries on Google search from iPhones surpassed those
  from Symbian-based phones in the days after Christmas. Nokia’s
  Symbian-based phones are 40% of the market worldwide.

• German iPhone users consume 30 times more data.

• 95% of iPhone customers regularly surf the Internet. Data services
  revenue increased from $2.7 billion in 2005 to $6.9 billion in 2007.

• Google sees 50 times the number of searches using the iPhone than
  any other mobile device. They were so surprised, they asked their
  engineers to check the logs to make sure it was correct.

• This is why major companies, Google, Quicken, etc. are all launching
  iPhone-optimized services despite the iPhone’s 1% market share.
Surprise Story of 2008




Flickr photo by Drift Words: http://www.flickr.com/photos/44124413076@N01/11846265/
Flickr photo by Civisi: http://www.flickr.com/photos/civisi/2611679744/




      Web 2.0                                            iPhone App Store
 Web-based Apps                                             Native Apps
Services & Mashups                                     Few APIs between apps
Software as Service                                     No Recurring Revenue
 Cloud Computing                                           Local Storage
http://www.readwriteweb.com/archives/top_10_web_platforms_of_2008.php
What makes the App Store successful?
                       Carriers                App Store

                                            Open to anyone
  Openness      Closed, Seek permission
                                          who signs agreement

  Entry Cost     Thousands of dollars              $99


Revenue Split       60/40 to 50/50                70/30


 Restrictions            Many                     Few


  Releases          Difficult, Timely          1 to 2 weeks


Micropayments        Inconsistent         iTunes for every phone
30 million
http://blog.wired.com/gadgets/2009/02/shoot-is-iphone.html#c148364123
                                                                                               devices

                                                                                               40,000
http://www.newsweek.com/id/174266
                                                                                                apps

                                                                                               1 billion
http://businessweek.com/@@0M43kIYQYKPISw0A/technology/content/sep2008/tc20080930_257832.htm   downloads
Gold Rush was On
Source: http://gizmodo.com/5199933/giz-explains-all-the-smartphone-mobile-app-stores
Ringtone Apps




(FYI: Justin’s app is out soon. FitnessTrack. $2.99)

                 http://twitter.com/justin/status/1210786170
                 http://furbo.org/2008/12/09/ring-tone-apps/
                  http://furbo.org/2009/02/16/raising-prices/
Ringtone Apps

15000



11250



7500



3750



    0
        0   1.99   3.99     5.99       7.99          9.99   11.99   13.99   15.99+


                          http://148apps.com/10000
Brutally Honest iPhone App Sales:
     $32k Spent vs. $535 Revenue
Dapple




 http://www.streamingcolour.com/blog/2009/03/09/the-numbers-post-aka-brutal-honesty/
Throwaway Apps




http://www.pinchmedia.com/appstore-secrets/
Throwaway Apps




http://www.pinchmedia.com/appstore-secrets/
Pinch Media’s Conclusions

•Users stop using the average applications
 quickly.

•Long-term audiences are generally 1% of
 total downloads

•Paid apps retain users longer, but still
 steep drop off.


          http://www.pinchmedia.com/appstore-secrets/
Success Determined by Top Lists & Features




        http://appcubby.com/blog/files/financial_realities.html
More Open ≠ No Gatekeeper




    96%
    Approved
   (what about that 4%?)
10 Rejected Applications
                                                              •   Obama Trampoline
                                                              •   MyShoe
                                                              •   I Am Poor
                                                              •   The South Park App
                                                              •   Pull My Finger
                                                              •   iBoobs
                                                              •   Slasher
                                                              •   Murderdome
                                                              •   Podcaster
                                                              •   Freedom Time
                                                          quot;Even though my personal political leanings are
                                                          Democratic, I think this app will be offensive to roughly
                                                          half our customers. What's the point?quot; — Steve Jobs




http://www.pcworld.com/article/159887-2/rejected_10_iphone_apps_that_didnt_make_apples_app_store.html
http://www.pcworld.com/article/159887-2/rejected_10_iphone_apps_that_didnt_make_apples_app_store.html
http://twitter.com/trent_reznor/status/1681690305
http://bits.blogs.nytimes.com/2009/04/30/the-hundred-million-dollar-mobile-app-question/
iPhone Only Part of World Wide Market
   Symbian        RIM            Windows Mobile                iPhone       Linux
   Palm OS        Other
                                                                             20000

 17949

                                                                            15000



                                                                            10000

         7443

                 4714
                                                                        5000
                           4079
                                      3195
                                                                        0
                                                 327           437
     Q4 2008 Smartphone Sales — Thousands of Units
                http://www.gartner.com/it/page.jsp?id=910112
iPhone Only Part of US Market

1.RIM BlackBerry Curve (all 83XX models)
2.Apple iPhone 3G (all models)
3.RIM BlackBerry Storm
4.RIM BlackBerry Pearl (all models, except flip)
5.T-Mobile G1

       Blackberry 50% Marketshare
               Q1 2009 Sales According to NPD
           http://www.npd.com/press/releases/press_090504.html
3.3
                                         Billion
                                           Mobile phone for
                                           half the planet.




Flickr photo by Pingnews: http://www.flickr.com/photos/pingnews/370061022/
3.3 Billion in Perspective




Source: http://communities-dominate.blogs.com/brands/2007/01/putting_27_bill.html
   http://communities-dominate.blogs.com/brands/2008/01/when-there-is-a.html
2007 SMS Revenue: 100 billion




Flickr photo by Vlastula: http://www.flickr.com/photos/vlastula/450642954/
2007 SMS Revenue: 100 billion




                                                                            •Box Office
                                                                            •DVD Sales & Rentals
          Combined                                                          •Music Industry
                                                                            •Video Games
Flickr photo by Vlastula: http://www.flickr.com/photos/vlastula/450642954/
BMW Turned $70k MMS into $45M Revenue
Symbian                     Windows Mobile

Objective C              WebOS
                                                                     C


        Java ME                 Dalvik
                                                                            Palm
                        Visual Basic
  C++

        .NET Compact
                                             BREW
              Flickr photo by André-Batista: http://www.flickr.com/photo_zoom.gne?id=408700622&size=o
Google Mobile — App Challenges
                  • Pressure from CEO for rapid releases

                  • 10+ platforms to support

                  • Over 100 different builds




http://www.flickr.com/photos/83731031@N00/445924458/ • http://www.flickr.com/photos/mcdave/142758127/
                         http://www.flickr.com/photos/nataliejohnson/290541732/
Fragmentation:
      This is what the
      web is supposed
          to solve.




Flickr photo by .Hessam: http://www.flickr.com/photos/essamo/1070527547/
Mobile Web Doubled in 2008
                              Jan 08                             Jan 09



                    10821
        Daily
                               22369



                    10312
      Weekly
                            19283



                                               36870
Ever in Month
                                                                               63182


                0            17500               35000               52500             70000

                                     Unique Users (000s)
                        http://www.comscore.com/press/release.asp?press=2752
Mobile Internet to Grow Despite Recession

  Average intended usage increase over the next 24 months


                                                       U.S.          Europe


        Current Users                                  58%            55%


          Non-Users                                    27%            28%




              http://www.tellabs.com/news/2009/index.cfm/nr/53.cfm
Top Five Services Non-users Intend
to Start Using in the Next 24 Months

                        U.S.     Europe

    Mobile Internet     49%       34%

        MMS             38%       39%

  Uploading Photos      34%       27%

Software/app download   30%       30%

        Email           28%       32%
The Hope for Mobile


                         What is the
                         likelihood of
                        exponential
                       growth for the
                      Internet on Mobile
                          Devices?
Opera Mini Traffic Increases
Usage up 157% year-over-year




       http://www.opera.com/media/smw/
Mobile Web Distribution
                     Carriers               App Store            Mobile Web

                   Closed, Seek          Open to anyone
  Openness                                                      Completely Open
                    permission         who signs agreement

  Entry Cost    Thousands of dollars            $99                  None


Revenue Split     60/40 to 50/50               70/30                100%


 Restrictions          Many                    Few                   None


  Releases        Difficult, Timely         1 to 2 weeks          Instantaneous


Micropayments       Inconsistent       iTunes for every phone       Not yet
Ok Hot Shot, How are You Going to Create
    Super Monkey Ball with HTML?
Ok Hot Shot, How are You Going to Create
    Super Monkey Ball with HTML?


                            <div id=”bridge”
                            class=”rope”>



                            <div id=”bubble”>
                            <span id=”monkey sprite-
                            replace”>
                            Monkey</span>



                             jquery-banana.js
Ok Hot Shot, How are You Going to Create
    Super Monkey Ball with HTML?


                            <div id=”bridge”
                            class=”rope”>



                            <div id=”bubble”>
                            <span id=”monkey sprite-
                            replace”>
                            Monkey</span>



                             jquery-banana.js




  Some Applications Have to Be Native
Five Common Reasons for Native Apps



                         Performance

                         Offline Mode

                              Findability

                  Device Attributes

                         Monetization
  Flickr photo by John Wardell (Netinho): http://www.flickr.com/photo_zoom.gne?id=760902403&size=l
Not for all applications

Good enough for many applications

Javascript Performance improving

   Hardware Accelerated CSS

  Web developers must improve



                         Flickr: Uploaded February 11, 2007 by hawridger
Javascript Speed Wars




                http://webkit.org/blog/189/announcing-squirrelfish/
              http://news.cnet.com/8301-1001_3-10030888-92.html
http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html
            http://webkit.org/blog/214/introducing-squirrelfish-extreme/
Javascript Speed Wars




                http://webkit.org/blog/189/announcing-squirrelfish/
              http://news.cnet.com/8301-1001_3-10030888-92.html
http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html
            http://webkit.org/blog/214/introducing-squirrelfish-extreme/
Javascript Speed Wars




                http://webkit.org/blog/189/announcing-squirrelfish/
              http://news.cnet.com/8301-1001_3-10030888-92.html
http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html
            http://webkit.org/blog/214/introducing-squirrelfish-extreme/
Javascript Speed Wars




                http://webkit.org/blog/189/announcing-squirrelfish/
              http://news.cnet.com/8301-1001_3-10030888-92.html
http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html
            http://webkit.org/blog/214/introducing-squirrelfish-extreme/
Javascript Speed Wars




                http://webkit.org/blog/189/announcing-squirrelfish/
              http://news.cnet.com/8301-1001_3-10030888-92.html
http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html
            http://webkit.org/blog/214/introducing-squirrelfish-extreme/
We’ve Become Bandwidth Gluttons

                                                     Since 2003:

                                                     • Web       Page Size Tripled
                                                     •#    of Objects Doubled

                                                     Since 1995:

                                                     • Web       Page Size: 22x
                                                     •#    of Objects: 21x


       Source: http://www.websiteoptimization.com/speed/tweak/average-web-page/
Yahoo!’s 14 Performance Rules (Now 34!)

1. Make Fewer HTTP Requests                          8. Make JavaScript and CSS External


2. Use a Content Delivery Network                    9. Reduce DNS Lookups


3. Add an Expires Header                             10.Minify JavaScript


4. Gzip Components                                   11.Avoid Redirects


5. Put Stylesheets at the Top                        12.Remove Duplicate Scripts


6. Move Scripts to the Bottom                        13.Configure ETags


7. Avoid CSS Expressions                             14.Make AJAX Cacheable

                     Source: http://developer.yahoo.com/performance/rules.html
Offline Support

• HTML 5


  • Client-side Database Storage API


  • Application Cache


• Essentially SQLite in browser


• Available on iPhone since 2.0


• Google Gears, Android, Nokia soon?
Gmail Using HTML5
25,000 Apps

          &

  Findability?


http://148apps.com/10000
“It all depends on the application, of course,” says

Mauro Montanaro, [Fox Mobile CEO] “and whether

they are paid or free.” But he also notes that the

“discoverability” of iPhone apps is becoming a bigger

problem, and that some of the marketing tactics that

Fox Mobile has used successfully on other handsets

just don’t work on the iPhone.

“The question, as usual, is placement. Who determines


[editorial placement]? Maybe someone out of Cupertino.”
Geolocation API

   Camera

Address Book

Accelerometer
Flickr photo by Lyza Gardner: http://www.flickr.com/photos/lyza/49545547/
Flickr photo by Thomas Purves: http://www.flickr.com/photos/thomaspurves/744225198/
http://phonegap.com
What Can You Do With PhoneGap?




              http://phonegap.com/projects
Other Hybrid Approaches

                    • QuickConnect
                      http://quickconnect.pbworks.com

                    • Rhomobile
                      http://rhomobile.com

                    • Big 5
                      http://big5apps.com/
Hybrid
Apps?

 Yes
 we
 can
Mobile Progressive Enhancement
                             [content]




   http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
Mobile Progressive Enhancement
                             [content]

  WURFL




   http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
Mobile Progressive Enhancement
                             [content]

  WURFL




   http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
Mobile Progressive Enhancement
                             [content]

  WURFL                                                                 Phone Gap
                                                                            Add Functionality




   http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
Mobile Progressive Enhancement
                             [content]

  WURFL                                                                 Phone Gap
                                                                            Add Functionality




   http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
Keys to Successful Hybrid Apps

•Make the experience feel like a native application

•Take advantage of the enhanced features

•Don’t simply release a hybrid version of the mobile web

•Optimize performance

•Plan your marketing
Flickr photo by MarkKelley: http://www.flickr.com/photos/markkelley/1022720488/
Thank You for Your Time!




Work: http://cloudfour.com • Blog: http://userfirstweb.com • Twitter: @grigs
                 Mobile Portland: http://mobileportland.com
              Flickr photo by Pingnews: http://www.flickr.com/photos/pingnews/370061022/

More Related Content

What's hot

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
 

What's hot (20)

Secured Mobile Application Development in Android, Blackberry & iOS
Secured Mobile Application Development in Android, Blackberry & iOSSecured Mobile Application Development in Android, Blackberry & iOS
Secured Mobile Application Development in Android, Blackberry & iOS
 
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 Means Business
Mobile Means BusinessMobile Means Business
Mobile Means Business
 
Introduction to mobile application development
Introduction to mobile application developmentIntroduction to mobile application development
Introduction to mobile application development
 
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)
 
Mobile Development Overview
Mobile Development OverviewMobile Development Overview
Mobile Development Overview
 
QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10
 
Apps
AppsApps
Apps
 
Introduction To Mobile Application Development
Introduction To Mobile Application DevelopmentIntroduction To Mobile Application Development
Introduction To Mobile Application Development
 
Native vs Hybrid vs Web
Native vs Hybrid vs WebNative vs Hybrid vs Web
Native vs Hybrid vs Web
 
Distimo Mobile World Congress 2010 Presentation - Mobile Application Stores S...
Distimo Mobile World Congress 2010 Presentation - Mobile Application Stores S...Distimo Mobile World Congress 2010 Presentation - Mobile Application Stores S...
Distimo Mobile World Congress 2010 Presentation - Mobile Application Stores S...
 
Tk2323 lecture 1 introduction to mobile application
Tk2323 lecture 1   introduction to mobile applicationTk2323 lecture 1   introduction to mobile application
Tk2323 lecture 1 introduction to mobile application
 
Mobile Application Development
Mobile Application DevelopmentMobile Application Development
Mobile Application Development
 
The Mobile Ecosystem
The Mobile EcosystemThe Mobile Ecosystem
The Mobile Ecosystem
 
Project of mobile apps
Project of mobile appsProject of mobile apps
Project of mobile apps
 
Mobile application development
Mobile application developmentMobile application development
Mobile application development
 
Introduction to Mobile Development
Introduction to Mobile DevelopmentIntroduction to Mobile Development
Introduction to Mobile Development
 
Mobile for B2B: Native or Web?
Mobile for B2B: Native or Web?Mobile for B2B: Native or Web?
Mobile for B2B: Native or Web?
 
Singapore Mobile 2.0 & Ux Trends 2009: Scott Weiss
Singapore Mobile 2.0 & Ux Trends 2009: Scott WeissSingapore Mobile 2.0 & Ux Trends 2009: Scott Weiss
Singapore Mobile 2.0 & Ux Trends 2009: Scott Weiss
 
Mobile Developer's Guide To The Galaxy 12th Edition
Mobile Developer's Guide To The Galaxy 12th EditionMobile Developer's Guide To The Galaxy 12th Edition
Mobile Developer's Guide To The Galaxy 12th Edition
 

Viewers also liked

5 Steps for Developing Successful Business Apps
5 Steps for Developing Successful Business Apps 5 Steps for Developing Successful Business Apps
5 Steps for Developing Successful Business Apps
Paul Coleman
 

Viewers also liked (20)

Html5, Native and Platform based Mobile Applications
Html5, Native and Platform based Mobile ApplicationsHtml5, Native and Platform based Mobile Applications
Html5, Native and Platform based Mobile Applications
 
Html5 vs Flash video
Html5 vs Flash videoHtml5 vs Flash video
Html5 vs Flash video
 
JavaFX vs AJAX vs Flex
JavaFX vs AJAX vs FlexJavaFX vs AJAX vs Flex
JavaFX vs AJAX vs Flex
 
Taking HTML5 video a step further
Taking HTML5 video a step furtherTaking HTML5 video a step further
Taking HTML5 video a step further
 
State of Media Accessibility in HTML5
State of Media Accessibility in HTML5State of Media Accessibility in HTML5
State of Media Accessibility in HTML5
 
Html5 Open Video Tutorial
Html5 Open Video TutorialHtml5 Open Video Tutorial
Html5 Open Video Tutorial
 
An overview of JavaScript
An overview of JavaScriptAn overview of JavaScript
An overview of JavaScript
 
Trivadis TechEvent 2016 State of the Private Cloud - Oracle Edition by Bernha...
Trivadis TechEvent 2016 State of the Private Cloud - Oracle Edition by Bernha...Trivadis TechEvent 2016 State of the Private Cloud - Oracle Edition by Bernha...
Trivadis TechEvent 2016 State of the Private Cloud - Oracle Edition by Bernha...
 
Performance myths in android
Performance myths in androidPerformance myths in android
Performance myths in android
 
Tech Talk: I need to develop a mobile app, but how do I get started?
 Tech Talk: I need to develop a mobile app, but how do I get started? Tech Talk: I need to develop a mobile app, but how do I get started?
Tech Talk: I need to develop a mobile app, but how do I get started?
 
Connected & Disconnected Apps with Azure Mobile Apps
Connected & Disconnected Apps with Azure Mobile AppsConnected & Disconnected Apps with Azure Mobile Apps
Connected & Disconnected Apps with Azure Mobile Apps
 
FXML for Structure, CSS for Styling and JavaFX as Standard GUI Library
FXML for Structure, CSS for Styling and JavaFX as Standard GUI LibraryFXML for Structure, CSS for Styling and JavaFX as Standard GUI Library
FXML for Structure, CSS for Styling and JavaFX as Standard GUI Library
 
Hybrid vs Native vs Web Apps
Hybrid vs Native vs Web AppsHybrid vs Native vs Web Apps
Hybrid vs Native vs Web Apps
 
Desktop|Embedded Application API JSR
Desktop|Embedded Application API JSRDesktop|Embedded Application API JSR
Desktop|Embedded Application API JSR
 
Java Swing vs. Android App
Java Swing vs. Android AppJava Swing vs. Android App
Java Swing vs. Android App
 
Elements of E-commerce: How Digital Storytelling Drives Revenue and Results
Elements of E-commerce: How Digital Storytelling Drives Revenue and ResultsElements of E-commerce: How Digital Storytelling Drives Revenue and Results
Elements of E-commerce: How Digital Storytelling Drives Revenue and Results
 
Continuous Cross Platform Mobile App Development using Jenkins Build Server
Continuous Cross Platform Mobile App Development using Jenkins Build ServerContinuous Cross Platform Mobile App Development using Jenkins Build Server
Continuous Cross Platform Mobile App Development using Jenkins Build Server
 
The Big Easy: Native Mobile App Development with Appcelerator Titanium and Ja...
The Big Easy: Native Mobile App Development with Appcelerator Titanium and Ja...The Big Easy: Native Mobile App Development with Appcelerator Titanium and Ja...
The Big Easy: Native Mobile App Development with Appcelerator Titanium and Ja...
 
5 Steps for Developing Successful Business Apps
5 Steps for Developing Successful Business Apps 5 Steps for Developing Successful Business Apps
5 Steps for Developing Successful Business Apps
 
HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?
 

Similar to Native vs. Mobile Web vs. Hybrid Apps for Mobile Development

Mobile first luke wroblewski
Mobile first luke wroblewskiMobile first luke wroblewski
Mobile first luke wroblewski
Jakub Horoszko
 
Future of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav NoremFuture of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav Norem
MobileMonday Norway
 

Similar to Native vs. Mobile Web vs. Hybrid Apps for Mobile Development (20)

Mobile Developement Choises
Mobile Developement ChoisesMobile Developement Choises
Mobile Developement Choises
 
Native vs. Web vs. Hybrid: Mobile Development Choices
Native vs. Web vs. Hybrid: Mobile Development ChoicesNative vs. Web vs. Hybrid: Mobile Development Choices
Native vs. Web vs. Hybrid: Mobile Development Choices
 
Mobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4MobileMobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4Mobile
 
Where 2.0 — Native vs Web vs Hybrid: Mobile Development Choices
Where 2.0 — Native vs Web vs Hybrid: Mobile Development ChoicesWhere 2.0 — Native vs Web vs Hybrid: Mobile Development Choices
Where 2.0 — Native vs Web vs Hybrid: Mobile Development Choices
 
A review on mobile statistics
A review on mobile statisticsA review on mobile statistics
A review on mobile statistics
 
Mobile Web Vs Mobile Apps
Mobile Web Vs Mobile AppsMobile Web Vs Mobile Apps
Mobile Web Vs Mobile Apps
 
La musique via Internet et les réseaux mobiles
La musique via Internet et les réseaux mobilesLa musique via Internet et les réseaux mobiles
La musique via Internet et les réseaux mobiles
 
Ten reasons why now is the perfect time to get serious about the mobile web
Ten reasons why now is the perfect time to get serious about the mobile webTen reasons why now is the perfect time to get serious about the mobile web
Ten reasons why now is the perfect time to get serious about the mobile web
 
Mobile first luke wroblewski
Mobile first luke wroblewskiMobile first luke wroblewski
Mobile first luke wroblewski
 
Mobile input lukew
Mobile input lukewMobile input lukew
Mobile input lukew
 
It's about people, not devices...
It's about people, not devices...It's about people, not devices...
It's about people, not devices...
 
Its about people, not devices
Its about people, not devicesIts about people, not devices
Its about people, not devices
 
State of the Mobile Industry -- Innotech Portland
State of the Mobile Industry -- Innotech PortlandState of the Mobile Industry -- Innotech Portland
State of the Mobile Industry -- Innotech Portland
 
Mobile first. Luke Wroblewski
Mobile first. Luke WroblewskiMobile first. Luke Wroblewski
Mobile first. Luke Wroblewski
 
It's Raining App Stores
It's Raining App StoresIt's Raining App Stores
It's Raining App Stores
 
Smartphone Reporting Done Smarter
Smartphone Reporting Done SmarterSmartphone Reporting Done Smarter
Smartphone Reporting Done Smarter
 
Future of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav NoremFuture of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav Norem
 
SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101
 
Mobile Tsunami
Mobile TsunamiMobile Tsunami
Mobile Tsunami
 
The Mobile Web for PR Pros
The Mobile Web for PR ProsThe Mobile Web for PR Pros
The Mobile Web for PR Pros
 

More from Jason Grigsby

Mobile First Responsive Web Design — BD Conf Oct 2013
Mobile First Responsive Web Design — BD Conf Oct 2013Mobile First Responsive Web Design — BD Conf Oct 2013
Mobile First Responsive Web Design — BD Conf Oct 2013
Jason Grigsby
 
When responsive web design meets the real world
When responsive web design meets the real worldWhen responsive web design meets the real world
When responsive web design meets the real world
Jason Grigsby
 

More from Jason Grigsby (20)

Planning Your Progressive Web App
Planning Your Progressive Web AppPlanning Your Progressive Web App
Planning Your Progressive Web App
 
Progressive Web App Challenges
Progressive Web App ChallengesProgressive Web App Challenges
Progressive Web App Challenges
 
Why Progressive Web Apps will transform your website
Why Progressive Web Apps will transform your websiteWhy Progressive Web Apps will transform your website
Why Progressive Web Apps will transform your website
 
The Case for Progressive Web Apps
The Case for Progressive Web AppsThe Case for Progressive Web Apps
The Case for Progressive Web Apps
 
Adapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYCAdapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYC
 
Responsive images are here. Now what?
Responsive images are here. Now what?Responsive images are here. Now what?
Responsive images are here. Now what?
 
Mobile First Responsive Web Design — BD Conf Oct 2013
Mobile First Responsive Web Design — BD Conf Oct 2013Mobile First Responsive Web Design — BD Conf Oct 2013
Mobile First Responsive Web Design — BD Conf Oct 2013
 
Responsive Images and Video
Responsive Images and VideoResponsive Images and Video
Responsive Images and Video
 
When responsive web design meets the real world
When responsive web design meets the real worldWhen responsive web design meets the real world
When responsive web design meets the real world
 
Adaptive Input — Breaking Development Conference, San Diego
Adaptive Input — Breaking Development Conference, San DiegoAdaptive Input — Breaking Development Conference, San Diego
Adaptive Input — Breaking Development Conference, San Diego
 
Mobile First Responsive Design
Mobile First Responsive DesignMobile First Responsive Design
Mobile First Responsive Design
 
Casting Off Our Desktop Shackles
Casting Off Our Desktop ShacklesCasting Off Our Desktop Shackles
Casting Off Our Desktop Shackles
 
The Immobile Web
The Immobile WebThe Immobile Web
The Immobile Web
 
Mobile: The Market, The Web and Windows Phone’s Future
Mobile: The Market, The Web and Windows Phone’s Future Mobile: The Market, The Web and Windows Phone’s Future
Mobile: The Market, The Web and Windows Phone’s Future
 
Native is easy. Mobile web is freaking hard.
Native is easy. Mobile web is freaking hard.Native is easy. Mobile web is freaking hard.
Native is easy. Mobile web is freaking hard.
 
Innotech - Get Me a Mobile Strategy or You’re Fired!
Innotech - Get Me a Mobile Strategy or You’re Fired!Innotech - Get Me a Mobile Strategy or You’re Fired!
Innotech - Get Me a Mobile Strategy or You’re Fired!
 
Where 2.0 -- Get me a mobile strategy or you’re fired!
Where 2.0 -- Get me a mobile strategy or you’re fired!Where 2.0 -- Get me a mobile strategy or you’re fired!
Where 2.0 -- Get me a mobile strategy or you’re fired!
 
Native is easy. Web is essential.
Native is easy. Web is essential.Native is easy. Web is essential.
Native is easy. Web is essential.
 
Journalism and the Future of Mobile
Journalism and the Future of MobileJournalism and the Future of Mobile
Journalism and the Future of Mobile
 
Get Me a Mobile Strategy or You're Fired - Central Oregon Ad Fed
Get Me a Mobile Strategy or You're Fired  - Central Oregon Ad FedGet Me a Mobile Strategy or You're Fired  - Central Oregon Ad Fed
Get Me a Mobile Strategy or You're Fired - Central Oregon Ad Fed
 

Recently uploaded

Breaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdfBreaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdf
UK Journal
 
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
FIDO Alliance
 
Structuring Teams and Portfolios for Success
Structuring Teams and Portfolios for SuccessStructuring Teams and Portfolios for Success
Structuring Teams and Portfolios for Success
UXDXConf
 

Recently uploaded (20)

Breaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdfBreaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdf
 
Working together SRE & Platform Engineering
Working together SRE & Platform EngineeringWorking together SRE & Platform Engineering
Working together SRE & Platform Engineering
 
Google I/O Extended 2024 Warsaw
Google I/O Extended 2024 WarsawGoogle I/O Extended 2024 Warsaw
Google I/O Extended 2024 Warsaw
 
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
 
Overview of Hyperledger Foundation
Overview of Hyperledger FoundationOverview of Hyperledger Foundation
Overview of Hyperledger Foundation
 
The Metaverse: Are We There Yet?
The  Metaverse:    Are   We  There  Yet?The  Metaverse:    Are   We  There  Yet?
The Metaverse: Are We There Yet?
 
AI mind or machine power point presentation
AI mind or machine power point presentationAI mind or machine power point presentation
AI mind or machine power point presentation
 
1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT
1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT
1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT
 
WebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM PerformanceWebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM Performance
 
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdfLinux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
 
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
 
Structuring Teams and Portfolios for Success
Structuring Teams and Portfolios for SuccessStructuring Teams and Portfolios for Success
Structuring Teams and Portfolios for Success
 
Event-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream ProcessingEvent-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream Processing
 
How we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfHow we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdf
 
Microsoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - QuestionnaireMicrosoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - Questionnaire
 
Intro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджераIntro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджера
 
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The InsideCollecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
 
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdfIntroduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
 
Portal Kombat : extension du réseau de propagande russe
Portal Kombat : extension du réseau de propagande russePortal Kombat : extension du réseau de propagande russe
Portal Kombat : extension du réseau de propagande russe
 
Continuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on ThanabotsContinuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
 

Native vs. Mobile Web vs. Hybrid Apps for Mobile Development

  • 1. Native vs Web vs Hybrid Mobile Development Choices Jason Grigsby • Web Visions 2009 @grigs on Twitter • jason@cloudfour.com cloudfour.com • userfirstweb.com mobileportand.com
  • 2.
  • 3.
  • 5. “It’s about usage. Not units” • Number of queries on Google search from iPhones surpassed those from Symbian-based phones in the days after Christmas. Nokia’s Symbian-based phones are 40% of the market worldwide. • German iPhone users consume 30 times more data. • 95% of iPhone customers regularly surf the Internet. Data services revenue increased from $2.7 billion in 2005 to $6.9 billion in 2007. • Google sees 50 times the number of searches using the iPhone than any other mobile device. They were so surprised, they asked their engineers to check the logs to make sure it was correct. • This is why major companies, Google, Quicken, etc. are all launching iPhone-optimized services despite the iPhone’s 1% market share.
  • 6.
  • 7. Surprise Story of 2008 Flickr photo by Drift Words: http://www.flickr.com/photos/44124413076@N01/11846265/
  • 8. Flickr photo by Civisi: http://www.flickr.com/photos/civisi/2611679744/ Web 2.0 iPhone App Store Web-based Apps Native Apps Services & Mashups Few APIs between apps Software as Service No Recurring Revenue Cloud Computing Local Storage
  • 10. What makes the App Store successful? Carriers App Store Open to anyone Openness Closed, Seek permission who signs agreement Entry Cost Thousands of dollars $99 Revenue Split 60/40 to 50/50 70/30 Restrictions Many Few Releases Difficult, Timely 1 to 2 weeks Micropayments Inconsistent iTunes for every phone
  • 11. 30 million http://blog.wired.com/gadgets/2009/02/shoot-is-iphone.html#c148364123 devices 40,000 http://www.newsweek.com/id/174266 apps 1 billion http://businessweek.com/@@0M43kIYQYKPISw0A/technology/content/sep2008/tc20080930_257832.htm downloads
  • 13.
  • 15.
  • 16. Ringtone Apps (FYI: Justin’s app is out soon. FitnessTrack. $2.99) http://twitter.com/justin/status/1210786170 http://furbo.org/2008/12/09/ring-tone-apps/ http://furbo.org/2009/02/16/raising-prices/
  • 17. Ringtone Apps 15000 11250 7500 3750 0 0 1.99 3.99 5.99 7.99 9.99 11.99 13.99 15.99+ http://148apps.com/10000
  • 18. Brutally Honest iPhone App Sales: $32k Spent vs. $535 Revenue Dapple http://www.streamingcolour.com/blog/2009/03/09/the-numbers-post-aka-brutal-honesty/
  • 21. Pinch Media’s Conclusions •Users stop using the average applications quickly. •Long-term audiences are generally 1% of total downloads •Paid apps retain users longer, but still steep drop off. http://www.pinchmedia.com/appstore-secrets/
  • 22. Success Determined by Top Lists & Features http://appcubby.com/blog/files/financial_realities.html
  • 23. More Open ≠ No Gatekeeper 96% Approved (what about that 4%?)
  • 24. 10 Rejected Applications • Obama Trampoline • MyShoe • I Am Poor • The South Park App • Pull My Finger • iBoobs • Slasher • Murderdome • Podcaster • Freedom Time quot;Even though my personal political leanings are Democratic, I think this app will be offensive to roughly half our customers. What's the point?quot; — Steve Jobs http://www.pcworld.com/article/159887-2/rejected_10_iphone_apps_that_didnt_make_apples_app_store.html
  • 27.
  • 28.
  • 30. iPhone Only Part of World Wide Market Symbian RIM Windows Mobile iPhone Linux Palm OS Other 20000 17949 15000 10000 7443 4714 5000 4079 3195 0 327 437 Q4 2008 Smartphone Sales — Thousands of Units http://www.gartner.com/it/page.jsp?id=910112
  • 31. iPhone Only Part of US Market 1.RIM BlackBerry Curve (all 83XX models) 2.Apple iPhone 3G (all models) 3.RIM BlackBerry Storm 4.RIM BlackBerry Pearl (all models, except flip) 5.T-Mobile G1 Blackberry 50% Marketshare Q1 2009 Sales According to NPD http://www.npd.com/press/releases/press_090504.html
  • 32. 3.3 Billion Mobile phone for half the planet. Flickr photo by Pingnews: http://www.flickr.com/photos/pingnews/370061022/
  • 33. 3.3 Billion in Perspective Source: http://communities-dominate.blogs.com/brands/2007/01/putting_27_bill.html http://communities-dominate.blogs.com/brands/2008/01/when-there-is-a.html
  • 34. 2007 SMS Revenue: 100 billion Flickr photo by Vlastula: http://www.flickr.com/photos/vlastula/450642954/
  • 35. 2007 SMS Revenue: 100 billion •Box Office •DVD Sales & Rentals Combined •Music Industry •Video Games Flickr photo by Vlastula: http://www.flickr.com/photos/vlastula/450642954/
  • 36. BMW Turned $70k MMS into $45M Revenue
  • 37.
  • 38. Symbian Windows Mobile Objective C WebOS C Java ME Dalvik Palm Visual Basic C++ .NET Compact BREW Flickr photo by André-Batista: http://www.flickr.com/photo_zoom.gne?id=408700622&size=o
  • 39. Google Mobile — App Challenges • Pressure from CEO for rapid releases • 10+ platforms to support • Over 100 different builds http://www.flickr.com/photos/83731031@N00/445924458/ • http://www.flickr.com/photos/mcdave/142758127/ http://www.flickr.com/photos/nataliejohnson/290541732/
  • 40. Fragmentation: This is what the web is supposed to solve. Flickr photo by .Hessam: http://www.flickr.com/photos/essamo/1070527547/
  • 41. Mobile Web Doubled in 2008 Jan 08 Jan 09 10821 Daily 22369 10312 Weekly 19283 36870 Ever in Month 63182 0 17500 35000 52500 70000 Unique Users (000s) http://www.comscore.com/press/release.asp?press=2752
  • 42. Mobile Internet to Grow Despite Recession Average intended usage increase over the next 24 months U.S. Europe Current Users 58% 55% Non-Users 27% 28% http://www.tellabs.com/news/2009/index.cfm/nr/53.cfm
  • 43. Top Five Services Non-users Intend to Start Using in the Next 24 Months U.S. Europe Mobile Internet 49% 34% MMS 38% 39% Uploading Photos 34% 27% Software/app download 30% 30% Email 28% 32%
  • 44. The Hope for Mobile What is the likelihood of exponential growth for the Internet on Mobile Devices?
  • 45. Opera Mini Traffic Increases Usage up 157% year-over-year http://www.opera.com/media/smw/
  • 46.
  • 47. Mobile Web Distribution Carriers App Store Mobile Web Closed, Seek Open to anyone Openness Completely Open permission who signs agreement Entry Cost Thousands of dollars $99 None Revenue Split 60/40 to 50/50 70/30 100% Restrictions Many Few None Releases Difficult, Timely 1 to 2 weeks Instantaneous Micropayments Inconsistent iTunes for every phone Not yet
  • 48. Ok Hot Shot, How are You Going to Create Super Monkey Ball with HTML?
  • 49. Ok Hot Shot, How are You Going to Create Super Monkey Ball with HTML? <div id=”bridge” class=”rope”> <div id=”bubble”> <span id=”monkey sprite- replace”> Monkey</span> jquery-banana.js
  • 50. Ok Hot Shot, How are You Going to Create Super Monkey Ball with HTML? <div id=”bridge” class=”rope”> <div id=”bubble”> <span id=”monkey sprite- replace”> Monkey</span> jquery-banana.js Some Applications Have to Be Native
  • 51. Five Common Reasons for Native Apps Performance Offline Mode Findability Device Attributes Monetization Flickr photo by John Wardell (Netinho): http://www.flickr.com/photo_zoom.gne?id=760902403&size=l
  • 52. Not for all applications Good enough for many applications Javascript Performance improving Hardware Accelerated CSS Web developers must improve Flickr: Uploaded February 11, 2007 by hawridger
  • 53. Javascript Speed Wars http://webkit.org/blog/189/announcing-squirrelfish/ http://news.cnet.com/8301-1001_3-10030888-92.html http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html http://webkit.org/blog/214/introducing-squirrelfish-extreme/
  • 54. Javascript Speed Wars http://webkit.org/blog/189/announcing-squirrelfish/ http://news.cnet.com/8301-1001_3-10030888-92.html http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html http://webkit.org/blog/214/introducing-squirrelfish-extreme/
  • 55. Javascript Speed Wars http://webkit.org/blog/189/announcing-squirrelfish/ http://news.cnet.com/8301-1001_3-10030888-92.html http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html http://webkit.org/blog/214/introducing-squirrelfish-extreme/
  • 56. Javascript Speed Wars http://webkit.org/blog/189/announcing-squirrelfish/ http://news.cnet.com/8301-1001_3-10030888-92.html http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html http://webkit.org/blog/214/introducing-squirrelfish-extreme/
  • 57. Javascript Speed Wars http://webkit.org/blog/189/announcing-squirrelfish/ http://news.cnet.com/8301-1001_3-10030888-92.html http://weblogs.mozillazine.org/roadmap/archives/2008/09/tracemonkey_update.html http://webkit.org/blog/214/introducing-squirrelfish-extreme/
  • 58.
  • 59. We’ve Become Bandwidth Gluttons Since 2003: • Web Page Size Tripled •# of Objects Doubled Since 1995: • Web Page Size: 22x •# of Objects: 21x Source: http://www.websiteoptimization.com/speed/tweak/average-web-page/
  • 60. Yahoo!’s 14 Performance Rules (Now 34!) 1. Make Fewer HTTP Requests 8. Make JavaScript and CSS External 2. Use a Content Delivery Network 9. Reduce DNS Lookups 3. Add an Expires Header 10.Minify JavaScript 4. Gzip Components 11.Avoid Redirects 5. Put Stylesheets at the Top 12.Remove Duplicate Scripts 6. Move Scripts to the Bottom 13.Configure ETags 7. Avoid CSS Expressions 14.Make AJAX Cacheable Source: http://developer.yahoo.com/performance/rules.html
  • 61. Offline Support • HTML 5 • Client-side Database Storage API • Application Cache • Essentially SQLite in browser • Available on iPhone since 2.0 • Google Gears, Android, Nokia soon?
  • 63. 25,000 Apps & Findability? http://148apps.com/10000
  • 64.
  • 65. “It all depends on the application, of course,” says Mauro Montanaro, [Fox Mobile CEO] “and whether they are paid or free.” But he also notes that the “discoverability” of iPhone apps is becoming a bigger problem, and that some of the marketing tactics that Fox Mobile has used successfully on other handsets just don’t work on the iPhone. “The question, as usual, is placement. Who determines [editorial placement]? Maybe someone out of Cupertino.”
  • 66. Geolocation API Camera Address Book Accelerometer
  • 67. Flickr photo by Lyza Gardner: http://www.flickr.com/photos/lyza/49545547/
  • 68. Flickr photo by Thomas Purves: http://www.flickr.com/photos/thomaspurves/744225198/
  • 70. What Can You Do With PhoneGap? http://phonegap.com/projects
  • 71. Other Hybrid Approaches • QuickConnect http://quickconnect.pbworks.com • Rhomobile http://rhomobile.com • Big 5 http://big5apps.com/
  • 72.
  • 74.
  • 75. Mobile Progressive Enhancement [content] http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
  • 76. Mobile Progressive Enhancement [content] WURFL http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
  • 77. Mobile Progressive Enhancement [content] WURFL http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
  • 78. Mobile Progressive Enhancement [content] WURFL Phone Gap Add Functionality http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
  • 79. Mobile Progressive Enhancement [content] WURFL Phone Gap Add Functionality http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes
  • 80. Keys to Successful Hybrid Apps •Make the experience feel like a native application •Take advantage of the enhanced features •Don’t simply release a hybrid version of the mobile web •Optimize performance •Plan your marketing
  • 81.
  • 82. Flickr photo by MarkKelley: http://www.flickr.com/photos/markkelley/1022720488/
  • 83.
  • 84. Thank You for Your Time! Work: http://cloudfour.com • Blog: http://userfirstweb.com • Twitter: @grigs Mobile Portland: http://mobileportland.com Flickr photo by Pingnews: http://www.flickr.com/photos/pingnews/370061022/