Cours Multimédia

Lien vers le projet

Lien vers les slides d’intro

Lien vers les slides de javascript

Lien vers les slides d’IHM

Les exemples

TP1 : Vidéo zoomable (sources, correction)

Le premier sujet abordé sera un zoom dans une vidéo. Dans la page web, le premier bloc affiché correspond à la vidéo initiale, sans zoom. Le deuxième bloc affichera la même vidéo avec possibilité de zoomer grâce à la molette de la souris. Enfin, le troisième bloc permettra d’afficher la même vidéo avec la zone zoomée en surimpression. La figure permet de visualiser l’affichage avec et sans zoom. De plus, on ajoutera la possibilité de déplacer la zone zoomée par drag and drop.

TP2 : Navigation vidéo par manipulation directe (sources, correction)

On se propose d’implémenter une version Web de l’interface connue sous le nom d’interface de Manipulation Directe (Dragicevic 2008). Cette interface permet de naviguer temporellement dans la vidéo en “saisissant” un objet visuel présent sur l’image et en le déplaçant le long de sa trajectoire.

TP3 : Navigation vidéo guidée par l’intérêt (sources, correction)

Dans ce TP, on s’intéresse une nouvelle fois à des méthodes alternatives de navigation vidéo. Cette fois-ci, on dispose d’une mesure de l’intérêt de la vidéo à chaque instant. A partir de cette connaissance (qui est supposée fournie et prendra la forme d’un fichier JSON), l’objectif du TP va être de proposer des interactions permettant de faciliter l’accès aux passages les plus importants des vidéos.

TP4 : Illustration du codeur par rafraîchissement conditionnel (sources)

On se propose dans ce TP de mettre en application le codeur par rafraîchissement en utilisant les possibilités offertes par HTML5. On créera le codeur par rafraîchissement et on finira par une amélioration possible grâce au concept de codage par Région d’Intérêt.