Jump to content

XML - Managing Data Exchange/SMIL

From Wikibooks, open books for an open world



Previous Chapter Next Chapter
DocBook XBRL



Learning objectives

Upon completion of this chapter, you will be able to

  • Understand SMIL fundamentals.
  • Understand how and why SMIL is used.
  • Locate and use SMIL technical specifications, tutorials and open source SMIL tools.
  • Create simple SMIL markup.
  • Watch your SMIL file come to life in a SMIL viewer.

Introduction

[edit | edit source]

With the explosion of the late 90's popularity of the internet, The World Wide Web Consortium (W3C) saw the need to extend the capabilities of the web with respect to information structure and media presentation. This is how they arrived at XML, the extensible language for describing information structure. Furthermore, SMIL is built upon XML: it is a specialized language to describe the presentation of media objects. Since the W3C (and everyone else) doesn't know what media types will be around in the future (virtual environments, brainwave-synch experiences, psychic/holographic/video), XML was an appropriate choice in designing SMIL to be extended to support these media.

In order to integrate this technology with HTML and extend the application of media in HTML, the W3C decided to make a push towards modularizing these languages or protocols. SMIL is one of many modular languages which 'plug-in' to the larger framework of XML.

What is SMIL?

[edit | edit source]

SMIL (pronounced "smile") is an acronym for Synchronized Multimedia Integration Language. It is thought of as an open-standard version of PowerPoint for the internet. SMIL is an XML-based language, similar in appearance to HTML, that allows for the authoring of interactive audiovisual presentations. SMIL enables the streaming of audio and video with images, text or other media types. It is a language describing the temporal and spacial placement of one or more media objects. Although SMIL can be written with a simple text editor, hand-writing SMIL documents can be a time-consuming and complicated endeavor. Therefore it is better to use a tool for generating complicated SMIL documents.

World Wide Web Consortium (W3C) SYMM group

[edit | edit source]

Since November 1997, the W3C SYMM group has been developing the SMIL language. It finalized SMIL 1.0 in June of 1998 and SMIL 2.0 in August of 2001.

Why SMIL?

[edit | edit source]

Although plug-ins and media players have the ability to show many different types of media with varying support for interaction, only SMIL offers the ability to define the presentation in the form of text as a script. This feature could be called media composition. This is a powerful ability when you think about it: text presentations can be generated from other applications. Also, SMIL offers accessibility options and powerful features not present in these media players.

  • Macromedia products such as Flash, which require a plug-in to view flash inside a web page.
  • RealAudio's Realplayer
  • Microsoft's PowerPoint
  • OpenOffice.org's Impress
  • Apple's Quicktime
  • Microsoft has already created a proprietary alternative to SMIL. It is called Microsoft's Synchronized Accessible Media Interchange (SAMI), which plays ASX files through Windows Media Player (WiMP).

Given that SMIL is extensible, the SMIL language has the ability to show many of proprietary objects which are used by the above players. SMIL was designed to be the overarching language for describing the presentation of all media, all layouts and interactive controls. Therefore, SMIL is not a substitute for flash, mpeg-4, or HTML. Rather, it is a new standard for describing and using all of these.

SMIL History

[edit | edit source]

SMIL is still being developed. Currently, attempts are being made to make SMIL easier to use in web browsers. Since SMIL is XML, the W3C developed the latest standard as an addendum to the hybrid of XML and HTML (XHTML). The following is an outline of the history of SMIL.

  • The SMIL 1.0 specification defined the layout and time sequence of multimedia elements.
  • The HTML+TIME specification introduced Timing, Linking, Media, and Content controls to HTML elements.
  • The SMIL 2.0 specification brought interactivity (i.e.: HTML+TIME) such as media linking and controls.
  • BHTML proposal included transitions to be used in SMIL 2.0
  • Finally, the XHTML+SMIL specification extends SMIL 2.0 capabilities to XHTML elements.

When fully realized and implemented in the latest web browsers, XHTML+SMIL will be able to define how media elements can be controlled. HTML supports only static images and links. Web browsers use plug-ins to show videos and other media objects, so the control and interaction of the objects is left to the implementation of the plug-in. With XHTML+SMIL, the supported objects can be placed, moved or displayed according to a time-frame, interacted with using custom controls, and linked to other media objects, web pages or presentations. And since XML is extensible, support for more media objects is on the horizon. This technology has the potential to make the WWW far more interactive, allowing presenters far more control over presentations.

The current SMIL 2.0 is comprehensive and fairly complete. It is divided into modules which describe different aspects of the presentation. For example, there is a structure module to describe the structure of the SMIL document itself, and there is a metadata module for describing what the SMIL document is all about. Modularity is useful for extending the SMIL schemas on a module-to-module basis when necessary, without causing unwanted interactions with the elements in other modules.


Implementing SMIL

[edit | edit source]

Common SMIL implementations

[edit | edit source]
  • Internet or Intranet presentations.
  • Slide show presentations.
  • Presentations which link to other SMIL files.
  • Presentations which have Control buttons (stop, start, next, ...)
  • Defining sequences and duration of multimedia elements.
  • Defining position and visibility of multimedia elements.
  • Displaying multiple media types such as audio, video, text
  • Displaying multiple files at the same time.
  • Displaying files from multiple web servers.

Currently, SMIL's most widespread usage is with MMS. MMS (Multimedia Messaging System) is a mobile device technology that is used as an envelope for sending multimedia messages to cellphones. SMIL content is placed inside the MMS message along with any associated media binaries. In this context, MMS is a kind of transport mechanism for SMIL.

SMIL files and MIME Types

[edit | edit source]
  • SMIL files have the extension *.smil (but can also have *.sml, *.smi)
  • SMIL files contain tags and content necessary for showing a presentation. This includes the layout of multimedia elements, the timeline for the elements and the source for the multimedia files.

In order for a MIME user-agent to recognize SMIL 2.0 files, the user-agent needs to be defined:

  • application/smil [deprecated]
  • application/smil+xml [current MIME type]
  • application/xhtml+smil [MIME type for embedding smil in XHTML]

When adding this new mime-type to a web browser, the definition will need to include the 'smil' extension.

SMIL Schema

[edit | edit source]

The following hyperlink will direct you to the SMIL 2.0 Schemas, provided by the W3C.org. The main schema is a general description of SMIL 2.0 modules. It is followed by each module's schema. The main schema contains the include statements for all of the module's schemas.

W3C.Org's SMIL Schema description

SMIL Namespace Declarations

[edit | edit source]

SMIL 2.0 files need to have the following namespace declaration in the beginning <smil> tag:

SMIL 2.0 namespace

1
<smil xmlns="http://www.w3.org/2001/SMIL20/Language">

SMIL 1.0 files have the following namespace declaration:

SMIL 1.0 namespace

1
<smil xmlns="http://www.w3.org/TR/REC-smil">

If no default namespace is declared within the

<smil>

root element, the document will be processed as SMIL 1.0.


SMIL Syntax

[edit | edit source]

Guidelines and Rules

[edit | edit source]

SMIL documents look a lot like HTML. SMIL files need to be written according to the following rules:

  • SMIL documents must follow the XML rules of well-formedness.
  • SMIL tags are case sensitive.
  • All SMIL tags are written with lowercase letters.
  • SMIL documents must start with a <smil> tag and end with a </smil> closing tag.
  • SMIL documents must contain a <body> tag for storing the contents of the presentation.
  • SMIL documents can have a <head> element (like HTML) for storing metadata information about the document itself, as well as presentation layout information.

SMIL template

[edit | edit source]

SMIL 1.0 template

1
2
3
4
5
6
7
8
9
10
11
<smil>
<head>
<layout>
...
</layout>
</head>

<body>
...
</body>
</smil>

A Simple SMIL

[edit | edit source]

Abbreviated SMIL markup

<?xml version="1.0" encoding="ISO-8859-1"?>
<smil xmlns="http://www.w3.org/SMIL20/Language">
<head>

<!-- The layout section defines regions in which to place content -->
<layout>
...
</layout>

<!-- Transitions defined in head act on content defined in body -->
<transition id="fade" type="fade" dur="1s"/>
<transition id="push" type="pushWipe" dur="0.5s"/>

</head>

<!-- The body section defines the content to be used and how it will be displayed -->
<body>

<par>
<img src="imagefile.jpg" transIn="fade"/>
<video src="soundfile.aif" transOut="push"/>
</par>

</body>
</smil>

An example SMIL

[edit | edit source]

Example SMIL which has in-line text and an image

<smil xmlns="http://www.w3.org/2001/SMIL20/Language">
<head>
<layout>
<root-layout width="320" height="240"/>
<region id="text1_region" left="0" top="0" width="160" height="120"/>
<region id="text2_region" left="160" top="120" width="160" height="120"/>
<region id="text3_region" left="80" top="60" width="160" height="120"/>
<region id="image_region" left="0" top="0" width="320" height="240"/>
</layout>
</head>
<body>
<seq>
<text src="data:text/plain,First%20Slide" region="text1_region" dur="2s"/>
<text src="data:text/plain,Second%20Slide" region="text2_region" dur="3s"/>
<text src="data:text/plain,Third%20Slide" region="text3_region" dur="3s"/>
<img src="sample_jpg.jpg" region="image_region" dur="3s"/>
</seq>
</body>
</smil>

Note that when using in-line text instead of referring to separate plain-text files as the text source, you will have to encode the text for any non-alphanumeric characters. This example uses '%20' in lines {13,14,15} as a space character. Also note that in line {13} the source for the text content begins with 'data:text/plain'. In SMIL 2.0 this is the default mime-type for text sources, so specifying it here is optional. In SMIL 1.0, however, this would have to be specified in order to use inline text.

SMIL 2.0 Modules

[edit | edit source]

SMIL 2.0 divides the language description by functionality into ten modules. Each module contains elements to describe structure, content, actions or attributes. The following 10 modules are associated with the SMIL 2.0 namespace.

  1. Timing  
  2. Time Manipulations
  3. Animation
  4. Content Control
  5. Layout
  6. Linking
  7. Media Objects 
  8. Metainformation 
  9. Structure 
 10. Transitions

The timing module provides a framework of elements to decide whether elements appear concurrently, in sequence, or out of order and called by interactive events such as clicking on a hyperlink.

The time manipulations module provides the ability to associate media objects with time-related information such the as length of time a media object should be displayed, and a description of the timeline used as a frame of reference for the timing module.

The animation module allows media objects to be placed on a timeline defined by the time manipulations module.

The content control module allows for choices of which content is played, depending on such things as language and playback capabilities, using tags such as switch present a test of the system's capabilities.

The layout module contains elements that describe the spacial placement of media objects in the presentation.

The linking module describes hyperlinks and linking references to media objects.

The media objects module describes the pathing and typing of media objects.

The metainformation module contains elements that describe meta information about the SMIL file itself or the media objects it contains.

The structure module is a framework to describe the structure of the SMIL file such as the head and body and SMIL elements.

The transitions module is a framework to describe transitions such as wiping and fading between the presentation of media objects.

Viewing a SMIL file

[edit | edit source]

In order to view a SMIL presentation, a client will need to have a SMIL player installed on his/her computer. Currently, Apple's Quicktime player, Windows Media Player (WiMP) and RealNetworks RealPlayer are among the most popular media players.

It would be convenient to be able to show these SMIL files natively in web browser, eliminating the requirement of a separate SMIL player or plug-in. Currently, Microsoft's Internet Explorer has limited support for SMIL features. The open-source Mozilla project is slowly incorporating SMIL and other XML-related technologies such as SVG and MathML into their browsers, but progress is slow. It is possible they are waiting for these XML-based languages to mature.

Embedding SMIL files into XHTML web pages

[edit | edit source]

As mentioned, SMIL is not yet native to web browsers, so in order to put SMIL in a web page, one must embed it and open it in a plug-in. Embedding SMIL files into web pages is somewhat beyond the scope of this chapter. However, should you have a need to do this, the following links are included as references to help you.

  • Embedding a SMIL file is easy to do with Apple's Quicktime media player.
  • Use the Windows Media Player to view SMIL files in a web page on a non-IE browser.
  • The Internet Explorer 5.5+ browser has support for SMIL.
  • Visit this W3Schools page for details on how to use SMIL in IE-only web pages.

SMIL for phones

[edit | edit source]

As mentioned, SMIL is often used in the latest cellular phones. Phones and vendors have varied support for MMS (multimedia messaging service), but generally, MMS uses SMIL to define the layout of multimedia content. If the MMS message contains a SMIL file, it will include other media objects, which can be text or binary (text is treated here as a media object or file to be referenced in a smil file).

Just a general note on MMS: the telecommunications industry needed a system in order to charge for messages by throughput as well as a system for pushing multimedia messages from phone to phone, computer to phone or phone to computer. MMS is a standard, international system for these purposes. SMIL was adopted because it was a well-defined, standard language to describe the layout and timing of the content inside MMS messages. In adhering to these (and other) standards developed by the 3GPP in partnership with the European Telecommunications Standards Institution (ETSI) and the W3C, the industry was able to ensure interoperability of new services between vendors, providing mutual benefit and equal opportunity.

SMIL tools and SMIL Info

[edit | edit source]

Given that WikiBooks is a publicly-available 'open' book, it would be inappropriate to include information about or links to any commercial SMIL tools. In other words, everything that is not free or open source is not considered here.

Just a sidenote: some commercial tools cost upwards of $800. It is therefore in our best interest to evaluate, provide feedback for, and contribute to opensource projects.

The following are useful links (March 18th, 2004) to free and opensource tools, current SMIL projects, specifications, and tutorials:

SMIL in netbeans?

[edit | edit source]

One can create a SMIL file in Netbeans just as one would create an XML file. Just type it up and save it as a SMIL file. You can check for well-formedness, but validation might be trickier. As mentioned previously, SMIL 2.0 requires a namespace declaration, so don't forget it.

For our simple exercises, just type up a well-formed SMIL document and save it as .smil That's it!

Summary

[edit | edit source]

We've seen how SMIL could be used to make standalone presentations. Yet the future of SMIL may be in the connection of mobile devices to the internet. As XML standards and SMIL tools reach maturity, SMIL will be increasingly implemented in order to define interactive presentations in the same way that Macromedia FLASH does, only this presentation will be native to web browsers and micro browsers used in mobile devices. Since SMIL is an open standard and it is extensible, there will likely be other applications which will use also SMIL.

Visionaries foresee the increasing ubiquity of the internet in our homes and work, on computers and mobile devices. This ubiquity is also called 'pervasive computing'. Mobile commerce would be an example of pervasive computing as cellular phones and portable devices become more useful for business and location-based services. SMIL is a language which facilitates this trend by providing either a pretty face for future business services or value-added multimedia content.

SMIL Exercises

[edit | edit source]
  1. Create a simple SMIL file which displays the words, 'Hello World'. Confirm that the file works in a SMIL-conformant player.
  2. Author a SMIL file which displays 'Hello World' for 3 seconds, then displays 'Goodbye World' for 1 second. Confirm that the file works in a SMIL-conformant player.
  3. Take an existing Openoffice.org present (or PowerPoint) presentation and turn it into a SMIL file. Double check it in a SMIL browser.
  4. Embed one of the previously created SMIL files into an XHTML web page and store the SMIL file and web page on a server. Confirm that the SMIL file works for two different computers.

References

[edit | edit source]

Ayars, J., Bulterman, D., Cohen, A., et al. (ed., 2001). Synchronized Multimedia Integration Language (SMIL 2.0). Retrieved April 4, 2004 from the World Wide Web Consortium Dot Org Web Site: http://www.w3.org/TR/smil20/smil-modules.html

Castagno, Roberto (ed., 2003, January). Multimedia Messaging Service (MMS); Media formats and codes. Retrieved April 4, 2004 from the Third Generation Partnership Project (3GPP) Dot Org Web Site: http://www.3gpp.org/ftp/Specs/html-info/26140.htm

Michel, T. (2004, March). Syncronized Multimedia (n.a., n.d). Retrieved April 4, 2004 from the World Wide Web Consortium Web Dot Org Site: http://www.w3.org/AudioVideo/

Newman, D., Patterson, A., Schmitz, P. (ed., 2002, January). XHTML+SMIL. Retrieved April 4, 2004 from the World Wide Web Consortium Dot Org Web Site: http://www.w3.org/TR/XHTMLplusSMIL/

SMIL Tutorial Home (n.d.). Retrieved April 4, 2004 from the W 3 Schools Dot Com Web Site: http://www.w3schools.com/smil/default.asp