1. © De Montfort University, 20041 Synchronised Presentations using SMIL Howell Istance School of Computing De Montfort University

2. © De Montfort University, 20042 Requirements Think of what kinds of elements you would need to represent in order to define a multimedia presentation Locations and types of individual media elements Whether elements played together or in sequence How long each element will be played for Where each element will be displayed, layout and size of regions on player interface How to move between one part of a presentation and another according to user input and how to specify the ‘from’ and ‘to’ locations – can we go back to the ‘from’ location after viewing the ‘to’ or not?

3. © De Montfort University, 20043 Director Presentation specified by means of a score in which media elements appear on a time line Sequential and or parallel presentation supported by channels appearing Scripting facilities provided by lingo which can be attached to elements or to places in the time line Non linear presentation is supported by defining markers in the time line to jump to, A ‘ go to ’ command has no memory of the point from which the branch was made, a ‘ play ’ enables the presentation to return to the branch point

4. © De Montfort University, 20044 SMIL Synchronised Multimedia Integration Language – defined by an XML DTD Entire document is a smil element, each has a head and a body, head has a meta element and a layout element smil meta headbody layout

5. © De Montfort University, 20045 Presentation s specified within in the of a smil element s are children of a element The s of these are then referenced by media elements in the of the document Size of regions specified by pixels or by percentages of player client area Regions can be ‘pegged’ to corners of the root-layout window

6. © De Montfort University, 20046 General form of definition

7. © De Montfort University, 20047 Defining regions… Defines two regions ‘ vidregion ’ and ‘ textregion ’ in terms of pixel positions relative to the client area of the player window, size and colour of client area defined by root- layout

8. © De Montfort University, 20048 Display of layout..

9. © De Montfort University, 20049 Body elements contains synchronisation elements and - for parallel and sequential presentation These contain one or more media elements -,,,,,, These are empty elements, no content, only attributes body parseq audiovideoimg

10. © De Montfort University, 200410 Consider following presentation 4 elements, two images, 1 QT movie and 1 sound clip Vertical lines represent 5 second intervals No requirement that timing falls on 5 second boundaries movie Image 1 Image 2 sound 0 5 10 15 20 25 30

11. © De Montfort University, 200411 Representing play sequence <img src= “images/image1.jpg” type = “image/jpg” dur = “5s” /> <img src= “images/image2.jpg” type = “image/jpg” dur = “10s” /> <img src= “images/image1.jpg” type = “image/jpg” dur = “15s” /> <audio src=“sounds/sound1.aif” type = “audio/aiff” begin = “5s” end = “20s”/>

12. © De Montfort University, 200412 Time references In, time relative to start of sequence In, time relative to preceding element Can use begin and end to introduce delays <img src= “images/image2.jpg” type = “image/jpg” begin = “5s” end = “15s” /> Means begin Image2 5 seconds after start of time reference movie Image 1 Image 2 sound 0 5 10 15 20 25 30 35

13. © De Montfort University, 200413 More about time references Clip-begin and Clip-end refers to internal time line of clip (e.g of audio or video) – no need to make new clip of extract Clip-begin = “20s” Clip-end = “40s” – play section from 20secs after start for duration of 40 seconds References can be made to media elements, useful when the length of the clip is unknown, to play the sound clip after the end of the video clip <video src=“movies/m1.mov” type= “video/quicktime” id = “vid” /> <audio src=“sounds/sound1.aif” type = “audio/aiff” begin = “id(vid)(end)”/>

14. © De Montfort University, 200414 Anchors in SMIL Make the media element the content of an anchor element <img src= “images/image1.jpg” type = “image/jpg” dur = “5s” /> <img src= “images/image2.jpg” type = “image/jpg” dur = “10s” /> Clicking on image1.jpg causes the presentation to branch to “presentation1.smil”

15. © De Montfort University, 200415 RealText Font, size, and colour control –create text in many different fonts, sizes, and colours. Timing control –control when each paragraph, sentence, word, or letter appears. –display a new sentence every few seconds, as in a video subtitle. –make letters appear one at a time as if they were being typed across the screen. Flowing text –words can scroll up the screen or from side to side. –make text loop, creating an endlessly flowing marquee. Positioning commands –optional positioning commands, enables control exactly where each word appears within the RealText window.

16. © De Montfort University, 200416 Example of tickertape Note hyperlink DJIA 7168.35 +36.5 NIKEI 225 Index 20603.71 +203.11

17. © De Montfort University, 200417 Tickertape behaviour text crawls from right to left at 20 pixels per second, (default for a tickertape window) DJIA is not underlined because underline_hyperlinks="false“ attribute loop="true“ causes text to reappear (actually this is a the default for window of type ‘tickertape’ tag before first text item forces text to appear just past windows right edge - text upper element - text lower element

18. © De Montfort University, 200418 References/resources Home of SMIL W3C Synchronised Multimedia Group at http ://www.w3.org/AudioVideo Real Networks (links from Module home page) –Examples page –Real System Production Guide ( both excellent!)