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,049 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
1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total views
1,049
On SlideShare
0
From Embeds
0
Number of Embeds
708
Actions
Shares
0
Downloads
4
Comments
1
Likes
2
Embeds 0
No embeds

No notes for slide

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

×