unifying the flash and html5 video experience · 2019-12-11 · flash/silverlight for desktop ....
Post on 08-Aug-2020
3 Views
Preview:
TRANSCRIPT
Unifying the Flash and HTML5 Video Experience
Twitter hashtag: #Kaltura
Kaltura Inspire Webinar November 29, 2011
Who uses Kaltura? Over 150,000 websites; over 20,000 community members
Market leadership in Media, Education and Enterprise
Pioneers in the HTML5 Video Community
Presenters
Michael Dale Lead Front End Architect
Devon Copley Managing Director, Media & Entertainment
Dr. Michal Tsur President & CMO
The New Breed of Online Video Consumers
The New Breed of Online Video Consumers = Tablets, Smartphones and OTT
WW tablet sales
WW Smartphone sales
Strategy Analytics
The New Breed of Online Video Consumers = a different audience
The New Breed of Online Video Consumers = a different experience
Lean-back experience Higher-quality, larger frame size Much longer average time watched More likely to consume long-form content
Q: Mobile Apps or Mobile Web?
A: BOTH
The New Breed of Online Video Consumers = different technology
Mobile apps are great, but are not cross-platform and limit reach You cannot successfully address video to this new audience without HTML5
– Adobe Flash on mobile is officially deprecated – Over 90% of smartphones & tablets are HTML5 enabled – Almost 75% is HTML5 video only (no Flash) – Even within apps, many are HTML5-based
Near 60% of users have HTML5 video browsers with a significant growth trend
<Video>
Not supported
Source - http://gs.statcounter.com
Some of your best audience is HTML5-only
Tablets and smartphones now comprise
This mobile audience is especially valuable
But you can’t reach them with Flash
7% of total Internet traffic
46% > $100k HHI, 30% 25-34
>75% HTML5 video only
Comscore, October 2011
The time for HTML5 video is now
HTML5 support is rapidly growing Many of your most valuable users are HTML5 only Early HTML5 video challenges largely solved
– Differing platform capabilities – The codec wars – Unified UI across Flash/HTML5 – Unified integration strategies
Look and Feel: Parity
Unified UI language enables flash-like controls All typical features: seek, volume, overlays, sophisticated ad support,
closed captions Exceptions: true full-screen (coming in current nightlies of Webkit & Firefox) & DRM
SEO – go HTML5 first
<VIDEO> tag easily parsed (by search engines, Facebook, etc.)
POSTER and TITLE attributes allow to better define how the content is referenced
This may mean in the future no special need for Video specific site maps
Content Protection – the Caveat
Strong DRM on HTML5 still far off Alternative - Scrambling: Token auth, geoblocking, Chunking - may be sufficient for most cases Native applications can provide customized DRM alternative in mobile. Flash/Silverlight for desktop
HTML5 Technical Overview
Challenges for Scalable HTML5 Delivery
Making Players 'look the same' in HTML5 and Flash Controlling player trade offs of HTML5 vs Flash Quality playback on devices: managing flavor selection and adaptive streaming Managing per device profiles and feature sets Common configuration language for Flash and HTML5 Parallel feature set for analytics and ad providers On page player performance and compatibility
Challenges for Scalable HTML5 Delivery
Android Fragmentation
Overcoming Challenges: Theming
Features are described in XML ( GUI editor ) Fine grain control over layout with css ( in HTML5 ) and swf files (for
flash) Enables robust theme control and makes it easy to add player features
Player Studio GUI
Associate CSS Associate SWF
UiConf XML HTML5 and Flash Player
Manual control via API if needed
Be in control of HTML5 trade offs: ( w/ Kaltura HTML5 embed player rules plugin )
Native vs HTML controls on iPad ? • Branded player, no ad skip, no UI for volume control • Or native controls, improved full screen experience
Lead with Flash or HTML5 on Android ? • Flash ( and html5 ) on different versions of android
Leading with HTML5 on grade A desktop browsers? • HTML5 when flash is not installed on desktop?
V.S
Adaptive Streaming for iOS and beyond
Full Apple Adaptive HLS for iOS (and some Android) What about desktop HTML5?
Progressive download with “youtube like” quality switcher All transcoding managed via the OVP (of course) Future work on full adaptive solution for desktop HTML5
Sample Firefox Source Switch
Manage HTML5 features across a fragmented platform
Grade A – Full Functionality * Safari iOS on iPad – iOS 3.2 + * IE9 * Latest Chrome release (currently 15) * Latest Firefox release (currently 8) * OSX Safari 5.1
Grade B – Reduced Functionality * Android 2.x and above * Safari iOS on iPhone – iOS 3.2 + Grade C – Minimal functionality * Blackberries * IE8-6 * Old Firefox / Chrome * Opera, other browsers
Note: IE and any browser with flash is supported via the flash, this chart is only for HTML5 and other fallbacks
One XML language to rule them all
Like themes, a single uiConf xml file controls features UiConf language enables complex feature rules based on custom entry medata across both html5 and flash
For example a rule to disable long form content with a given player
Or passing structured stream data to analytics or ad providers
Write on page integrations once for both HTML5 and Flash
Growing HTML5-only segment makes Flash-only interactivity costly Need a unified event API in Javascript to enable a single point of integration and page interaction
Ad integrations:
Kaltura native analytics + Kaltura HTML5 / Flash supports:
Analytics and Ads for both HTML5 and Flash with unified configuration
Kaltura HTML5 Player
Kaltura HTML5 player based on jQuery and mediaWiki resource loader Sandboxed inside an iframe for easy integration into many site contexts Player API bridges player and on page javascript interactions Kaltura HTML5 include resource delivery system to dynamically minify and group javascript and css resource requests
Kaltura HTML5Video.org - Learn more
Many more technical details at html5video.org Active community answers many forum requests Player comparison gives helpful overview for stand alone HTML5 player integration options
HTML5 Video Community & Html5video.Org
HTML5Video.org The HTML Video Community
Large HTML-Video Knowledge Base – Best Practices – Players Comparison – HTML Video Demos
Aggregated Industry News about HTML Video & Blog Forums and discussions about HTML Video and best practices The New York HTML & JavaScript Monthly Hackfest
– http://www.meetup.com/how-to-javascript/ – Next Meetup planned for Dec 14.
Contribution management for Kaltura’s HTML5 Video Library
HTML5Video.org Kaltura's HTML5 Video Library
Free and Open Source Widely adopted and collaboratively developed:
- Wikipedia, Adobe, Disney, Internet Archive, Best Buy… Cross platform, seamless fallback mechanism Unified UI framework Single cross platform Javascript interface Unified cross-Flash-HTML5 Javascript plugins
– Many existing integrations (DoubleClick, Nielsen, Comscore, cent2cent, plymedia and 20 more)
Powerful free & open source media management and access control in the backend through Kaltura
Get Involved
Attend the next NYC HTML5 Meetup: http://www.meetup.com/how-to-javascript/ Join the Kaltura Community – www.kaltura.org
Visit html5video.org – www.html5video.org
Follow us on twitter – @kaltura Join our Facebook Group: http://www.facebook.com/groups/kaltura/
top related