appsfuel, il nuovo marketplace per mobile web app e mobile site!
DESCRIPTION
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.TRANSCRIPT
![Page 1: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/1.jpg)
How to distribute and monetize
the new Mobile Web
Mobile Web Italy Meetup
Emanuele Bolognesi @emabolo
Milano, 16 July 2013
![Page 2: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/2.jpg)
@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!
![Page 3: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/3.jpg)
@emabolo
Mobile is the future
Source: http://www.businessinsider.com/
PersonalComputers
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
GlobalInternetConnectedDeviceShipments
Source:Gartner,IDC,StrategyAnaly cs,companyfilings,BIIntelligencees mates
![Page 4: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/4.jpg)
@emabolo
Mobile is the future
Source: http://www.businessinsider.com/
Fixed FixedFixed
Mobile
Mobile
0
500
1,000
1,500
2,000
2,500
3,000
2005 2010 2015
ConsumerBroadbandConnec ons(milions)
G-20InternetAccess
Source:BostonConsul ngGroup,MaryMeeker,KleinerPerkins,MorganStanleyResearch,BergInsight
![Page 5: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/5.jpg)
@emabolo
Mobile users like “apps”
Source: http://www.businessinsider.com/
MobileWeb
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
MinutesSp
entPerMonth(Biillio
ns)
TotalMobileAppAndWebDura onOnAndroidAndiOS
Source:NielsenSmartphoneAnaly cs
![Page 6: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/6.jpg)
@emabolo
option 1
![Page 7: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/7.jpg)
@emabolo
![Page 8: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/8.jpg)
@emabolo http://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!
![Page 9: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/9.jpg)
@emabolo
And.. native apps are not portable..
![Page 10: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/10.jpg)
@emabolo
![Page 11: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/11.jpg)
@emabolo
option 2
![Page 12: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/12.jpg)
@emabolo
![Page 13: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/13.jpg)
@emabolo
Why?
![Page 14: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/14.jpg)
@emabolo
Financial Times Over three milion users
(2012)
Nokia Here HTML5 Maps
Mobile HTML5 is already a success
Gmail Gmail web app
![Page 15: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/15.jpg)
@emabolo
option 3
![Page 16: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/16.jpg)
@emabolo
Hybrid Apps
are great but…
![Page 17: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/17.jpg)
@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
![Page 18: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/18.jpg)
@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
![Page 19: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/19.jpg)
@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
![Page 20: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/20.jpg)
@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
![Page 21: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/21.jpg)
@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
![Page 22: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/22.jpg)
@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
![Page 23: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/23.jpg)
@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-invasion Live demo here: by @cykod
![Page 24: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/24.jpg)
@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
![Page 25: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/25.jpg)
@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?
![Page 26: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/26.jpg)
@emabolo
Main problem is
The new Mobile Web
is still missing a
dedicated and powerful
Distribution Channel
![Page 27: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/27.jpg)
@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
![Page 28: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/28.jpg)
@emabolo
Register for free at
http://developer.appsfuel.com
![Page 29: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/29.jpg)
@emabolo
How to submit your app or site
Just enter your app or site URL!
![Page 30: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/30.jpg)
@emabolo
Then fill the app details…
![Page 31: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/31.jpg)
@emabolo
AppsFuel provides automatically…
![Page 32: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/32.jpg)
@emabolo
Installation of web apps
![Page 33: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/33.jpg)
@emabolo
Installation Flow
![Page 34: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/34.jpg)
@emabolo
Installation Flow
![Page 35: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/35.jpg)
@emabolo
Installation Flow
![Page 36: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/36.jpg)
@emabolo
AppsFuel Organizer
![Page 37: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/37.jpg)
@emabolo
AppsFuel Organizer
![Page 38: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/38.jpg)
@emabolo
But most importantly…
![Page 39: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/39.jpg)
@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
![Page 40: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/40.jpg)
@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?
![Page 41: AppsFuel, il nuovo marketplace per mobile web app e mobile site!](https://reader035.vdocuments.site/reader035/viewer/2022070315/55519352b4c905013a8b4625/html5/thumbnails/41.jpg)
@emabolo
Thank You!
Emanuele Bolognesi
@emabolo