Lucidi a cura di
Marco Roccetti
Paola Salomoni
Stefano Ferretti
SMIL
Sistemi
Multimediali
AA 2002-2003
Stefano Cacciaguerra
1.3.2003
2
HTML: tempo e spazio
HTML non gestisce l’occupazione della
pagina dal punto di vista di:
Sistemi
Multimediali
AA 2002-2003
tempo: non esiste un sistema di
coordinate temporali (si può provare a
ovviare con script Javascript).
spazio: non esiste un sistema di
coordinate spaziale che consenta di
collocare gli oggetti nella pagina (si può
fare qualche triste tentativo con le
tabelle)
3
Intervalli di tempo
I media continui (audio e video) sono
caratterizzati dall’utilizzare un intervallo
di tempo [ti, tf].
Anche testo e immagini possono essere
caratterizzati da un intervallo [ti, tf], se la
loro permanenza nella finestra è
prevista in un certo periodo.
AUDIO
VIDEO
Sistemi
Multimediali
AA 2002-2003
FOTO
4
Sincronizzazione
In presenza di più file multimediali
diventa quindi importante la fase di
sincronizzazione:
ordina temporalmente i file e
definisce la regia della pagina
AUDIO
FOTO
Sistemi
Multimediali
AA 2002-2003
VIDEO
5
SMIL ☺
SMIL (Synchronized Multimedia
Integration Language) è linguaggio di
integrazione e sincronizzazione per i
file multimediali che consente di
gestire tempo e spazio
E’ stato sviluppato dal W3C e rilasciato:
Nel 1998, la versione 1.0 (REC-smil19980615).
Nel 2001 la versione 2.0 (REC-smil2020010807).
Sistemi
Multimediali
AA 2002-2003
6
SMIL: sintassi
SMIL è:
XML-based (i tag devono essere chiusi) e
quindi ….
case-sensitive (i tag vanno scritti in
minuscolo).
Un documento SMIL:
è contenuto tra i tag <smil> e </smil>
è composto da:
Sistemi
Multimediali
AA 2002-2003
intestazione <head> che contiene le definizioni e le
metainformazioni
corpo <body> che contiene i tag di
sincronizzazione dei media
7
Applicazioni
Possibili applicazioni:
Sistemi
Multimediali
AA 2002-2003
Slideshow
Education
Advertisement
Internet TV
Corporate communication
Product information
User’s Guide
Net meeting
8
SMIL: esempio
Sistemi
Multimediali
AA 2002-2003
<smil>
<head>
<!-- meta tags -->
<layout>
<!-- layout tags -->
<layout>
</head>
<body>
<!-- media and synchronization
tags -->
</body>
</smil>
9
SMIL
Sostanzialmente:
L’header definisce:
Aree spaziali in cui è divisa la presentazioni
(regioni).
Tag Meta.
Il body definisce:
I media contenuti nella presentazione.
La sincronizzazione tra questi media.
Sistemi
Multimediali
AA 2002-2003
10
Meta tag
Sono simili ai meta tag di HTML ma
devono rispettare la sintassi di
terminazione di XML, che in questo
caso è resa dalla / (forward slash)
finale.
<meta name="title" content=”lezione SMIL" />
<meta name="author" content=”Paola" />
<meta name="copyright" content=”SM2002" />
Sistemi
Multimediali
AA 2002-2003
11
Layout
Nell'header viene definito il layout per la
disposizione degli elementi, usando il
tag <layout></layout>
Il layout è lo spazio grafico nel quale
verranno sincronizzati i dati multimediali
All’interno del layout vanno definiti:
Sistemi
Multimediali
AA 2002-2003
un root-layout che definisce lo
sfondo,
le region in cui saranno contenuti gli
elementi multimediali.
12
Root-layout
Gli attributi di principali di <rootlayout> sono height (altezza) e
width (larghezza):
<layout>
<root-layout width=400 height=200
background-color="white" />
</layout>
Sistemi
Multimediali
AA 2002-2003
13
Coordinate
All’interno del layout vanno inseriti gli
elementi multimediali specificando la
posizione attraverso coordinate
cartesiane
le coordinate devono essere calcolate a
partire dall’angolo in alto a sinistra
0
0
Sistemi
Multimediali
AA 2002-2003
Y
X
14
Region
<region> è il tag che posiziona e definisce
gli elementi multimediali.
Attributi fondamentali di <region> sono:
id: specifica un identificatore univoco per la
region.
left: coordinata X
top: coordinata Y
width: larghezza (dello spazio occupato)
height: altezza (dello spazio occupato)
Sistemi
Multimediali
AA 2002-2003
15
Region
0
50
40
☺
0
<region id=”icona-smile" left=”50" top=”40"
width="32" height="32" /> oppure
<region id=”icona-smile" left=”30%"
top=”25%" width="32" height="32" />
Sistemi
Multimediali
AA 2002-2003
16
Region
Notare che la regione definita con
<region> indica solo uno spazio,
identificato da id ma non il reale
contenuto dello spazio.
Gli spazi possono anche essere
sovrapposti.
Per farlo occorre associare un file (nel
nostro caso una immagine) attraverso un
apposito tag (<img>) nel body.
Sistemi
Multimediali
AA 2002-2003
17
Associazione regione
file
<smil>
<head>
<layout>
<root-layout width="300" height="200"/>
<region id="icona_smile" left="50" top="40"
width="32" height="32" />
</layout>
</head>
<body>
<img src=”smile32.gif" region="icona_smile" />
</body>
</smil>
Sistemi
Multimediali
AA 2002-2003
18
Z-index
Se le regioni si sovrappongono deve essere
possibile definire un ordine in modo da
capire quale sovrascrive le altre.
Questo ordine è definito dall’attributo zindex. La regione con z-index maggiore
sovrascrive le altre.
2
1
2
Sistemi
Multimediali
AA 2002-2003
1
19
Z-indez
<smil>
<head>
<layout>
<root-layout width="300" height="200" />
<region id="region_1" left="50" top="50”
width="150" height="125" z-index="2"/>
<region id="region_2" left="25" top="25"
width="100" height="100" z-index="1"/>
/layout>
</head>
<body>
<text src="text1.txt" region="region_1" />
<text src="text2.txt" region="region_2" />
</body>
</smil>
Sistemi
Multimediali
AA 2002-2003
20
Tag multimediali
Alla <region> possono essere
associati diversi tipi di file multimediali:
immagini (<img>)
testo (<text>)
audio (<audio>)
video (<video>)
In numero e il tipo di file supportati
dipendono dal player.
Sistemi
Multimediali
AA 2002-2003
21
Tag multimediali
Sistemi
Multimediali
AA 2002-2003
22
Attributi
I media tag possono avere i seguenti
attributi:
alt: specifica il testo alternativo da
visualizzare mentre viene caricato il
media file.
title: specifica un titolo al media.
abstract: inserisce informazioni di
carattere generale riguardo all'elemento.
author: definisce il nome dell'autore.
Sistemi
Multimediali
AA 2002-2003
23
Fit
Quando il media file non “riempie”
esattamente l’area definita da <region>
si può usare l’attributo fit per aggiustare
le dimensioni.
<region id="region_1" left="8" top="10"
width="116" height="81” backgroundcolor="white" fit="fill" />
Sistemi
Multimediali
AA 2002-2003
24
Fit
Il tag fit può assumere diversi valori:
fill: riempie l’area distorcendo
meet: riempie parte dell’area senza
distorsioni
slice: riempie tutta l’area senza
distorsioni
scroll: (se necessario) mette le barre
di scorrimento
Sistemi
Multimediali
AA 2002-2003
25
Fit
Sistemi
Multimediali
AA 2002-2003
26
Spazio e tempo
A questo punto abbiamo introdotto tutti i
principali tag per la gestione dello
spazio.
Sui singoli tag dei media file è possibile
aggiungere una temporizzazione
mediante gli attributi:
Sistemi
Multimediali
AA 2002-2003
dur: che indica la durata del media
begin: che indica il momento di inizio
end che indica il momento di fine
27
Tag dur e begin
<img src=”smile32.gif" region=”icona-smile"
dur=”5s" begin=”3s" />
☺
0
Sistemi
Multimediali
AA 2002-2003
sec.
28
Sincronizzazione di base
I tag di base per la sincronizzazione sono:
<par> per parallelizzare due media
Smile!
☺
sec.
0
<seq> per sequenzializzare due media
Smile!
☺
Sistemi
Multimediali
AA 2002-2003
sec.
29
Esempio di par
<body>
<!-- inizio parallelismo -->
<par>
<img src="smile32.gif"
region="icona-smile" dur=”4s" />
<text src="smile.txt"
region="text-smile” dur=”4s" />
</par>
</body>
Sistemi
Multimediali
AA 2002-2003
30
Esempio di seq
<body>
<!-- inizio sequenza -->
<seq>
<img src="smile32.gif"
region="icona-smile" dur=”4s" />
<text src="smile.txt" region="text-smile”
dur=”3s" begin="1s" />
</seq>
</body>
Sistemi
Multimediali
AA 2002-2003
31
Sincronizzazione avanzata
Per il momento i costrutti di
sincronizzazione sono molto semplici e
non consentono di descrivere situazioni
del tipo “inizia il media 2 dopo 4 secondi
che il media 1 è iniziato”.
Per costruire questo tipo di
sincronizzazioni si usa il costrutto
begin (attributo del media tag)
Sistemi
Multimediali
AA 2002-2003
32
Esempio di begin
<!-- inizia quando M1 inizia -->
<mediatag
begin="id(specifiedId)(begin)" />
<mediatag begin="id(M1)(begin)" />
<!-- inizia quando M1 è iniziato da 3
sec.-->
<mediatag begin="id(specifiedId)(3s)"
/>
<mediatag begin="id(M1)(3s)" />
<!-- inizia quando M1 finisce -->
<mediatag begin="id(M1)(end)" />
Sistemi
Multimediali
AA 2002-2003
33
Switch
SMIL consente di definire contesti
multimediali diversi in funzione di
diverse situazioni.
Esempi significativi:
Sistemi
Multimediali
AA 2002-2003
la dimensione dello schermo (l’uso
assoluto di coordinate può avere
forti limiti)
la lingua in cui viene distribuito
l’audio (stesso, video, commenti in
lingua)
34
Switch
La definizione del contesto si fa
attraverso il tag <switch>
Ogni test è effettuato solo se il test
precedente è fallito (se un test ha
successo i successivi non vengono
eseguiti)
Sistemi
Multimediali
AA 2002-2003
<switch>
<!-- contesto1 test1 -->
<!-- contesto2 test1 -->
<!-- contesto3 test1 -->
</switch>
35
Esempio di switch
<body>
<par>
<video src=“movie.avi” region=”movie”>
<switch>
<text src=”eng.txt" region=“testo”
dur=”4s" system-language=“en”/>
<text src=”ita.txt" region=“testo”
dur=”4s" system-language=“it”/>
</switch>
</par>
</body>
Sistemi
Multimediali
AA 2002-2003
36
Switch
Altre caratteristiche del tag switch:
i tag switch possono essere annidati uno
nell’altro per rendere le condizioni
multiple (in AND logico)
possono essere testate differenti
caratteristiche del mediatag (vedi lucido
successivo
Sistemi
Multimediali
AA 2002-2003
37
Switch
Possono essere testati con switch:
la lingua (anche per insiemi)
<MEDIATAG system-language="fr,en,it">
il biterate (un intero)
<MEDIATAG system-bitrate="14000">
la dimensione dello schermo (dpi>dpi)
<MEDIATAG system-screen-size="800X600">
il numero di colori (bits/pixel)
<MEDIATAG system-screen-depth="4">
il tipo (mime) del file
< MEDIATAG type="audio/x-auz">
Sistemi
Multimediali
AA 2002-2003
38
SMIL versioni
La versione 1.0 di SMIL risale al 1998 e ha
avuto notevole successo, anche se a volte
trasparentemente all’utente.
Era supportata da Real Player e dal plug in
di Quicktime .
Dalla diffusione commerciale sono venuti
molti suggerimenti di miglioramento
interessanti che il W3 ha concretizzato
nella nuova versione (2001).
Sistemi
Multimediali
AA 2002-2003
39
SMIL 1.0
SMIL player:
Apple QuickTime 4.1
RealNetworks Realplayer 7
Oratrix Grins (SMIL1.0)
applet java e plugin ad hoc di vari
produttori
anche Microsoft Internet Explorer 5.5
supporta parte di SMIL
Sistemi
Multimediali
AA 2002-2003
SMIL editor (per costruire il file SMIL
con interfaccia GUI a 4 dimensioni)
40
Versione 2.0
Dai suggerimenti scaturiti è nata una
prima proposta di modifica (SMIL
Boston) che è stata stabilizzata nella
versione 2.0 del linguaggio (2001).
Alcuni obiettivi:
Sistemi
Multimediali
AA 2002-2003
Estendere le funzionalità di SMIL 1.0
(supporto alle animazioni, transizioni,
layout più complessi)
Mantenere un formato XML based.
Modularizzare il linguaggio.
41
Moduli
Ogni modulo SMIL raccoglie un
insieme di funzionalità del linguaggio
specifiche.
In particolare (essendo SMIL definito
con XML) ogni modulo definisce un
sottoinsieme degli elementi di SMIL.
Ogni player può supportare solo un
sottoinsieme dei moduli complessivi in
modo da alleggerire le specifiche o
adattarsi a specifiche funzionalità.
Sistemi
Multimediali
AA 2002-2003
42
Moduli
I 45 moduli sono divisi 10 aree funzionali:
Sistemi
Multimediali
AA 2002-2003
•
•
•
•
•
•
•
•
•
•
Timing
Time Manipulations
Animation
Content Control
Layout
Linking
Media Objects
Metainformation
Structure
Transitions
43
Timing
Nell’area funzionale Timing ci sono 19
moduli che consentono la gestione
basilare della sincronizzazione (par e
seq, begin e end, dur, ecc).
Rispetto a SMIL 1.0 è stato definito tra
gli altri il tag excl (exclusive) che
consente di definire in modo interattivo
possibili alternative tra diversi oggetti
multimediali in base a un attributo
discrimina quale verrà attivata.
Sistemi
Multimediali
AA 2002-2003
44
Excl
excl può servire ad esempio per
realizzare:
Sistemi
Multimediali
AA 2002-2003
playlist interattive : diversi media sono
disponibili a scelta dell’utente, che ne
sceglie uno solo alla volta.
descrizioni audio : Descrizioni
registrate delle scene di un film possono
essere forzate dal pause del filmato.
Sottotitoli interattivi; più lingue sono
messe a disposizione e vengono
cambiate interattivamente.
45
Time manipulation
L’area Time manipulation consiste di
un solo modulo che consente
manipolazioni avanzate sulla
presentazione temporale dei media:
Sistemi
Multimediali
AA 2002-2003
accellerate e decelerate: aumenta e
diminuisce la velocità della
presentazione.
autoReverse (presenta prima in avanti
e poi all’indietro).
speed: controlla la velocità di un
particolare elemento.
46
Animations
L’area funzionale Animations è
composta da due moduli che si
occupano della gestione delle
animazioni: BasicAnimation e
SplineAnimation.
Ogni animazione è una funzione che
modifica nel tempo un certo elemento o
un certo attributo facendo mutare lo
stato o il valore.
Sistemi
Multimediali
AA 2002-2003
47
Content Control
Sistemi
Multimediali
AA 2002-2003
L’area funzionale Content Control è
composto da 4 moduli dedicati al controllo
della validità degli elementi multimediali
inseriti.
I tag di questi moduli consentono di scrivere
presentazioni che non si bloccano in presenza
di media non visualizzabili.
Fa parte di questa area funzionale anche il tag
switch (che a differenza di SMIL 1.0 consente
di scegliere anche in base ad attributi definiti
dall’utente),
48
Layout
Fanno parte dell’area funzionale layout
4 moduli che consentono la gestione dei
layout.
Le principali differenze con SMIL 1.0
sono:
la possibilità di utilizzare le regioni in
modo gerarchico, definendo regioni
dentro regioni
La possibilità di scegliere la posizione
dei media object all’interno delle regioni.
Sistemi
Multimediali
AA 2002-2003
49
Linking
L’area funzionale Linking contiene i
moduli che consentono di specificare
link ipertestuali:
Il supporto ai link è dato in modo
compatibile con HTML
Combinando link e excl si possono
costruire presentazioni condizionali, il
cui contenuto varia a seconda dei click
dell’utente.
Sistemi
Multimediali
AA 2002-2003
50
Media Object
L’area funzionale Media Object è
costituita da sei moduli che specificano
elementi ed attributi che introducono le
clip multimediali.
Rispetto a SMIL 1.0:
Nuovi attributi
Elemento brush che può essere usato
per colorare (anche con un disegno)
l’are di una region.
Sistemi
Multimediali
AA 2002-2003
51
Meta Information
L’area funzionale Metainformation è
composta da un solo modulo che
descrive le modalità di definizione dei
meta tag.
Rispetto a SMIL 1.0, introduce la
possibilità di usare dichiarazioni RDF
(Resource Description Framework) un
linguaggio XML-based per descrivere le
risorse Internet.
Sistemi
Multimediali
AA 2002-2003
52
Structure
L’area funzionale structure è composta
da tre moduli uno per ciascuno dei tre
tag strutturali di SMIL:
<smil>
<head>
<body>
E’ assolutamente identico a quanto
supportato da SMIL 1.0
Sistemi
Multimediali
AA 2002-2003
53
Transition
L’area funzionale Transition consente
di definire transizioni tra oggetti
multimediali differenti:
Transizioni video, che consentano a una
immagine di trasformarsi in un’altra e a
un video di mutare in un altro
Transizioni audio: che consentono di
sfumare una clip audio in un’altra.
Sistemi
Multimediali
AA 2002-2003
54
Profili
SMIL 2.0 definisce due profili:
SMIL 2.0 Basic Profile: contiene le
funzionalità minime che devono essere
fornite ad un player stand alone. Sono
quelle specificate da 10 moduli
essenziali.
SMIL 2.0 Full Profile: contiene tutte le
funzionalità di SMIL 2.0 ovvero tutti i tag
specificati nei 45 moduli
Sistemi
Multimediali
AA 2002-2003
55
Riferimenti
W3C - Synchronized Multimedia
Integration Language (SMIL) 2.0
Specification http://www.w3.org/TR/RECsmil/
Sistemi
Multimediali
AA 2002-2003
Scarica

SMIL