Web-documentaire
Rendre visible l’invisible
Le web-documentaire n’est pas un site web comme les autres. De part la richesse et la diversité de son contenu, il permet à l’internaute une expérience immersive placée entre le site web classique, le reportage télévisuelle, le livre, le magazine, la radio. Cette pluralité de médias est déconcertante. C’est aussi ce qui crée l’intérêt et l’envie de découvrir et d’explorer une œuvre.
Le web-documentaire est voué à « raconter plutôt qu’à expliquer »
Le web-documentaire est une forme d’écriture documentaire qui peut rassembler différents types de médias (vidéos, jeux, sons, images, textes, etc) à des fins narratives par le biais de l’interactivité. La nature des narrations possibles s’articule davantage autour d’une structure conditionnelle plutôt qu’une structure linéaire afin d’assoir par exemple, une dimension immersive plus totale qu’un documentaire traditionnel. L’écriture induisant de nombreuses choses, le web-documentaire est voué à « raconter plutôt qu’à expliquer ».
Se lancer dans l’élaboration d’un web-documentaire, c’est se lancer dans un nid de problèmes techniques: au niveau de la prise de vue, de la concordance, de l’ergonomie, les schémas de la construction d’une narration non-linéaire, coder… Si il y a bien des outils qui ont été conçus justement pour permettre la création de web-doc sans développeurs, ils restent d’une part payants, et ne pourront pas jouir de la flexibilité qu’offre un langage de programmation.
Nous utiliserons donc p5.js pour toute la partie interactivité, son, vidéo, clic, …
Interactivité homme/machine
Si l’interface de l’ordinateur (le WIMP) avec laquelle on interagit régulièrement nous est familière car elle nous est fonctionnelle, venir enrichir une narration d’un potentiel interactif induit d’emblée des questions quant à l’effet produit par une action.
Bouger une souris, cliquer, taper sur le clavier, activer sa webcam ou son microphone, est-ce que cette couche d’interactivité perturbe ou enrichit vraiment un matériau narratif comme de la vidéo ou des images? Est-ce que la dimension fonctionnelle d’une souris par exemple n’est basiquement que l’ornement tout puissant que l’on connait ou est-ce qu’on joue ou sublime un récit avec ? (FlossManuals)
Bref, il y a un impératif de technologie :
- web
- interactivité
- vidéo en boucle
- son en boucle
- un preload en chargement
Partir de quoi ?
Vous avez le droit de partir de vos recherches, de vos documents photos. Il faudra ajouter un texte écrit avec vos petits doigts sur les petites touches de votre clavier. Il faudra aussi ajouter une vidéo d’ambiance qui tournera en boucle. Il faudra aussi un son d’ambiance qui tournera lui aussi en boucle. Une interactivité autre que le scroll devra faire partie de l’expérience utilisateur (UX) de l’internaute. L’utilisation des touches de clavier pour amener des éléments sur des photos, par exemple.
Ce travail de web-documentaire pourrait aussi être celui de votre jury. Attention seulement, dans ce cas, n’oubliez pas que l’évaluation de mon cours technique arrive bien plus tôt que votre jury. On parle de mi-mai !
Planning
- à définir…
Critères d’évaluation
- qualité techniques
- qualité du code
- ergonomie (facilité de prise en main, rapidité, …)
- gestion typographique
- gestion colorimétrique
- contraste, lisibilité
- force visuelle
- ambiance sonore
- qualité et ambiance de la vidéo
- qualité d’écriture (pas de copier/coller please)
- Ce projet est le seul évalué pour le 2e quadrimestre
Vidéos
- Introduction à p5.js par Daniel Shiffman (en, sous-titres fr)
- Partie 1 – p5.js intro setup (web-docu)
- Partie 2 – p5.js loadImage (web-docu)
- Partie 3 – p5.js – function keyPressed (web-docu)
- Partie 4 (fin) – p5.js – la condition if, else if (web-docu)
Liens
- p5.js pour le webdocumentaire
- p5.js
- Télécharger l’éditeur p5
- créer un effet Parallax
- La vidéo et l’audio (openclassrooms)
- faire une background vidéo genre airbnb
Exemples
- A601, L’autoroute abandonnée
- Alma
- Prison Valley
- L’homme au harpon