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
