Démo Firefox 3.5 : le Rich Media collaboratif

Classé dans : Logiciel libre | 22

Temps de lecture 4 min

image_pdfimage_print

Firefox 3.5 - Paul RougetLa sortie de Firefox 3.5 approche à grands pas. Les nouveautés au rendez-vous seront nombreuses (TraceMonkey, Canvas, CSS3, etc). Parmi ces dernières, on notera le fait de pouvoir afficher des vidéos directement dans le navigateur, sans avoir besoin d’utiliser de plugins propriétaires comme Flash. Bref, plein de bonnes nouvelles en perspective.

Là où cela devient encore plus intéressant, c’est lorsque l’on commence à mixer ces technologies. Ainsi, l’ami Paul Rouget avait déjà démontré qu’on pouvait mixer la vidéo avec Javascript (cobaye  : Delphine), avec Canvas (cobaye  : William), avec CSS3 (cobaye  : Tristan). N’hésitez pas à télécharger Firefox 3.1/3.5 (actuellement en bêta) pour tester par vous même ces innovations qui, et c’est une excellente nouvelle pour le logiciel libre, reposent entièrement sur des technologies et des standards ouverts.

La dernière démo de Paul (cobaye  : lui-même), bien planquée au fond de son dossier de geek, m’a enthousiasmée.

Il s’agit tout simplement de rajouter des sous-titres sur une vidéo. Techniquement, la démo parait moins impressionnante que les autres, mais elle permet de donner un caractère concret à ce qui relevait jusqu’à présent de la prouesse technologique.

D’abord, ces sous titres sont lus depuis un fichier texte on ne peut plus basique (Paul a retenu le format ouvert de sous-titres SRT, mais il aurait pu en choisir un autre), traités en Javascript, et affichés par dessus la vidéo. Les sous-titres ne sont pas incrustés, mais bien affichés au-dessus de la vidéo, tout en restant synchronisés avec celle-ci  !

Ensuite, les sous-titres peuvent utiliser le HTML+CSS. Cela signifie qu’on peut y intégrer la police de son choix, des images, des liens hypertextes, etc. juste en modifiant le contenu (HTML) ou les CSS (mise en forme).

Enfin, puisqu’il s’agit de fichiers textes, on a besoin que d’une seule vidéo (sans sous-titres) et on peut donc passer d’une langue à l’autre à l’autre sans avoir besoin de recharger la vidéo (ni d’y réincruster les sous-titres, ce sont les amateurs de fansubs qui vont être contents). : Je vous laisse voir la démonstration originale (Firefox 3.1 obligatoire), ou regarder la vidéo ci-dessous.

—> La vidéo au format webm

Les perspectives de ces «  vidéos enrichies  » me semblent vraiment intéressantes. Parmi celles-ci, les esprits chagrins me citeront la possibilité d’insérer de la publicité dynamiques avec images et liens (y a un business les gars, foncez  !), mais aussi un accès plus simple et plus ouvert a des technologies jusque là complexes ou lourdes à mettre en oeuvre.

Par exemple, dans l’éducation, la question du Rich Media est récurrente depuis des années, mais le SMIL n’a jamais vraiment perçé (même dans sa version 2). Là, il sera vraiment très simple de synchroniser une vidéo (de l’enseignant, par exemple) associée à des documents (graphiques, par exemple), le tout éventuellement sous-titré ou avec une explication avec texte et liens hypertextes sous la vidéo.

Enfin, en se basant sur des standards ouverts, Mozilla ouvre aussi la porte au travail communautaire. Ainsi, dans la démonstration ci-dessus, je termine par un exemple de sous-titrage collaboratif. En effet, si le fichier texte contenant les sous-titres est dans un fichier local, alors ce dernier pourrait très bien se trouver dans un wiki distant  ! J’ai donc modifié (très) légèrement l’exemple de Paul Rouget, en pointant vers une page de wiki[1]. Lorsque cette dernière est modifiée, les sous-titres le sont immédiatement. Par conséquent, et sans avoir de boule de cristal, je pense que l’on tient là un excellent moyen d’avoir des sous-titres pouvant être créés, modifiés, corrigés ou traduits par des non-informaticiens ou non-vidéastes. Parmi les premiers à en profiter, on pourra sans doute compter sur Wikipedia, dont le projet Commons contient déjà de nombreuses vidéos libres prêtes à être intégrée dans Firefox 3.5 (ou tout autre navigateur implémentant ces standards ouverts).

Firefox, à vous d’inventer le web qui va avec  !

Paul, je te devais déjà une Chouffe, tu viens de doubler ton score :)

Notes

[1] Au lieu d’un fichier .srt, j’ai utilisé un petit fichier PHP qui va lire le contenu de la page du Wiki, élimine le superflu pour ne garder que la partie sous-titre.

Suivre pyg:

Délégué général de Framasoft

Pierre-Yves Gosset est le délégué général de l'association depuis 2008. Tel un contrôleur aérien, il coordonne les différents projets de l'association en s'assurant que les avions décollent et atterrissent (à peu près) à l'heure.

22 Responses

  1. korbé

    Waow, je n’aurai qu’un mot à dire: waow.

    Magnifique, vivement la sortie de tout ça. ^_^

  2. Bristow

    Anéfé ! superbe, que de perspectives… espérons que les autres navigateurs implémentent toutes ces technologies libres

  3. matou

    Arghh… trop bon ! On va pouvoir dégager youtube & Co ! Quels sont les formats videos supportés ?

  4. RedGuff

    Bonjour.
    Bravo !
    PS : "Les perspectives de ces « vidéos enrichies » me sembles" doit être remplacé par "Les perspectives de ces « vidéos enrichies » me semblent ". Merci.

  5. David

    Bonne nouvelle :
    1) Je n’aime pas ce fichu format propriétaire non libre
    2) Ça pourrait sûrement faire moins chauffer les CPUs; et diminuer la consommation électrique (avis aux linuxiens : regarder l’effet avec top lorsque vous installez flashblock et que vous avez ouvert une dizaine d’onglets avec des bandeaux de pub en flash)

  6. VV666

    @David
    T’inquiètes, tous les Linuxien connaisse ce problème avec le flash…. Un seul site suffit, essayes Deezer + flashblock et sans FB ^^^Le gros gag, faut un quadcore pour que ça tourne !

    Aller, à bas le flash, et vivre le libre !!!!!!!!!

  7. idoric

    >«les esprits chagrins me citeront la possibilité d’insérer de la publicité dynamiques avec images et liens ("y a un business les gars, foncez !")»

    Ce qui ne manquerait pas de faire apparaître un adblock++ 😉

  8. Grunt

    Mouais..
    Je ne voudrais pas jouer les rabats-joie, mais avec un navigateur moisi qui a les 2/3 des parts de marché, et un plugin Flash qui en occupe 99% des postes (selon Adobe), les webmasters vont préférer Flash pendant longtemps.
    IE ne va pas gérer la balise <video> avant longtemps, et quand il le fera ce sera avec plein de bugs et de particularités agaçantes.

    La faute à qui?
    Et bien, en partie aux ignorants qui utilisent Internet Explorer sans savoir que c’est pas bien: madame Michu elle clique sur le "E bleu pour accéder à Internet".
    Mais bon, elle ne sait pas que c’est pas bien, ce qui devrait inciter à lui pardonner.
    La faute aussi aux gens qui savent que Flash ça pue, mais qui l’installent quand même parce que "c’est chiant de faire sans". Et ils savent pourtant qu’en installant cette bouse systématiquement, c’est pas demain la veille qu’on en sera débarrassés. En plus, ils savent que c’est pas bien, donc difficile de leur pardonner.

    De tous les "framanautes" qui viennent s’extasier sur les prouesses de Firefox 3.5, combien ont Flash d’installé? C’est à eux que je m’adresse:
    Vous croyez vraiment que les webmasters vont s’amuser à utiliser une technologie qui dépend du navigateur, qui sera certainement mal gérée par le navigateur dominant (IE), alors que VOUS lui offrez l’autre possibilité: diffuser sa vidéo en Flash, et il est tranquille.
    Mais non, c’est tellement plus simple de dire "Waow, les standards et le libre c’est beau", tout en installant un plugin proprio pour son confort personnel, et en râlant que l’intéropérabilité c’est pas encore ça et que "Say pas juste, personne il veut utiliser les standards."
    Quand on apprécie le libre et l’intéropérabilité, on les soutient dans ses choix. ;+)

  9. Bender

    On va pouvoir enfin se passer de flash (et de son pompage de cpu), surtout qu’étant un ubuntien avec 64 bit (en toute modestie) la version alpha de flash c’est pas tip top.
    En tout cas les autres navigateurs ont du soucis à se faire.

  10. pyg

    @Grunt : je comprends ton point de vue, mais je ne le partage pas 🙂
    Je serai d’accord avec toi s’il s’agissait "juste" de pouvoir lire les vidéos sans flash.

    Or, tout le monde dans les commentaires semble bloquer sur le fait que Firefox 3.5 pourra lire des vidéos sans Flash. Mais relisez ce que j’écrit : ce qui est pour moi vraiment enthousiasmant, c’est le mix, le mashup de technologies. C’est ça qui ouvre des possibilités. A la limite le coup du plugin-ou-pas, c’est (presque) secondaire.

    Là où c’est intéressant, ce sont les nouvelles applications qui pourront aller bien plus loin que la simple diffusion de vidéos. Par exemple, le rich media, aujourd’hui, c’est compliqué à faire (y compris en Flash). Là, ça deviendra (dans plusieurs mois, on est d’accord !) beaucoup plus simple et accessible à Tata Jeannine (laissons Madame Michu en paix).

    Je vais te donner un exemple, toujours dans le cadre du sous titrage.
    Jusqu’à présent, pour faire le sous-titrage, d’une vidéo, il faut passer par une étape de repérage (http://fr.wikipedia.org/wiki/Sous-t…). Cette étape se fait avec des logiciels souvent "un peu" lourds (et souvent proprios).
    Là, je mets ma main à couper que dans les 6 mois qui suivent la sortie de Firefox 3.5, quelqu’un proposera une appli libre de sous-titrage complète (repérage inclus) totalement libre.
    Imagine que sous la vidéo, tu ai quelques boutons "Début de phrase", "Fin de Phrase", etc qui permette de marquer les Timecodes (ça se fait en 1 fonction JS : cf https://developer.mozilla.org/fr/Ut…). Un champ "texte" pour faire ta saisie, et un champ "Ajouter/Editer" qui rempli le .srt dynamiquement.
    Ca prends même pas 2 jours à coder, et ça mets à la portée de tous quelque chose qui ne l’était pas.

    Fait symptomatique, cette idée d’application de sous-titrage, m’a été soumise par ma chère et tendre (qui n’a rien d’une geek, loin de là). Quand je lui ai montré l’exemple, elle m’a spontanément dit : "C’est bien beau ton bidule, mais le fichier de sous-titres, là, c’est compliqué à remplir : comment je sais si j’en suis à 3:23 ? Et puis faire des copier-coller, c’est pas marrant. Y aurait pas moyen de simplifier ?". Aujourd’hui, on peut répondre "oui, c’est simple de simplifier" et développer une solution technique qui vient répondre à une problématique concrète d’utilisateur.

    Bref, pour moi la nouveauté, ce n’est pas tant qu’on puisse se passer de Flash, qui a encore de (très) belles années devant lui, c’est que cette technologie va permettre de créer de nouveaux usages.

    Je pourrais te citer plusieurs autres exemples qui viennent à l’esprit quand on essaie de dépasser le côté technique et qu’on pense à l’expérience utilisateur :
    – pouvoir aggrandir les sous-titres en live en CSS
    – pouvoir afficher une vidéo par dessus la vidéo
    – pouvoir faire des vidéos multilingues (l’utilisateur pouvant choisir dynamiquement un fichier de son .ogg qui viendrait se subsitituer au son de la vidéo originale).
    – pouvoir ajouter des lexiques avec liens hypertextes dans lors de la lecture.
    – pouvoir afficher des pages web relatives (avec canvas) à côté de la vidéo
    Ce ne sont que des exemples, mais ils sont *ridiculement* simples à implémenter.

  11. idoric

    @Grunt
    > «IE ne va pas gérer la balise <video> avant longtemps, et quand il le fera ce sera avec plein de bugs et de particularités agaçantes.»

    Est-ce que quelqu’un sait où en est le plugin (reprenant une partie du code de firefox) destiné à IE8 et lui apportant le canvas et les balises audio et video ?

    > «Vous croyez vraiment que les webmasters vont s’amuser à utiliser une technologie qui dépend du navigateur»

    Justement et malheureusement, que dire de ces webmestres qui écrivent pour IE uniquement, et qui en plus l’affichent… A contrario, la balise <video> est avant tout une nouveauté d’html 5 et pas d’un navigateur particulier. D’ailleurs, Safari 3.1 la supporte d’hors et déjà, donc si ce n’est pas déjà le cas, bientôt tous les navigateurs basés sur le moteur webkit sauront l’interpréter (Google l’attendait pour son OS Androïd), à cela on va évidemment pouvoir ajouter les navigateurs basés sur gecko (j’avoue ne pas savoir pour Opera).

    Ensuite, il y a deux phénomènes à combiner :
    – comme l’a expliqué pyg, cette technologie va permettre d’aller plus loin qu’avec Flash ;
    – utiliser la balise <video> n’empêche pas d’indiquer une version flash pour les anciens navigateurs [1].
    Ainsi, sans amener la moindre régression à des solutions déjà existantes, le webmestre pourra proposer plus à ceux qui utilisent des navigateurs modernes…

    [1]http://ljouanneau.com/blog/post/200… (voir «Et pour les vieux navigateurs ?»)

  12. Minos

    D’ailleurs le lien fonctionne aussi avec les nightly builds de Webkit…

  13. Tricote

    Une petite remarque : l’inclusion de sous titres dans une vidéo à partir de fichiers "externes" est déjà possible avec le lecteur flash open source FlowPlayer. Et ça marche sur tous les navigateurs…
    http://flowplayer.org/plugins/flash

  14. pvincent

    très bien la vidéo.
    Sauf que la démo sur windouille ca craint un peu.
    Quitte à utiliser des logiciels libres, autant utiliser un OS libre pour la démo.
    Moi, ça me choque de voir une technologie d’avant-garde sur un OS rétrograde.

    Pour info, Ubuntu 9.04 est disponible pour ceux qui ne connaissent pas encore.
    Mais peu importe la distrib, GNU/Linux ou xBSD, y’a matière pour faire des démos vraiment high-tech, please.

  15. pyg

    @Tricote : excellente remarque : je connaissais FlowPlayer mais pas sa capacité à lire des sous titres.
    Ca n’enlève rien à ce que je disais plus haut à Grunt sur les usages innovants qu’on peut attendre de la balise <video> reposant sur des technologies 100% libres (je doute qu’on puisse recompiler proprement Flowplayer sans passer par Flash) mais c’est une alternative vraiment intéressante. Et ça m’aura permis de découvrir la spec de Timed Text du W3C (http://www.w3.org/AudioVideo/TT/). Merci 🙂

    @pvincent : je l’attendais, celle-là 🙂 Sachant que je bosse sous les 2 systèmes (XP pour la Framakey et Ubuntu 8.04 (je sais, je suis un mouton, et un mouton ringard en plus) pour le reste, je suis malgré tout heureux de t’attribuer le premier "point Nitot" <http://standblog.org/blog/post/2008… de cette discussion. D’autres suivront sans doute…

  16. Biarnés

    très convaincant, ce sera un peu à la vidéo ce que l’hypertexte a apporté au texte durant les années 80.

  17. Totor

    Ce sera bien déjà si Wikipedia propose les vidéos en .ogg qu’on retrouver sur youtube
    Rien que ça justifiera le format .ogg

  18. gut

    @Totor: wikipedia propose déjà des vidéos en theora avec le conteneur vorbis. Les vidéos de youtube sont flash et j’ai du mal à voir en quoi elles concernent wikipédia. Après pour convertir youtube entheora, il y a tinyvd.tv

  19. rezki

    Si on laisse de côté le sac de noeuds qu’est Internet Explorer, la possibilité de travailler directement sur la vidéo est une révolution. Songez que pour le grand public, il fallait utiliser des logiciels coûteux, compliqués et propriétaires. Cela risque de donner des idées aux webmasters. 1. Les autres navigateurs " modernes " vont certainement suivre la voie. 2. Personnellement, je pense que le Ogg Theora va intéresser les webmasters au-delà de ce qu’on peut imaginer.