1. HTML5
why we talk about it
what we do about it
Pierre Combelles
Orange
2. just to be sure: what is it ?
HTML5 : HTML +… a flash-like experience - and
more - in all browsers
new elements – esp. video
more APIs for more features rich UI
drag & drop, edition, enhanced
rendering ...
CSS3
media
richer look & formatting description audio/video, 3D, graphics
offline
javascript storage, web app cache
g
include code in pages & run locally connectivity
web socket (bi-directional)
push
browser implementation
other features
geolocation and more to come
buzz
"the browser becomes the new (multiscreen) (web) app platform"
"contents become apps"
3. no doubt: it's coming
html5 handsets worldwide (millions) Orange html5-compatible handsets
cumulated purchase (millions)
source ATT
2500 12,000
2000 10,000
8,000
1500
6,000
1000
4,000
500 2,000
0 0,000
2010 2011 2012 2013 2014 2015 2016 2010 2011 2012 (May)
85% of all smartphones 17% of Orange handsets have
will have HTML5 browsers HTML5 browsers
by 2016 [AT&T, Feb 2012]
HTML5 roll-out strategy … teaser ….
ll t t t t
15% of apps launched this .. Web apps
year will be HTML5 apps, Distribution Hybrid
already [IDC, 2012]
3d party apps
apps…
5. great expectations
customers operators
choice
quality same expectations as
clarity & trust developers for our own
services !
relevance
use the browser to
developers improve customer
experience & contact
development
rich functional set bring the best of the
web environment mobile web to our
easier Xplatform devpt customers by attracting
shorter TTM / Lower TCO developers
monetisation (billing)
gotomarket APIs
open ecosystem recommendation
plurality of channels
customer visibility
monetisation
6. expectations versus reality: what is the gap ?
a bit of SWOT analysis
industry traction an alternative ecosystem to current
tunity
ngth
"web goes mobile" enabler closed silos
stren
opport
enhanced user experience more open distribution and
cross-platform portability monetisation models
still young fragmentation
eakness
not as rich as native apps creation of new browser-based
risk
portability-vs-UX trade-off silos
we
distrib/monetisation lack structure trust & security
7. focus: discovery, recommendation, distribution
discovery enhanced by rich tags :
description, category, ratings, recommendation, likes
d i ti t ti d ti lik
food for web stores, not just search
recommendation takes a new dimension :
personalized and contextualized recommendations, based on preferences,
usages, likes etc
Distribution
becomes a mix of "exclusive" distribution of key content and "open access"
(web model) – the web is the app store (ATT)
monetization
advertising
micropayments – locked to distribution?
subscription – for trusted partners only
contents & data bundling
9. meeting expectations…
raising awareness, learning with the ecosystem
awareness
learn… promote… use…
relevant use cases for our own services :
design internally design
development develop
tools externally – orange partner distribute
fragmentation measure
an HTML5 practice, in close contact with its ecosystem
10. meeting expectations…
delivering on the promise
make HTML5 usable enhance web apps value
fragmentation
drive consistent implementation operator APIs & network optim.
experience, monetisation
- standard & test lists
- network & platforms : Id/Auth,
- test results publication
privacy, billing, call control,
messaging, location, QoS…
- handset&browser compliance requirement
- SIM (Auth, NFC)
- tizen reference distribution
di t ib ti capabilities
biliti
reach, monetisation, trust
- orange selection
12. Orange selection
customers : build trust through relevance
developers : reach / monetisation rate trade-off
live in France now
a layered approach
Orange apps
partner apps
referenced apps
f d
presentation
search & recommendation
favourites
relevant bundles of apps&services
according to context
billing
partners
mid- tail
multi-operator - WAC
17. Company Profile
2
Created in 1999, early and pure player in digital contents distribution on mobile devices,
Buongiorno has developed a strong expertise and recognized leadership in its field.
The company, Headquartered and listed in Milan Stock Exchange, is today:
Specializing in mobile entertainment, focusing almost entirely on a B2C approach, based on
strong product management, technology and direct marketing capabilities combined with a
partnership attitude with mobile network operators
With a team of approx. 800 young professionals, based in 15 countries, conducting business
in more than 20 countries around the world
Generating 2011 proforma revenues (current perimeter) of ~€240 mn with an EBITDA of
~€27 mn Euro: 55% in Europe, 30% in the Americas and 15% in the rest of the world
Running a blend of traditional, feature phone oriented, and of new, rapidly growing smart
phone and tablet oriented, products
With a sound balance sheet and a proven track record in delivering results, profits and cash
flow
18. The web apps opportunity
3
In the last few quarters B! has been successful in creating and distributing web apps
thru carrier billing in several EU, NA and LATAM countries
As a result B! currently has more than 20 products launched in 9 countries (Italy,
France, Germany, Spain, UK, Mexico, Turkey, Austria and Canada) with roadmap to
extend to +15 countries during 2012
Buongiorno has created, in the past 2 years a fully new Mobile internet platform for
HTML5 apps, with a fully dedicated team at the edge of consumer needs and
technology evolution
First results from the market, enthusiastic reaction from carriers, web apps
momentum, 3G and smart-phone growing penetration seem to indicate a “perfect
storm”.
A potentially huge opportunity for creating an ecosystem around web apps is
appearing on the horizon and B! will play a key role as first mover!
19. B! web apps portfolio, some examples
4
Gamifive: iFortune:
Unlimited play from a HTML5 storefront,
catalog of 150+ casual with multiple
HTML5 games. astrology and
esoteric entries
Fingerbooks:
Playplanet:
HTML5 storefront,
HTML5 storefront for
offering a new and
unlimited native apps
unique e-book
android games
experience based
on short stories.
iMagazine:
HTML5 storefront that allows to integrate any
type of content, pictures, video, texts,
comments in a personalized way.
Social integration with FB opengraph.
20. KEY SUCCESS FACTORS
5
Transparent acquisition flow, to ensure transparency and awareness
Adapted price point and business model
Carrier billing
Attractive revenue share between Carriers and Editors (to compete with existing
closed market places)
CRM activities to engage users
Product and content quality
Customer care
Tot Customer Base Overall +136% in 5 months!
700 000
600 000
500 000
400 000
300 000
200 000
100 000
-
21. Thank you for your attention!
ludovic.desgarets@buongiorno.com
22. Orange initiatives around HTML5
Orange Labs / ASC Devices - Mobile Browsing
June 2012
Olivier CASSINAT
Contact: olivier.cassinat@orange.com
France Telecom Group confidential
23. Content
What we do
Fragmentation analysis
Advanced use cases
Overall conclusions
Orange Labs - Mobile Browsing –Orange initiatives about HTML5 – June 2012 France Telecom Group confidential 2
25. What we do
We study new technologies
State of art, detection of the potential
We work with product lines
Define the need, find business opportunities
We develop test plans
Understand the implementations
We work with manufacturers
Improve browsers
We develop web components and web applications
W d l b d b li i
Enrich the user experience
Orange Labs - Mobile Browsing - Orange initiatives around HTML5 – June 2012 France Telecom Group confidential 4
27. Overview
650+ device models
24 brands / manufacturers (biggest maker: Nokia [all] / Samsung [Highest Touch])
maker
16 Operating Systems (most used: Android, Windows Mobile, Symbian OS [all] / Android [Highest
Touch])
16 browsers (most used: Android Browser, Internet Explorer Mobile, Nokia Web Browser for S60)
6 layout engines
Most used (in browsers and devices): WebKit
Highest Touch devices browsers all use WebKit
WebKit based browsers use several different versions of WebKit
Browsers with best browsing technologies (advanced JavaScript, CSS3, HTML5) support: BlackBerry
Browser 6+, Safari (iOS), Android Browser 2.1+, Dolfin 2.0 (Bada), Opera Mobile 11.1
19 screen resolutions (most used: 240 × 320 (QVGA) [all] / 480 × 800 (WVGA) [Highest Touch])
41 screen sizes (most used: 2.8” [all] / 3.2” [Highest Touch])
72% touch screen devices (44% capacitive, 28% resistive)
Most common RAM memory quantities used: 256 512 128 [ ll] / 512 [Hi h
M ii d 256, 512, [all] [Highest Touch]; from 8 to 1024
T h] f
MiB
Most common processor frequencies used: 1000, 600, 528 [all] / 1000, 600, 800 [Highest Touch]; from
80 to 1400 MHz
Production of smartphones with a dual-core processor started in 2011
Orange Labs - Mobile Browsing – Orange initiatives around HTML5 – June 2012 France Telecom Group confidential 6
28. Browsers (browsing technologies support) Data based on the 650+ device models studied
Best support: BlackBerry Browser 6+, Safari (iOS), Android Browser 2.1+, Dolfin 2.0 (Bada), Opera
Mobile 11.1
Finally starting to catch up: Nokia Web Browser for S60 (Symbian Anna), Internet Explorer Mobile 9
(Windows Phone 7.5)
Orange Labs - Mobile Browsing – Orange initiatives around HTML5 – June 2012 France Telecom Group confidential 7
29. Browsers (HTML5 support) [cont.]
Orange Labs - Mobile Browsing – Orange initiatives around HTML5 – June 2012 France Telecom Group confidential 8
31. Components
Consequences of the fragmentation
Carousel :
Highest touch version
High touch version
Hi h t h i
Advanced use case
Access Webapp for First Time
pp
Splash screen: progressive bootloader info is shown at startup, as content is restored from device memory.
DOM storage: Images are base64 encoded on the server, and then are saved to the client’s local storage as text strings.
User modifications (text editing, image scaling…) are saved locally. At startup, the UI is shown in its latest condition.
A menu is included that enables clearing saved items.
Touch gestures: actions are triggered by touch or mouse events, depending on browser.
Orientation-aware UI: modules are scaled and positioned on the fly depending on screen orientation.
Bookmark icon: the page has a custom icon when added to home screen, and can run in webapp mode (no address bar).
Animation: labels with CSS3 text shadow are displayed following image transitions.
Orange Labs - Mobile Browsing Orange initiatives around HTML5 – June 2012 France Telecom Group confidential 10
33. Overall conclusions
Smartphones fragmentation is obvious when looking at the number and diversity of Operating Systems,
browsers, layout engines, screen resolutions, screen sizes, screen types, and hardware configurations
, y g , , , yp , g
(RAM memory + processor)
WebKit is the most used layout engine by far but there are in fact several different versions of WebKit,
and at least as much implementations; we even noticed differences with a same version of WebKit used
by two different browsers
Irregularities show up when following the progression of browsers in term of browsing technologies
support
But as of 2011, we were seeing
All the latest versions of browsers starting to converge to a near full support of established features
in the browsing technologies standards (advanced JavaScript, CSS3, HTML5)
The production of non-touch devices nearly stopping, the production of Highest Touch devices
dominating (since 2010), and the production of devices with a dual-core processor starting
So what to expect in 2013 and after?
Many more new devices to be produced, widening the gap with older devices still in use
Today’s smartphones fragmentation will not be resolved in the coming years
Tomorrow’s smartphones fragmentation will expand today’s with new HTML5 and CSS3 features
implementations (as the two standards are not yet finalized), and new specific implementations that
may or may not become the next standards
Orange Labs - Mobile Browsing – Orange initiatives around HTML5 – June 2012 France Telecom Group confidential 12
47. THE ECOSYSTEM EFFECT
- Most of the apps are created for iOS or
Android
- Developers only know one technology set
48. THE ECOSYSTEM EFFECT
- Most of the apps are created for iOS or
Android
- Developers only know one technology set
- New platforms are struggling
49. THE ECOSYSTEM EFFECT
- Most of the apps are created for iOS or
Android
- Developers only know one technology set
- New platforms are struggling
- WP7, Meego, RIM, Bada, …
98. An introduction to Tizen
Tizen - the new HTML5 platform"
Vincent Bonnevay – Global Product management
Samsung
Mark Sage – Tizen container platform manager
v.bonnevay@samsung.com
mark.sage@orange.com
+44 (0) 7866 688659 Jacques Bourhis – Engineering Manager, Director Intel
Montpellier
jacques.Bourhis@intel.com
100. agenda
1. collaboration – (including this presentation) - Mark
2. current environment and smart phone review -
Jacques and Vincent
3. open v’s closed platforms - Vincent
4. introduction to Tizen - all
5. re-cap of key messages - Mark
3
102. 2011 in Review
A Glimpse into the Market Environment
Microsoft-Nokia pact signed LiMo Foundation promises new
– ARs Technica, May 2011 devices this year
– Thing, 3/22/11
Palm largely dead as HP
shuts phone, tablet unit Sprint to join AT&T and
– AP, 8/18/11 Verizon in offering iPhone 5
– Macrumors, 8/23/11
2011
A Pivotal Year
Amazon tablet coming in
Google buys Motorola Mobility
in Mobile November for $250?
– Engadget, 9/2/11
– Forbes, 8/22/11
Industry
Google: Motorola Xoom is
lead Honeycomb product
– Pocket-lint, 1/20/11
RIM urged to do something
– Barron’s, 9/6/11
Rumors of MeeGo’s death have
been greatly exaggerated
– PCTech Talk, 6/19/11
INTEL CONFIDENTIAL
103. Industry Development Environment Trends
The Shift to HTML5
Recent Headlines % of H.264 Video Available for HTML 5 Playback
63%
HTML5 could be “game changer” 54%
Apple shows us what HTML5 can do
26%
Why companies are flocking to HTML5
10%
Google, Adobe embrace HTML5 with new launches
January 2014 May 2014 October 2014 February 2015
Microsoft jumps On HTML5 bandwagon Developer Preference
Android 67% #1
HTML5 begins to reshape digital and mobile world
iOS 59% #2
Web Apps with HTML/ 56% #3
Browser
Source: survey from Vision Mobile and Bluevia (June, 2011)
1. Broadcast Engineering, 8/8/11. 2. Mashable, 6/4/10. 3. Fortune, 8/30/11.
4. AndroidApps, 8/1/11. 5. Hothardware, 6/14/11. 6. Wall Street Journal, 7/28/11
INTEL CONFIDENTIAL
104. A Quick Overview of Key Web Technologies
HTML5, JavaScript, CSS3 are three
independent but complementary technologies
• “HTML5” and HTML5 logo often used loosely to
mean a combination of web technologies such as
HTML5, CSS3, JavaScript, etc.
With these technologies developers can
• Create standalone apps than can be loaded from
the cloud, installed as an app, or bundled with an
OS
• Create websites that are optimized for a much
broader range of devices, particularly mobile
devices
• Leverage HTML5 and Web competences in
creating stand alone applications with full access to
device resources
INTEL CONFIDENTIAL
115. why Tizen? – an operator perspective
diversity
– promotes innovation and customer choice
– grow your customer relationships – no 3rd party barriers or
intermediaries
openness
– critical to innovation
– define your own branding strategy around the user experience
operator friendly
– define your 3rd party ecosystem and revenue model
– HTML5 development platform
– supports key operator services – as defined by operators
backed by the Tizen Association
18
119. What is Tizen™
Builds Upon LiMo & MeeGo to Create a Better Solution
Tizen combines the communities and
the best technologies under one
unified environment
Strong developer NEW
community
Broad service
provider support
INTEL CONFIDENTIAL | Tizen is a trademark of the Linux Foundation
120. Tizen™ Vision
Delight consumers and enable
ecosystem partner differentiation with
a cross-device, cross-architecture,
open software platform based on a
comprehensive standards-based
HTML5 implementation
INTEL CONFIDENTIAL | Tizen is a trademark of the Linux Foundation
121. Tizen™ Overview
HTML5 Truly Open Innovation and Industry Leaders
Leadership Differentiation Support
Comprehensive
Equal opportunity Freedom to innovative Industry leaders unite
HTML5 implementation
Multiple choices of
Multiple OS’s and devices Shape direction Freedom to differentiate
ecosystem players
No restrictions on Robust developer program
Easy to create apps
applications/services to deliver innovative apps
Open governance
INTEL CONFIDENTIAL | Tizen is a trademark of the Linux Foundation
125. Tizen™ Web App Environment
• One Web API across all Tizen profiles, ensuring application portability.
• Web API relies on upstream standards (W3C and others) and
aggressively implements early API drafts.
• Will utilize all W3C defined HTML5 environment and APIs
• Will leverage other W3C standardization efforts e.g. Battery,
Sensors etc
• Will add new APIs only when there are no existing standards
• Participate in standardization efforts to influence and accelerate
relevant specifications.
126. Developer Benefits of HTML5
HTML5 is the Primary Development Environment for Tizen™ Apps
• Widely adopted technology
• Easier to create apps
• Speeds app delivery across multiple OS
platforms and devices
• Flexible distribution model
• Create web powered apps that challenge
native applications in terms of rich user
experiences
• Create new-style, full screen, immersive,
beautiful web powered apps that are designed
and optimized for touch
INTEL CONFIDENTIAL | Tizen is a trademark of the Linux Foundation
133. key messages
1. the industry needs diversity
2. Tizen is an open source platform
3. supported by major companies
4. HTML5 is key to its success
5. Orange has started to develop HTML5 applications
36
134. Web%sites%for%Tizen
Overall information of Tizen platform
• http://www.tizen.org
Source code of Tizen platform
• http://source.tizen.org
SDK of Tizen platform
• http://developer.tizen.org
Tizen Association
• http://www.tizenassociation.org