1. SMIL 소개

교재

보충자료

RealNetworks, "Introduction to Streaming Media with RealOne Player", chapter 6-8
( http://service.real.com/help/library/guides/realone/IntroGuide/PDF/ProductionIntro.pdf )
Helio's SMIL Tutorial Webpage ( http://www.helio.org/products/smil/tutorial/ )
RealNetworks Tutorial with samples( http://www.realnetworks.com/resources/samples/smil.html )

SMIL Player :

RealOne Player ( http://www.real.com)
RealNetworks 사이트에서 플레이어를 무료 다운로드

SMIL Homepage ( http://www.w3.org/AudioVideo/)

SMIL 1.0 spec (1998.6, http://www.w3.org/TR/REC-smil/)
SMIL 2.0 spec (2001.8, http://www.w3.org/TR/smil20/)

참고자료

SMIL Tutorial & Player

Helio's SMIL player SOJA ( http://www.helio.org/products/smil)
Boston University SMIL tutorial ( http://www.bu.edu/webcentral/learning/smil1/ )
KELINDEV : SVG+SMIL ( http://www.kevlindev.com/tutorials/index.htm )
SMIL Tutorial by W3Schools ( http://www.w3schools.com/smil/default.asp )

Reference Books

SMIL 2.0: Interactive Multimedia for Web and Mobile Devices, D. Bulterman & L. Rutledge, Springer, 2004
SMIL: Adding Multimedia to the Web, Tim Kennedy & Mary Slowinski, SAMS Publishing, 2002
SMIL for Dummies, Heather Williamson, IDG Books Worldwide, 2001

History

SMIL 1.0
- 1995.12 : 4th WWW Conference, issued "Towards a Real-Time Multimedia Web"
- 1997.11 : First public release of SMIL Specification (SMIL 1.0 Working Draft)
- 1998.6 : SMIL 1.0 Specification
- 1998 ~ 1999 : SMIL Players(HPAS, RealPlayer, CWI, SOJA, ... ) and Authoring Tools

SMIL 2.0

1999 ~ 2000 : SMIL 2.0 Working Draft
2001.8 : SMIL 2.0 Specification

SMIL의 특징

SMIL 이란 ? Synchronized Multimedia Integration Language

대화식 멀티미디어 표현을 작성하기 위한 XML 기반 언어 (발음 "smile")

XML 기반

다른 XML 기반 언어로 작성된 페이지에서 사용가능 : 예) XHTML, SVG

멀티미디어 객체의 표현

<text>, <img>, <audio>, <video>, <animation>
스트림 데이터 : 오디오, 비디오, (텍스트스트림)
언어, 비트율(bit-rate), 사용자 옵션 등에 따라 미디어 재생이 가능

동기화(Synchronization) 및

화면상에 원하는 레이아웃으로 객체를 위치 (공간적 동기화)
이들 객체 들의 시간적 특성을 설정 (시간적 동기화)

대화식 표현 및 애니메이션

미디어 객체의 하이퍼링크 및 스크립트
화면 상에서 미디어 객체의 애니메이션

SMIL 시작 예제

samples

예제 보기 : 인도여행, 시1, 시2, 노래방1, 노래방2, 동화책
2003년 student project : 구경하기

SMIL 문서의 기본 틀

기본 문법

SMIL is XML-based. 모든 태그는 XML 문서 규칙 준수

SMIL is case-sensitive. 모든 태그의 명칭은 소문자

문서 구조 및 기본 태그

<smil>
    <head>
        <meta name="first" content="Your Name" />
        <layout>
            
        </layout>
    </head>
    <body>
        
    </body>
</smil>

플레이 및 HTML 파일에 삽입하기

예제 (ex01.smil)

<smil>
   <head>
      <layout>
         <root-layout width="300" height="200" background-color="green" />
         <region id="pic1" left="20" top="20"  width="130" height="160" />
         <region id="pic2" left="170" top="25" width="110" height="150" />
      </layout>
   </head>
   <body>
      <par>
         <img src="june-1.jpg" region="pic1" dur="6s" />
         <img src="june-2.jpg" region="pic2" dur="6s" begin="2s"/>
      </par>
   </body>
</smil>

결과 보기

별도의 RealPlayer 창에서 보기

<a href="example01/ex01.smil"> 별도의 ... </a>

화면에 포함하기(embedding)

<embed src="example01/ex01.smil"
      type="audio/x-pn-realaudio-plugin"
      console="Clip1"
      controls="ImageWindow"
      height=200 width=300
      autostart="false" >