© 2006the University of Greenwich1 SMIL Synchronised Multimedia Integration Language Kevin McManus.

Slides:



Advertisements
Similar presentations
Combining the strengths of UMIST and The Victoria University of Manchester 15 th June 2006 Keep SMILing Institutional Web Management Workshop 10 th June.
Advertisements

Techniques for Creating Accessible, Closed Captioned Web-Based Video California State University - Northridge 22nd Annual International Technology and.
Concepts & Techniques for Accessible, Closed Captioned Web-Based Video 10th Annual Accessing Higher Ground: Accessible Media, Web and Technology Conference.
 2004 Prentice Hall, Inc. All rights reserved. Chapter 28 – Multimedia: Audio, Video, Speech Synthesis and Recognition Outline 28.1 Introduction 28.2.
Combining Media 8. Key Points There are two models for combining elements of different media types: page-based and synchronization-based Hypermedia is.
12 Media Streaming.
A really fairly simple guide to: mobile browser-based application development (part 1) Chris Greenhalgh G54UBI / Chris Greenhalgh
10 C H A P T E R © 2001 The McGraw-Hill Companies, Inc. All Rights Reserved1 Streaming Media and Synchronized Multimedia One of the ways the Internet is.
© De Montfort University, Designing streaming applications Howell Istance School of Computing De Montfort University.
HTML 5 and CSS 3, Illustrated Complete Unit K: Incorporating Video and Audio.
1 © Netskills Quality Internet Training, University of Newcastle Multimedia Web Pages © Netskills, Quality Internet Training, University of Newcastle Netskills.
 Multimedia is everything you can hear or see: texts, books, pictures, music, sounds, CDs, videos, DVDs, Records, Films, and more.  Multimedia comes.
INF Web Design Using Multimedia on the Web Video - Part 1.
School of Computer Science & Information Technology G6DPMM - Lecture 18 Synchronized Multimedia Integration Language (SMIL)
SMIL F.Melkonyan Barcelona,2002. Content What is SMIL? History General rules SMIL 1.0 elements SMIL 2.0 HTML+TIME Present and future Examples.
© De Montfort University, Synchronised Presentations using SMIL Howell Istance School of Computing De Montfort University.
CM143 - Web Week 2 Basic HTML. Links and Image Tags.
Tutorial 7 Working with Multimedia. XP Objectives Explore various multimedia applications on the Web Learn about sound file formats and properties Embed.
Using Multimedia on the Web
Web Development & Design Foundations with XHTML Chapter 11 Key Concepts.
E0262 – MIS – Multimedia Storage Techniques SMIL – Synchronized Multimedia Integration Language.
Chapter 2: The Client Side: HTML CIS 275—Web Application Development for Business I.
SMIL Manousos Bouloukakis 26/05/2001 What does SMIL mean? Synchronized Multimedia Integration Language Pronounce it "smile" !
Tutorial 7 Working with Multimedia. XP Introducing Multimedia Bandwidth is a measure of the amount of data that can be sent through a communication pipeline.
The Internet 8th Edition Tutorial 9 Creating Effective Web Pages.
1 Web Developer Foundations: Using XHTML Chapter 10 Helper Applications and Plug-in Concepts.
CS 299 – Web Programming and Design Introduction to HTML.
Audio and Video CGS Some Common Audio Formats Format Use Extension MIDI instrumental music.mid MPEG songs.mp3 RealAudio live broadcasts.ra Wave.
Lights, Camera, Action! The Role of Multimedia in Web Applications Leading Multimedia Formats in Use Today What You Need to Know to Include Them in Your.
Tutorial 7 Working with Multimedia. XP Objectives Explore various multimedia applications on the Web Learn about sound file formats and properties Embed.
CP2022 Multimedia Internet Communication1 HTML and Hypertext The workings of the web Lecture 7.
SMIL Synchronized Multimedia Integration Language.
XP Tutorial 8New Perspectives on HTML and XHTML, Comprehensive 1 Using Multimedia on the Web Enhancing a Web Site with Sound, Video, and Applets Tutorial.
HTML and XML Behind Web Authoring Tools. 2 Objectives Introduce HTML Learn HTML Step by step Introduce XML.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 11 Key Concepts 1 Copyright © Terry Felke-Morris.
Audio and Video on the Web Presentation by Cheryl Deas and Pasha Souvorin Multimedia for Web Designers.
Computer Information Technology – Section 3-4. HTML – The Language of the Internet Objectives: The Student will: 1. Look at HTML 2. Understand the basic.
McGraw-Hill/Irwin © 2004 by The McGraw-Hill Companies, Inc. All rights reserved. SMIL Ellen Pearlman Eileen Mullin Programming the Web Using XML.
XP Tutorial 8New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Using Multimedia on the Web Enhancing a Web Site with Sound, Video, and.
Tutorial 7 Designing a Multimedia Web Site
Supplementary Materials on Web Authoring. Insert Anchors & Add Hyperlinks Insert other multimedia elements: Flash animations Video clips & Audio clips.
Multimedia From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 1 Introduction Important Multimedia Issues Audio Movies.
Tutorial 7 Working with Multimedia. New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition 2 Objectives Explore various multimedia applications.
Tutorial 7 Working with Multimedia. New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition 2 Objectives Explore various multimedia applications.
Multimedia Specification Design and Production 2013 / Semester 2 / week 5 Lecturer: Dr. Nikos Gazepidis
Streaming Media A technique for transferring data on the Internet so it can be processed as a steady and continuous stream.
Multimedia Web Pages. Multimedia displays Browser can load web pages that contains multimedia elements 1. Helper applications: stand-alone programs that.
Multimedia: Audio and Video Kyle Hawver. BGSOUND element Should be placed in the HEAD section of the HTML document Has 4 key properties: – SRC – URL of.
Using Plug-Ins Adding Multimedia to an HTML Document.
CS 111 – Oct. 4 Web design –HTML –Javascript Commitment: –This week, read sections 4.3 – 4.5.
The Synchronized Multimedia Integration Language (SMIL) Kuo-Hao Li.
Embedding Multimedia in Web Pages  Multimedia is a popular buzzword for sound, motion video, and interactive animation.  Some problems or obstacles.
Multimedia. What is multimedia? Multimedia is everything you can hear or see: texts, books, pictures, music, sounds, CDs, videos, DVDs, Records, Films,
The Web Wizard’s Guide To DHTML and CSS Chapter 8 Putting It All Together and Moving Forward.
XP Review 1 New Perspectives on JavaScript, Comprehensive1 Introducing HTML and XHTML Creating Web Pages with HTML.
XP 1 HTML Tutorial 1: Developing a Basic Web Page.
Chapter 8 Adding Multimedia Content to Web Pages HTML5 & CSS 7 th Edition.
CHAPTER 8 Multimedia 1. Using Multimedia ❖ Multimedia: the combination of text, sound, and video to express an idea or convey a message. ❖ Podcasts: a.
Web Basics: HTML/CSS/JavaScript What are they?
The new way of presenting web lectures
Embedding Media into Web Pages
Tutorial 7 Working with Multimedia
Prepared for Md. Zakir Hossain Lecturer, CSE, DUET Prepared by Miton Chandra Datta
Integrating Multimedia: Sound, Video and More
Outline Introduction Audio and Video
HTML HYPERTEXT MARKUP LANGUAGE.
Basic HTML and Embed Codes
Working with Multimedia
Creating a Basic Web Page using HTML
Presentation transcript:

© 2006the University of Greenwich1 SMIL Synchronised Multimedia Integration Language Kevin McManus

© 2006the University of Greenwich2 SMIL Synchronised Multimedia Integration Language XML based Single timeline to coordinate and synchronize mixed media Developed by W3C First released June1998 Supported by Real Systems Not supported by the major browsers

© 2006the University of Greenwich3 Documentation and Tutorials Lots of resources on the Web: W3C Real Systems W3Schools – not in line with the standerds Streaming Media World Larry Bouthillier's SMIL Tutorial Page ( “ Canyonlands - What I Did Last Summer ” ) The excellent Helio SMIL tutorial seems to have evaporated Real Systems production guide covers media production and touches on other proprietary markup languages (RealPix, RealText).

© 2006the University of Greenwich4...optional section with header markup......required section with body markup... SMIL File Structure SMIL.smi file has an optional head followed by a body

© 2006the University of Greenwich5... Markup between these tags clips play in parallel.... Markup between these tags clips play in sequence. Specifies a RealText (.rt) clip Specifies a RealPix (.rp) clip. SMIL Tags

© 2006the University of Greenwich6 Specifies a RealAudio (.rm) clip Specifies a RealVideo (.rm) clip.... Specifies a choice Looping may be done with seq, e.g.... SMIL Tags

© 2006the University of Greenwich7 Pointer Files Instead of a link like: Canyonlands we need an intermediate pointer file Canyonlands where webtech.ram contains the url of the real media, e.g: This can optionally include parameters

© 2006the University of Greenwich8 Accessing SMIL Not fully supported by major browsers apart from Real Player (RealOne) Need to use a helper or plug-in a simple anchor tag will cause the browser to spawn the appropriate helper use to embed the plug-in into a web page Preferably without

© 2006the University of Greenwich9 mugshots.smi define a window area for pictures area for text play text into the text area play slideshow into the picture area play music play in parallel

© 2006the University of Greenwich10 toc.rt <window duration="0:58.0" height="450" width="280" bgcolor="black" link="#EEDDCC" > Illustrious Members of Staff Kevin McManus more content in here And, Last but not Least... GILL WINDALL time that the content is displayed content displayed immediately anchor takes the user to a place on the timeline

© 2006the University of Greenwich11 slideshow.rp <head duration="00:56" bitrate="20000" width="360" height="400" aspect="true" timeformat="dd:hh:mm:ss.xyz" /> this is all fairly self explanatory

© 2006the University of Greenwich12 anchor to mugshots.ram

© 2006the University of Greenwich13 Adapting to system variations SMIL allows decisions to be made at runtime Deliver content based on the available bandwidth or the client nationality

© 2006the University of Greenwich14 Conclusions Mugshots illustrates how simple SMIL can effectively integrated media can forgive it’s little markup irregularities Canyonlands shows how to incorporate video clips into SMIL Use SMIL to create interactive media experiences If only SMIL worked in more browsers without the need for a plug in rumour has it that IE can do this W3C plan to allow SMIL, SVG and MathML to integrate into XHTML