Media Streaming

1. 12 Media Streaming

2. What is Streaming Media? • The delivery of audio/video/data between a server and a client (user), as a continuous digital stream • Eliminates waiting for an entire file to download • Content is converted to digital files sent over the internet as data packets. • Playback begins as soon as first packets arrive or as requested by the end user • No impact on end-user’s computer • Leading architectures: RealMedia, Windows Media, QuickTime

3. It’s a Challenge • Uncompressed digital video produces data at the rate of 27 MB/sec (1.6 GB/min) • A challenge to store • A challenge to transport

4. Factors in Architecture Selection

5. Streaming Media Formats • Major player formats • Real Networks • Real Media Player – RM • Microsoft • Windows Media Player – WMV • Apple • Quicktime Player – MOV • Other formats • Audio downloads – MP3 • Capture and editing - AVI • Flash and animation - SWF • CD audio playback – CDA, WAV

6. Things to Consider • Identify your user audience • Player compatibility • Are they using PC or Mac • Offices, Dorms, Computer Labs, Homes • Wireless and other mobile devices • Internet Connection • Low speed – 28kbps to 80kbps • High speed – 80kbps to 300kbps • Broadband – 300kbps to 1.0mbps • Audience members • Staff, Dept. Admins, Managers, Directors • Anonymous users on WWW

7. Things to Consider • Media delivery • On-Demand • Live Webcasting • CD-ROM, DVD • Network • User connectivity • Firewalls, multicast enabled routers • Other • Password restrictions • E-Commerce • Media reports on viewer usage

8. On-Demand content and live broadcasts • Streams on demand • File-based Streaming • Available to users at any time, and are sent on demand. • Live Streaming • Live broadcast event • Encoder…

9. Streaming Media Options • Encoding • Choosing a format • Real Media • Windows Media • Quicktime • Determine a window size (Width x Height in pixels) • 160x120 • 240x180 • 320x240 • Even larger

10. Streaming Media Options • Encoding • Bitrate selection • Single rate - 28k, 56k, 120k, 200k, 400k • One stream per bitrate • One encoded file for each user’s connect speed • One URL for each connect speed • Multirate – (28k-56k-200k) • Real - SureStream • Windows - Intelligent Stream • Quicktime - Alternate Movies • One encoded file can reach multiple connect speeds • Server finds optimum connect speed and adjusts as network bandwidth usage changes • Only one url needed for all connect speeds • Larger file size for archive media

11. Streaming Media Options • Authoring • Include powerpoint slides sync’d to video • Insert graphics, images, logos • Add URL links to other sites or content • Create a URL to play only parts of the media • Create a playlist within one URL to stream multiple clips or media files • Set player commands, end-user controls • Pop-up or embedded player

12. Streaming Media Options • Indexing • Assign keyframes to your content media • Allows you to create smaller segments of your media and store them as clips • Add keywords to clips for users to search your media from a website • Convert speech, closed captioning and ppt slides to text for searching • Save clips in a playlist and share them with other users

13. Streaming Media Options • Webcasting • Live presentations over the internet • One multicast stream to many users • Include powerpoint or other rich media • Hosting • On demand playback of archived media • Multiple streaming server platforms • Unlimited streams • Low storage costs • No impact on your own network • No hardware resources to maintain

14. Combining Media Limitations • Web browsers are not designed to fully support multimedia features • Limited coordination of media elements

15. The Problem • Lots of Bits • Images, audio and video are beyond Internet design specs • Results in space/ time constraints at: • the server • the network( s) • the client • Not All Bits are Equally Important • Time between samples often more important than bits in sample, • for example lip synchronization (but not always...) • Content may be Distributed Across Network • Need to synchronize presentation • Objectives • Add synchronization to the Web • Allow interoperability • Use declarative format, preferably text — thus XML

16. Solution • Use of a single timeline for all media • Creation of time-based multimedia delivery over the web • Synchronization • Coordination

17. What Is SMIL? • SMIL stands for Synchronized Multimedia Integration Language • SMIL is pronounced "smile" • SMIL is a language for describing audiovisual presentations • SMIL is easy to learn and understand • SMIL is an HTML-like language • SMIL is written in XML • SMIL presentations can be written using a text-editor • SMIL is a W3C standard • SMIL 2.0 August 2001 • http://www.w3.org/TR/smil20/

18. What Is SMIL?

19. ASimplified SMIL Example <smil> <body> <seq repeatCount="indefinite"> <img src="image1.jpg" dur="3s" /> <img src="image2.jpg" dur="3s" /> </seq> </body> </smil>

20. What Can SMIL Do? • SMIL can be used to create Internet or Intranet presentations • SMIL can be used to create slide show presentations • SMIL has been described as the Internet answer to PowerPoint • SMIL presentations can display multiple file types (text, video, audio...) • SMIL presentations can display multiple files at the same time • SMIL presentations can display files from multiple web servers • SMIL presentations can contain links to other SMIL presentations • SMIL presentations can contain control buttons (stop, start, next, ...) • SMIL has functions for defining sequences and duration of elements • SMIL has functions for defining position and visibility of elements

21. SMIL Files • A SMIL file contains all the information necessary to describe a multimedia presentation • SMIL files are stored with the extension *.smil • A SMIL file contains the following: • The layout of the presentation • The timeline of the presentation • The source of all multimedia elements

22. How to Play a SMIL File? • You will need a SMIL player. Different SMIL players can be found • RealOne Platform by RealNetworks has full support for SMIL 2.0 • SMIL Player by InterObject supports the SMIL 2.0 Basic Profile • With Internet Explorer 5.5 or later, SMIL elements can be inserted into HTML files • This way any SMIL presentation can run over the Internet as standard HTML files

23. SMIL in HTML • Adding References • Adding a "time" namespace definition to the <html> tag • Adding an <?import> element to import the "time" namespace • Adding a <style> element to define the class "time" <html xmlns:time="urn:schemas-microsoft-com:time"> <head> <?import namespace="time" implementation="#default#time2"> <style>.time {behavior: url(#default#time2)}</style> </head> <body> <time:seq repeatCount="indefinite"> <img class="time" src="image1.jpg" dur="3s" /> <img class="time" src="image2.jpg" dur="3s" /> </time:seq> </body> </html>

24. SMIL Timing • time formats: • hh:mm:ss.f • number [h|min|s|ms] • wallclock (YYY-MM-DDThh:mm:ss+zone) • Duration • The duration (dur="5s") attribute • When To Start? • The begin (begin="2s") attribute

25. SMIL Sequence • <seq> - the most common SMIL element - defines a sequence • The <seq> element can have a number of attributes: • begin, dur, repeatCount <html xmlns:t="urn:schemas-microsoft-com:time"> <head> <?import namespace="t" implementation="#default#time2"> <style>.t {behavior: url(#default#time2)}</style> </head> <body> <t:seq repeatCount="indefinite"> <h2 class="t" dur="1s"> I will display for one second</h2> <h2 class="t" dur="2s"> I will display for two seconds</h2> <h2 class="t" dur="3s"> I will display for three seconds</h2> </t:seq> </body> </html>

26. SMIL in Parallel • Objects inside the <par> element will be played at the same time • Attributes: begin, dur, endsync= "first"|"last"|id(clip), repeatCount <html xmlns:t="urn:schemas-microsoft-com:time"> <head> <?import namespace="t" implementation="#default#time2"> <style>.t {behavior: url(#default#time2)}</style> </head> <body> <par> <t:audio src="liar.wav" repeatCount="indefinite" type="wav" /> <t:seq repeatCount="indefinite"> <h2 class="t" dur="1s"> I will display for one second</h2> <h2 class="t" dur="2s"> I will display for two seconds</h2> </t:seq> </par> </body> </html>

27. SMIL Transitions • IE 6 supports transitions based on the SMIL 2.0. Transitions are implemented with the element <transitionfilter> • Attributes: type, begin, mode, from, to • Transition Filters • fade, barnDoorWipe, barWipe, clockWipe, ellipseWipe, fanWipe, irisWipe, pushWipe, slideWipe, snakeWipe, spiralWipe, starWipe <t:transitionfilter targetelement="keyb" type="clockWipe" begin="keyb.begin" dur="2s" /> <img id="keyb" class="t" src="pic_keyb.jpg" dur="4s" width="128" height="107" />

28. SMIL Media Elements • <animation> <audio> <brush> <img> <param> <ref> <text> <textstream> <video> • Attributes: erase src type <html xmlns:t="urn:schemas-microsoft-com:time"> <head> <?import namespace="t" implementation="#default#time2"> </head> <body> <t:video src="http://www.ananova.com/about/vap_windows_check.wmv" repeatCount="indefinite" type="wmv" /> </body> </html>