Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
How to distribute and monetize
the new Mobile Web
Mobile Web Italy Meetup
Emanuele Bolognesi
@emabolo
Milano, 16 July 2013
@emabolo
o Captain of the starship AppsFuel
o Working with Web technologies
since 1997
o Working with Mobile technologies
...
@emabolo
Mobile is the future
Source: http://www.businessinsider.com/
Personal Computers
Smartphones
Tablets
0
200,000,000...
@emabolo
Mobile is the future
Source: http://www.businessinsider.com/
Fixed Fixed
Fixed
Mobile
Mobile
0
500
1,000
1,500
2,...
@emabolo
Mobile users like “apps”
Source: http://www.businessinsider.com/
Mobile Web
Apps
0
20
40
60
80
100
120
140
160
Ma...
@emabolo
option 1
@emabolo
@emabolohttp://app-promo.com/wake-up-call-infographic/
80% of iOS developers are NOT generating enough revenue to
support ...
@emabolo
And.. native apps are not portable..
@emabolo
@emabolo
option 2
@emabolo
@emabolo
Why?
@emabolo
Financial Times
Over three milion users
(2012)
Nokia Here
HTML5 Maps
Mobile HTML5 is already a success
Gmail
Gmai...
@emabolo
option 3
@emabolo
Hybrid Apps
are great but…
@emabolo
• An HTML5 WebView wrapped in a native container
is always slower than a pure HTML5 web app
• In terms of distrib...
@emabolo
Native App Hybrid App Web App
Languages
Obj-C, Java, C#,
etc
HTML, JS, CSS HTML, JS, CSS
Required Tools
Xcode, An...
@emabolo
HTML5 features on mobile
• Basics
– Viewport
– Web app settings
• User Interface
– Device and features
detection
...
@emabolo
Mobile User Interface
Meta Viewport, media queries, position:fixed, overflow-
scrolling: touch, and more…
http://...
@emabolo
Touch events
Single touch Javascript
APIs are well supported
on all platforms
Multi-touch and gestures
are fully ...
@emabolo
http://html5demos.com/geo
Live demo here:
by @rem
• Geolocation is one of the most
supported HTML5 API on
Mobile ...
@emabolo
Canvas & Games
• Canvas allows you to create
graphics on the fly using
Javascript
• For games, on Android the onl...
@emabolo
What’s next?
http://www.w3.org/standards/techs/js#w3c_all
• Media Capture API
• Battery Status API
• Vibration AP...
@emabolo
Key questions
• How do users discover
your web app?
• How do users install
and access your web
app?
• How do you ...
@emabolo
Main problem is
The new Mobile Web
is still missing a
dedicated and powerful
Distribution Channel
@emabolo
What is AppsFuel
• It’s a marketplace for
the Mobile Web and
HTML5 web apps
• Free submission
• Billing APIs
• Op...
@emabolo
Register for free at
http://developer.appsfuel.com
@emabolo
How to submit your app or site
Just enter your app or site URL!
@emabolo
Then fill the app details…
@emabolo
AppsFuel provides automatically…
@emabolo
Installation of web apps
@emabolo
Installation Flow
@emabolo
Installation Flow
@emabolo
Installation Flow
@emabolo
AppsFuel Organizer
@emabolo
AppsFuel Organizer
@emabolo
But most importantly…
@emabolo
Javascript
Conferenc
e
AppsFuel helps you make money
• Easy to implement payment API,
based on carrier billing, a...
@emabolo
Conclusions
• HTML5 support on mobile is
improving every day
• Distribution channels for mobile web
sites and web...
@emabolo
Thank You!
Emanuele Bolognesi
@emabolo
Upcoming SlideShare
Loading in …5
×

AppsFuel, il nuovo marketplace per mobile web app e mobile site!

1,066 views

Published on

Emanuele Bolognesi, responsabile del progetto AppsFuel, analizza le possibilità di distribuzione, promozione e monetizzazione del mobile web, facendo un confronto tra app native e web app, evidenziando le problematiche, ma anche le opportunità offerte da queste due tecnologie.

Published in: Technology, Design

AppsFuel, il nuovo marketplace per mobile web app e mobile site!

  1. 1. How to distribute and monetize the new Mobile Web Mobile Web Italy Meetup Emanuele Bolognesi @emabolo Milano, 16 July 2013
  2. 2. @emabolo o Captain of the starship AppsFuel o Working with Web technologies since 1997 o Working with Mobile technologies since 2005 o Part time evangelist, speaker and teacher o Huge fan of Fringe, Star Trek, Sid Meier’s videogames, and… HTML5! twitter: @emabolo Hi, I’m Emanuele!
  3. 3. @emabolo Mobile is the future Source: http://www.businessinsider.com/ Personal Computers Smartphones Tablets 0 200,000,000 400,000,000 600,000,000 800,000,000 1,000,000,000 1,200,000,000 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 Units Global Internet Connected Device Shipments Source: Gartner, IDC, Strategy Analy cs, company filings, BI Intelligence es mates
  4. 4. @emabolo Mobile is the future Source: http://www.businessinsider.com/ Fixed Fixed Fixed Mobile Mobile 0 500 1,000 1,500 2,000 2,500 3,000 2005 2010 2015 Consumer Broadband Connec ons (milions) G-20 Internet Access Source: Boston Consul ng Group, Mary Meeker, Kleiner Perkins, Morgan Stanley Research, Berg Insight
  5. 5. @emabolo Mobile users like “apps” Source: http://www.businessinsider.com/ Mobile Web Apps 0 20 40 60 80 100 120 140 160 Mar-11 Apr-11 May-11 Jun-11 Jul-11 Aug-11 Sep-11 Oct-11 Nov-11 Dec-11 Jan-12 Feb-12 Mar-12 Apr-12 May-12 Jun-12 Jul-12 Aug-12 MinutesSpentPerMonth(Biillions) Total Mobile App And Web Dura on On Android And iOS Source: Nielsen Smartphone Analy cs
  6. 6. @emabolo option 1
  7. 7. @emabolo
  8. 8. @emabolohttp://app-promo.com/wake-up-call-infographic/ 80% of iOS developers are NOT generating enough revenue to support a business, 59% of them are actually losing money!
  9. 9. @emabolo And.. native apps are not portable..
  10. 10. @emabolo
  11. 11. @emabolo option 2
  12. 12. @emabolo
  13. 13. @emabolo Why?
  14. 14. @emabolo Financial Times Over three milion users (2012) Nokia Here HTML5 Maps Mobile HTML5 is already a success Gmail Gmail web app
  15. 15. @emabolo option 3
  16. 16. @emabolo Hybrid Apps are great but…
  17. 17. @emabolo • An HTML5 WebView wrapped in a native container is always slower than a pure HTML5 web app • In terms of distribution, you still have a native app and you need to distribute it via native app stores. https://www.scirra.com/blog/85/the-great-html5-mobile-gaming-performance-comparison
  18. 18. @emabolo Native App Hybrid App Web App Languages Obj-C, Java, C#, etc HTML, JS, CSS HTML, JS, CSS Required Tools Xcode, Android SDK, Eclipse, Visual Studio… Phonegap + Native SDKs Your favourite text editor Distribution Native App Stores Native App Stores ? Reviews/Approval Required Required Not required Monetization Via Native App Stores or ADV Via Native App Stores or ADV ? ? ? HTML5
  19. 19. @emabolo HTML5 features on mobile • Basics – Viewport – Web app settings • User Interface – Device and features detection – Position: fixed – Mobile HTML5 forms • User Interaction – Touch events – Device orientation – Geolocation • Offline and Storage – Going offline – Web storage • Multimedia and Graphics – Audio/Video – Canvas – CSS3 Transitions and transformations
  20. 20. @emabolo Mobile User Interface Meta Viewport, media queries, position:fixed, overflow- scrolling: touch, and more… http://bit.ly/posfixed Position:fixed demo Enter this URL on your Mobile Phone Browser: by @brad_frost 20
  21. 21. @emabolo Touch events Single touch Javascript APIs are well supported on all platforms Multi-touch and gestures are fully supported on iOS4+ but don’t work properly on Android 2.x and 3.x http://bit.ly/demoswipe
  22. 22. @emabolo http://html5demos.com/geo Live demo here: by @rem • Geolocation is one of the most supported HTML5 API on Mobile (Android 2+, iOS3+, WinPhone 7.5+, Blackberry OS 6.0+) • Deviceorientation: how the device is oriented in space, devicemotion: acceleration (supported by iOS 4.2+, Android 3.0+) Geolocation and Device Orientation
  23. 23. @emabolo Canvas & Games • Canvas allows you to create graphics on the fly using Javascript • For games, on Android the only usable browser is Chrome • Pure web apps perform better than web apps compiled with PhoneGap https://github.com/cykod/AlienInvasion http://bit.ly/html5-invasionLive demo here: by @cykod
  24. 24. @emabolo What’s next? http://www.w3.org/standards/techs/js#w3c_all • Media Capture API • Battery Status API • Vibration API • Contacts API • Web Intents • WebSocket API • Indexed Database API • Web Audio API • And more TO YOUR NEAREST JAVASCRIPT CODE
  25. 25. @emabolo Key questions • How do users discover your web app? • How do users install and access your web app? • How do you make money with your web app?
  26. 26. @emabolo Main problem is The new Mobile Web is still missing a dedicated and powerful Distribution Channel
  27. 27. @emabolo What is AppsFuel • It’s a marketplace for the Mobile Web and HTML5 web apps • Free submission • Billing APIs • Optimized installation on mobile devices http://appsfuel.com
  28. 28. @emabolo Register for free at http://developer.appsfuel.com
  29. 29. @emabolo How to submit your app or site Just enter your app or site URL!
  30. 30. @emabolo Then fill the app details…
  31. 31. @emabolo AppsFuel provides automatically…
  32. 32. @emabolo Installation of web apps
  33. 33. @emabolo Installation Flow
  34. 34. @emabolo Installation Flow
  35. 35. @emabolo Installation Flow
  36. 36. @emabolo AppsFuel Organizer
  37. 37. @emabolo AppsFuel Organizer
  38. 38. @emabolo But most importantly…
  39. 39. @emabolo Javascript Conferenc e AppsFuel helps you make money • Easy to implement payment API, based on carrier billing, active in Italy, Spain, France, Germany, UK and US by end of 2013 • Paypal in other countries • Advertising APIs • Go live immediately • Rev. share of 70% for developers Javascript Conference
  40. 40. @emabolo Conclusions • HTML5 support on mobile is improving every day • Distribution channels for mobile web sites and web apps are now a reality • As well as monetization solutions • The new Mobile Web Way is here! What do you think about it?
  41. 41. @emabolo Thank You! Emanuele Bolognesi @emabolo

×