Market
Mobile App MarketAugust 2010:Research2guidance: 1.7B (2009), 2.2B (1st half 2010)
April 2011:Forrester: 54B (2015 est.) of which 17B for mobile device services
Feb 2012:Juniper: 52B (2016 est.)
July 2012:Flurry: 5.4B (2011), 8.7B (2012 est).
Feb 2013:Gartner: more than 50% mobile apps will be hybrid by 2016
March 2013MarketResearch.com: 12B (2012), 20B (2013 est.), 63B (2017 est)
Note: Apple Revenue: 43B (2009), 157B (2012); App Store / iPhone 3G (7/08)
Mobile Devices: What are they?PhonesTabletsNetbooksVehiclesWristwatches...Internet-of-Things
Others with apps...TVs
aren't
Apps
Mobile App Types
Platform*: iOS (Objective-C), Android (Java, C/C++), WP (C#, VB), BB (Java, C/C++)Restricted*: sandboxed; server CORS for cross-domain
Native Web Hybrid
Language Platform-specific* HTML5 HTML5
Device access Yes No Yes
Offline operation Yes No Yes
Network: HTTP[S] Full Restricted* Full
Distribution App stores Web App stores
Tools Vendor (mostly) Any Any
Cost to build High Low Low
Why HTML5 (Web / Hybrid)?
HTML is the lingua franca of the webothers have tried: Flash/ActionScript, Java
Software frameworks & librariesjQuery, AngularJS, SproutCore, Ember, Backbone.js, dojo, Foundation, Bootstrap
Multi-platformnatives have relatively steep learning curvemaintenance X #platformscost
...and
Mobile first...but may still need to support desktop / laptop web access
Large investment in web apps (client-side)
Platform success uncertainty (e.g. BB10, TIZEN)
HTML5 skillset availability
Web / mobile web network and data integration: HTTP[S], JSON, XML
Commonality with Node.js back-end
Web browser testableFast and easyTools (CDT, WebKit inspector, Firebug)
Device access / Offline operation / App store distribution (hybrid apps)
Multi-vendor technology pushHTML5 (many), WebKit (Google/Apple), Android emulator (Google, Intel)
Issues
Top Issues for HTML5 Mobile Apps
UI
Native API access
Networking
Audio / Video
Graphics
Tools
Top Issues for HTML5 Mobile Apps
UI
Range of primitives vs. native (layouts, widgets)
Look-and-feel vs. nativeGeneral appearance (incl. platform-specifics)Gestures control
ResponsivenessReactivityRendering (DOM rendering model may not be optimal for dynamic behaviour)
Top Issues for HTML5 Mobile Apps
Native API access
SensorsW3C slow to standardize
Offline accesslocalstorage management (volatile)Information stores (e.g. contacts)
OtherPush Notifications...
Top Issues for HTML5 Mobile Apps
Networking
Limited to HTTP[S]Transaction-based: data overhead, latency, client-initiated
Restricted to ports 80/443
Single origin security model (web)
Top Issues for HTML5 Mobile Apps
Audio / Video
Generic cross-platform support
Multiple streams
Capture
Top Issues for HTML5 Mobile Apps
Graphics
No OpenGL
Performance
Top Issues for HTML5 Mobile Apps
Tools
Native: mostly vendor-driven, matureiOS / Xcode / AppleAndroid / Eclipse / Eclipse FoundationWindows Phone / Visual Studio / MicrosoftBlackberry 10 / BB 10 SDK / BlackBerry
Web: variety for desktop, fewer for mobile
Hybrid: fragmented, immature
Progress
Status of Issues for HTML5 Mobile Apps
UI
UI primitivesStandards (CSS3 flexbox, CSS exclusions and shapes)Technologies (e.g. Adobe CSS regions, custom filters, etc.)Libraries: Bootstrap, jQuery Mobile, Sencha Touch, Enyo,
Kendo UI, dojox/mobile
Native look-and-feelAdapted and tuned for each platform (generally by libraries)
ResponsivenessMulti-core CPU, larger RAM, GPUSingle-page rendering modelLocal HTML5 (hybrid apps)Design techniques (“tips-and-tricks”)Event libraries (e.g. QuoJS)
Status of Issues for HTML5 Mobile Apps
Native API access
Platform-specificWinRT, TIZEN: JavaScript is first-class citizenBB10: WebWorks API
StandardsW3C Device Orientation API (orientation, motion)W3C Media Capture and Streams (audio, video)
JavaScript-Native bridges (for hybrid)CordovaAppcelerator TitaniumMoSync
Service vendor-specific (for hybrid)Urban Airship (Push Notification)
Status of Issues for HTML5 Mobile Apps
Networking
Data size: HTTP(s) data compression
Ports 80/443 firewall-friendly
AccessCORS (web)no single-origin sandbox (hybrid)
WebSocketsConnection-oriented (low overhead)Full-duplex (no longpolls)Streaming (low latency)
Status of Issues for HTML5 Mobile Apps
Audio / Video
audio element (not bgsound or embed)
video elementstandard codecs: mp4, webm, ogg
Media API (hybrid / Cordova)
WebRTCmulti-media streamingvideoconferencingpeer-to-peer
Status of Issues for HTML5 Mobile Apps
Graphics
GPU
canvas element
Software libraries Processing.js, Box2D, Impact, famo.us (not all use canvas)
Status of Issues for HTML5 Mobile Apps
Tools
UI designcodiqa.com, proto.io, Adobe Edge, Maqetta, Sencha Architect
PackagersAdobe Phonegap Build, cisimple
Testingappurify, uTest, TestFlight
IDEsAppception IDE, MobileNation, Mosync, Tiggzi, Titanium, Worklight
Apps
Nature of App
1. Easy
2. Moderate
3. Difficult
Nature of App1. Easy
ExamplesSocial gamesNetwork information access or sharingProductivity tools
App FeaturesMildly interactive UI (forms, data entry, simple widgets)Text, static 2D graphics, small imagesNo device / native accessTransactional networking
NeedAny UI libraryNo JavaScript-Native bridge (web)JavaScript framework optionalAny device (0-5 yrs., GPU optional)
App TypeHTML5 mobile web app or HTML5 hybrid app
Nature of App2. Moderate
ExamplesOlder arcade-style gamesPhoto sharingSound/video recording
App FeaturesHighly interactive UI (dynamic display, complex widgets)Interactive 2D graphicsSome device / native accessReal-time networking
NeedFast UI libraryJavaScript-Native bridge (e.g. Cordova)JavaScript frameworkGraphics libraryGesture library (?)Moderate device (0-3 yrs., GPU)
App TypeHTML5 hybrid app
Nature of App3. Difficult
ExamplesAction gamesVideo editingServer application
App FeaturesInteractive 3D graphicsHigh device / native accessIntensive computation, rendering
NeedLightweight UI library (optimized or custom)JavaScript-Native bridge (e.g. Cordova) + Native pluginsPhysics enginePlatform-specific optimizationsModern device (<2 yrs, multi-core CPU, high RAM, GPU)
App TypeHTML5 hybrid app
Other Considerations
Development EnvironmentDesktopCloud-based
CapabilitiesCookie-cutterFully programmable (graphic design, software)
CollaborationIndividualTeam
InteroperabilityProprietary software librariesOpenSource
Summary
Mobile consumer app market large and growing
Mobile enterprise app market nascentFebruary 2013: IBM doubles investment in mobile technology
Device innovation continuing
HTML5: issues and some solutions
Nature of app drives approach: native, web, hybrid
Distribution: app stores (native, hybrid), internet (web)
Goals / costs / benefits
Further Topics
Other issuesBrowser vs. WebViewServer back-ends
Limits to HTML5Legacy support
Future trendsDART?Firefox OS?
AlternativesCode translatorsOther: LiveCode, Corona
Questions / Comments?