Transcript SMIL - Free
SMIL Synchronized Multimedia Integration Language Réalisé Par : Ahmed BENSI Fouzi KERAÏM Master 1 Informatique Université Paris 13 Sommaire • • • • • • • • Introduction Historique Les Avantages Structure d’un document SMIL Organisation d’un document SMIL Difficultés rencontrées Exemples Conclusion Introduction • SMIL permet de créer des présentations multimédia interactives. • Le langage SMIL est basé sur le XML et XHTML. • Il permet de synchroniser plusieurs éléments multimédia tels que du son, de la vidéo, des images, ou encore du texte . • Pour lire une présentation SMIL , on utilise des lecteurs multimédia (Real Player , Quick Time, X-Smiles). • Pour éditer un fichier SMIL, on peut utiliser un simple éditeur de texte. Il existe d’autres éditeurs (RealNetworks, Limsee 2) Historique • • • • • • Décembre 1995 Juin 1998 Août 1999 Août 2001 Septembre 2005 En cours - Début de la conception SMIL - Recommandation SMIL 1.0 de W3C - Première ébauche publique de SMIL 2.0 - Recommandation SMIL 2.0 de W3C - Recommandation SMIL 2.1 de W3C - SMIL 3.0 Les Avantages • Recommandation W3C. • Ne nécessite aucune compétence en programmation. • Les composants peuvent appartenir à des serveurs web multiples. Ils sont récupérés à l'exécution de la présentation. • Interopérabilité. • Adaptabilité. • Il est possible de définir des liens entre différentes présentations SMIL. • Présentation au fil de l'eau(Streamed). Structure d’un document SMIL Afin de respecter les recommandations du W3C , quelques déclarations doivent être faites. • Une première ligne identifiant le document comme un fichier XML : <?xml version="1.0"?> • Ensuite une ligne indiquant qu’il s’agit plus précisément d’un document SMIL 2.0 : <!DOCTYPE smil PUBLIC "-//W3C//DTD SMIL 2.0//EN" "http://www.w3.org/2001/SMIL20/SMIL20.dtd"> • La racine du document SMIL, c'est-à-dire la balise <SMIL> doit contenir au moins un attribut xmlns (XML Namespace) : <smil xmlns="http://www.w3.org/2001/SMIL20/Language"> La structure d'un document SMIL Exemple.smi body head Layout Region 1 par seq switch Region 2 Media Transition Media Transition Animation Organisation d’un document SMIL 1- En-tête : <layout> : Détermine comment les éléments, dans le corps du document, sont positionnés sur une surface . Il peut contenir les éléments suivants : – <root-layout> : Détermine la taille de la fenêtre dans laquelle la présentation SMIL est rendue. – <region> : L'élément region contrôle la position, la taille et l'échelle des éléments de type objet média. Organisation d’un document SMIL 2- Positionnement : Région 1 Région 2 <head> <layout> <root-layout width= "400" height= "450" /> <region id="region1" top="10 " right="10 " left="10" width="380" height= " 300" /> <region id="region2" top=« 320" right="10" left="10" width="380" height="70" /> </layout> </head> Organisation d’un document SMIL 3- synchronisation : Le corps du document <body> contient la structure temporelle et les médias Parallèle <par> : Les éléments contenus sont joués en même temps Séquence <seq> : Les éléments contenus sont joués l'un après l'autre, dans l'ordre. Exclusif <excl> : Les éléments contenus ne peuvent pas être joués en même temps. Exemple : pour lire 2 fichiers son l’un après l’autre : <seq> <audio src= "son1.mp3"/> <audio src= "son2.mp3"/> </seq> Organisation d’un document SMIL 4- Objet média : SMIL utilise un concept d’ « objet média » afin d’intégrer et de synchroniser du multimédia. Voici les différents éléments permettant de les intégrer : • • • • <Text> : Pour lire un fichier au format .txt,… <Img> : Pour lire un fichier image au format JPG, GIF, PNG… <Audio> : Pour lire un fichier audio brut ou compressé (WAV, MP3, RM,…) <Video> : Pour lire un fichier vidéo qui peut aussi contenir du son (MPEG, AVI, MOV) • <Animation> : Pour lire une animation graphique en Flash ou SVG. • <Textsteam> : Pour un flux de texte. • <Ref > : Référence à un objet média générique, en cas de doute sur le groupe d'appartenance d'un objet média. Organisation d’un document SMIL 5- Attributs: • • • • • Src : Localiser le fichier du média de base. Region : identifiant d’une surface d’affichage. Type : le type de l'objet média. Dur : Durée de l’objet média. Fit : permet de définir la manière dont un objet doit remplir une région. Organisation d’un document SMIL 6- Le contrôle du temps : En SMIL, il y a deux manières de gérer le temps dans une présentation : en spécifiant les temps de début et de fin, ou en définissant une durée pour un média. Exemple 1: <par> <img scr="./image.jpg" begin="2s"/> <audio scr="son.wav" begin="5s"/> </par> Exemple 2 : <img src="./image.jpg" dur="15s" /> Organisation d’un document SMIL 7- Transitions : Définies dans le <head>, utilisées dans le <body> Exemple : <head> <transition id="wipe1" type="veeWipe" subtype="leftToRight" dur="1s"/> </head> <body> <seq> <img src="butterfly.jpg" dur="5s"... /> <img src="eagle.jpg" dur="5s" fill="transition" transIn="wipe1" ... /> </seq> </body> Organisation d’un document SMIL 8- Liens : Définis par les éléments <a> et <area>, similaire à la technologie HTML. • Les attributs pour <a> : Target : indique l'environnement ou le lien va s'ouvrir. Accesskey : Raccourcis clavier. Href : prend pour valeur l'URL de la cible du lien. Replace : la présentation cible remplace la présentation courante. • Les attributs pour <area> : Coords : spécifie une zone de lien. Organisation d’un document SMIL 9- Adaptabilité : Fournir un contenu adapté à la plateforme cible • Paramètres Systèmes : taille de l’écran, débit réseau, … • Les préférences des utilisateurs : langues,… Exemple : <switch> <audio src="french.wav" systemlanguage="fr"/> <audio src="english.wav" systemlanguage="en"/> </switch> Organisation d’un document SMIL 10- Intéropérabilité : Integration facile aux autres technolgies du Web. • Dans un document HTML avec l’élément <embed> Exemple : <html> <body> <embed src= " exemple.smi" width= "300" heigth= " 400 " /> </body> </html> Difficultés rencontrées • Trouver des fichiers compressés ram pour tester la video. • L’apparence change d’un visualisateur à un autre. • Tous les visualisateurs ne supportent pas tous les formats. Sources d’aide • Lien Internet - W3C : http://xmlfr.org/w3c/TR/smil20 - limsee : http://limsee2.gforge.inria.fr • Ouvrage : - XML Langages et applications (Alain MICHARD) Exemples Conclusion • L'adapatation du contenu permet de considérer les limitations des terminaux mobiles et des préférences utilisateurs. • Le developpement de l'ADSL permet la généralistation de cette technologie (présentation au fil de l'eau).