Retour au blog

P(doom) Video en 2026 : comment un clip musical naît du code

Salut HaWkers, le projet ouvert pdoom-video transforme une chanson en un clip dont les images sont calculées à partir du temps de la piste. Selon le dépôt du projet, la prévisualisation tourne dans le navigateur et l'exportation utilise la même logique pour produire une vidéo en 1080p à 60 images par seconde, avec une option de rendu en 4K. C'est un exemple concret d'art génératif où le code sert la direction visuelle, les paroles et le rythme.

Que peut-on apprendre d'un tel projet sans copier son esthétique ni sa musique ? Dans cet article, nous allons distinguer les décisions créatives des choix techniques, reproduire une petite version de son principe central et comprendre les limites de performance et de droits d'auteur. Le résultat est une méthode pour concevoir votre propre clip, visualiseur musical ou œuvre interactive.

Qu'est-ce qui distingue ce clip d'une vidéo montée à la main ?

Dans un logiciel de montage classique, vous placez des éléments sur une ligne de temps, puis vous enregistrez le résultat. Ici, chaque image est calculée à partir d'une question : que doit-on voir à l'instant t de la chanson ? La documentation du moteur du projet décrit la scène comme une fonction déterministe du temps. Si l'on demande à nouveau le même instant, le moteur doit produire la même composition. On peut ainsi examiner une image isolée, revenir sur un mot précis et exporter le clip sans dépendre du chemin suivi pendant la lecture.

Le projet emploie TypeScript, three.js et une application web pour la prévisualisation. Le fichier musical, le minutage des mots et les analyses audio constituent les données d'entrée ; les scènes sont rangées dans des modules distincts. Pour l'exportation, un navigateur sans interface produit les images et ffmpeg assemble le fichier final. Cette séparation compte parce qu'elle permet de réviser progressivement la composition, le mouvement et la synchronisation. Le clip ne surgit pas tout prêt après une seule commande : la direction visuelle et les corrections restent un travail éditorial.

Il faut aussi distinguer une vidéo générée par du code d'une vidéo générée par un modèle d'image. Le README attribue la réalisation du projet à une collaboration avec Claude Code, mais les images finales sont dessinées par le moteur écrit pour cette œuvre. L'IA a participé à la création du logiciel ; elle ne remplace pas automatiquement les décisions de cadrage, de rythme et de révision. Le résultat peut être reproduit, examiné et modifié scène par scène.

Musique, mots et temps : les véritables données d'entrée

La synchronisation ne commence pas par le choix d'une transition spectaculaire. Elle commence par la définition des événements musicaux qui contrôlent l'image. Le dépôt conserve le minutage des paroles mot par mot, ainsi que des battements, des sections, des attaques d'instruments et des mesures d'intensité. Sa documentation évoque la séparation des sources sonores, l'alignement forcé des paroles et une vérification par reconnaissance vocale pendant la préparation de ces données. Pour lancer le moteur avec les données déjà versionnées, il n'est pas nécessaire de refaire cette analyse.

Cette séparation évite une erreur fréquente : programmer l'apparition d'une phrase à une seconde choisie uniquement à l'oreille, puis découvrir après une modification qu'elle ne coïncide plus avec la voix. Quand une scène se rattache à un mot et une autre à un battement, l'intention devient explicite. Vous pouvez déplacer une scène tout en vérifiant quel vers ou quel événement musical la justifie. Il en va de même pour la typographie de karaoké : chaque mot a besoin de son propre début et de sa propre fin pour que la mise en évidence suive l'interprétation, et pas seulement la ligne entière.

Dans le README, l'auteur indique un tempo analysé d'environ 132 battements par minute. Ce chiffre appartient à la chanson du projet ; il ne constitue pas une règle pour d'autres clips. Avant de réutiliser l'idée, obtenez les données de votre bande-son et vérifiez visuellement les points de coupe. Un battement repéré correctement sur le plan technique peut tomber au mauvais endroit pour le sens des paroles. Écoutez, regardez, ajustez, puis comparez à nouveau.

Comment essayer la prévisualisation sans calculer toute la vidéo

Le chemin le plus court consiste à ouvrir l'application du projet. Le README indique Bun pour installer les dépendances et Vite pour démarrer la prévisualisation ; Chrome et ffmpeg interviennent dans le processus d'exportation. Si vous souhaitez étudier la direction visuelle, la prévisualisation suffit : vous pouvez mettre en pause, avancer image par image et passer d'une scène à l'autre avant de consacrer du temps à l'encodage final.

# Clonez le code ouvert et entrez dans l'application du clip.
git clone https://github.com/mexicat/pdoom-video.git
cd pdoom-video/app
bun install
bunx vite

La prévisualisation s'ouvre sur http://localhost:5173 ; le paramètre ?t=23 démarre à un instant précis, comme l'indique la documentation. La barre d'espace met la lecture en pause, les flèches avancent ou reculent, et la virgule ainsi que le point permettent d'examiner les images. Ces raccourcis aident à répondre à une question créative très concrète : l'image communique-t-elle l'idée voulue quand la chanson atteint ce mot ?

Pour une révision fiable, choisissez trois moments : le début d'une phrase, le point de plus forte énergie et le passage à la scène suivante. Comparez la taille du texte, le contraste et la lisibilité à chacun de ces instants. Une composition peut sembler excellente à l'arrêt et devenir illisible dès que le mouvement commence. La prévisualisation rapide permet de repérer ce problème avant un rendu coûteux.

Une petite expérience avec des images déterministes

Il n'est pas nécessaire de reproduire toute l'architecture de pdoom-video pour tester le concept. Un canvas et une fonction qui reçoit le temps suffisent pour dessiner un élément réagissant à la musique. L'exemple ci-dessous crée une barre pulsante et n'affiche un mot que pendant l'intervalle choisi. Les valeurs temporelles sont des valeurs de démonstration : elles ne représentent ni les paroles ni les minutages du projet original.

<canvas id="palco" width="960" height="540"></canvas>
<script>
  const canvas = document.querySelector('#palco');
  const ctx = canvas.getContext('2d');

  function quadro(tempo) {
    // La même valeur temporelle produit toujours la même image.
    const pulso = (Math.sin(tempo * 6) + 1) / 2;
    const mostrarPalavra = tempo >= 2 && tempo < 3.2;
    ctx.fillStyle = '#101820';
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.fillStyle = '#f3b54a';
    ctx.fillRect(100, 390, 760 * pulso, 18);
    if (mostrarPalavra) {
      ctx.font = 'bold 72px sans-serif';
      ctx.fillText('CRIE', 100, 270);
    }
  }

  quadro(2.5); // Changez le temps pour examiner une autre image.
</script>

L'exemple est volontairement simple. Dans une œuvre réelle, la largeur de la barre peut provenir de l'intensité mesurée sur la piste, et l'intervalle du mot peut être lu dans un fichier d'alignement. Le principe reste toutefois le même : quadro(t) dépend de t et de données connues, pas du nombre de fois où l'animation a déjà tourné. On peut donc revenir à une scène pour corriger un détail sans attendre toute la séquence précédente.

Si vous voulez ajouter des particules ou une texture aléatoire, utilisez une graine stable dérivée du temps ou de l'identité de l'élément. Un appel à Math.random() à chaque rendu peut produire un résultat différent lorsque vous redemandez la même image. Le guide du projet recommande explicitement un hasard à graine pour garder les scènes déterministes. Cette décision devient encore plus importante quand l'exportation calcule plusieurs échantillons d'une même image pour simuler le flou de mouvement.

De la prévisualisation à l'exportation : pourquoi le coût augmente-t-il autant ?

Exporter ne revient pas à enregistrer l'écran du navigateur. Le script du dépôt demande au navigateur des images à des instants définis, puis transmet la séquence à ffmpeg. Avec les réglages standard décrits dans le README, la vidéo finale est en 1920 × 1080 pixels à 60 images par seconde, avec une vidéo x264 et un son AAC. Un mode 4K calcule les calques à la résolution supérieure : il ne se contente pas d'agrandir une image déjà terminée.

# Produisez une courte version pour évaluer le mouvement et les coupes.
cd pdoom-video/app
bun scripts/render.ts video --from 20 --to 25 --out ../out/teste.mp4 --preset veryfast

# Après révision, exportez le clip complet.
bun scripts/render.ts video --samples auto --shutter 0.2 --out ../out/clipe.mp4

La première commande suit l'exemple de test court du guide du moteur. La seconde emploie le processus complet documenté dans le README. Avant de les exécuter, vérifiez que Chrome et ffmpeg sont disponibles et que le répertoire de sortie existe. Un court essai révèle les blocages, les coupes trop brusques et les problèmes de typographie plus tôt qu'un rendu complet. Il facilite aussi la comparaison de deux versions d'une scène, sans transformer chaque ajustement en une longue attente.

La fonction qui change le plus le coût est le flou de mouvement par échantillonnage. Au lieu de calculer une image unique pour chaque position, le moteur combine des images prises à des instants voisins. Le README explique que la sélection automatique utilise davantage d'échantillons pendant les mouvements rapides. Cela améliore la continuité d'un zoom ou d'un déplacement brusque, mais multiplie le travail du GPU. L'auteur décrit jusqu'à 324 sous-images sur des passages rapides ; il s'agit d'une limite du processus documenté, et non d'une promesse de performance pour toutes les machines.

Il faut aussi compter le coût de l'encodage. Le grain de film et les détails fins sont difficiles à compresser, surtout en 4K. Si vous destinez le résultat au web, comparez la qualité visuelle, la taille du fichier et la durée d'exportation. Une version de révision peut employer peu d'échantillons ; la version définitive ne doit dépenser davantage que là où la différence se voit. Tester un passage exigeant avant le clip entier relève d'une décision pratique, sans renoncer à l'ambition artistique.

L'IA aide à écrire des scènes, mais la direction demande toujours quelqu'un

Le README indique que le concept, le traitement, l'analyse audio, le moteur de rendu et les scènes ont été développés dans une conversation avec Claude. Le projet intéresse donc aussi celles et ceux qui suivent les outils d'IA. Sa contribution vérifiable reste cependant le processus ouvert : documentation du langage visuel, modules de scène, données de synchronisation et commandes de prévisualisation. On peut étudier comment des décisions créatives sont devenues des éléments modifiables.

Pour votre propre projet, un chemin utile consiste à rédiger d'abord une brève intention pour chaque passage : quelle émotion doit-il transmettre, quel mot ressort et que doit changer le rythme visuel ? Transformez ensuite cette intention en une petite scène et demandez une image fixe du moment principal. Ne passez à l'animation et à l'exportation qu'une fois la composition lisible. Un outil d'IA peut proposer des variantes de code ou de traitement, mais la révision doit confronter le résultat à l'intention de départ. Le critère n'est pas le nombre de lignes générées ; c'est la manière dont la scène fonctionne avec la musique.

Cette démarche rejoint notre article sur les animations génératives à la rencontre de l'art et de la programmation. Le langage et l'outil peuvent changer, mais la question créative se ressemble : quelles règles produisent une image expressive et comment savoir qu'elle mérite de rester ? Dans pdoom-video, la réponse dépend également du temps musical et de la lecture de chaque vers.

Le code ouvert ne libère pas automatiquement la musique

Un dépôt public contenant un projet visuel peut susciter un malentendu : croire que tout son contenu se réutilise dans les mêmes conditions. Le README précise que le code est distribué sous licence MIT, tandis que les polices conservent leurs propres licences et que la musique et les paroles appartiennent à leurs auteurs respectifs. Cela compte pour la publication d'une version modifiée, mais aussi pour l'utilisation d'extraits dans une démonstration commerciale ou sur les réseaux sociaux.

Si vous voulez apprendre du projet, étudiez son architecture et créez des scènes avec vos propres ressources. Si vous envisagez de réutiliser l'audio, les paroles, la typographie ou les rendus, vérifiez la licence de chaque élément et obtenez les autorisations nécessaires. La paternité d'un moteur de rendu et celle d'une œuvre musicale sont deux questions distinctes. Mentionner la source constitue une bonne pratique éditoriale, mais un crédit ne remplace pas une autorisation lorsqu'elle est requise.

Il faut également distinguer l'inspiration tirée d'une méthode de la copie d'une identité visuelle. La documentation du projet décrit des choix de couleurs, de composition et de transitions pensés pour cette chanson. Pour votre propre clip, partez des significations et des rythmes de votre piste. Si votre première décision est de reproduire l'effet le plus spectaculaire de l'exemple, le résultat risque de ressembler à une démonstration technique sans rapport avec la musique.

Que retenir pour votre prochain projet créatif ?

Pdoom-video montre qu'un clip généré par du code peut être à la fois une œuvre visuelle et un système reproductible. La leçon centrale n'est pas le choix d'une bibliothèque particulière : elle consiste à donner une intention à chaque scène, à relier les événements visuels à des données audio vérifiables et à garder la prévisualisation proche de l'exportation. Cette méthode permet de corriger un mot en retard, de revoir un cadrage et de comparer des versions sans perdre l'œuvre dans une suite opaque d'opérations manuelles.

Commencez modestement : choisissez un court passage musical que vous avez le droit d'utiliser, marquez un mot et un battement, dessinez une image déterministe et exportez quelques secondes seulement. Regardez ensuite la vidéo avec le son et demandez-vous si le mouvement accompagne le sens de la chanson. L'étape suivante peut être la typographie, la profondeur, le flou ou une nouvelle scène.

De tels projets posent également une question pour l'avenir de la création numérique : si l'assistance de l'IA accélère l'écriture des scènes, où concentrer notre attention ? Probablement sur le choix de ce que l'on montre, sur l'évaluation du résultat et sur la responsabilité envers les matériaux utilisés. Ces aspects restent visibles pour le public, même quand le code demeure en coulisses.

Allez, on y va! 🦅

📚 Vous Voulez Suivre Ce Qui Arrive?

Cet article a exploré la création d'un clip musical avec du code, mais cet univers évolue chaque semaine et toutes les nouveautés ne deviennent pas des articles ici.

Sur X, je partage ce que je teste, les coulisses de mes projets et les découvertes que je fais avant d'en parler sur le blog.

Suivez-Moi La-Bas

👉 Suivre @jeffbruchado sur X

💡 Du contenu quotidien sur le développement, la carrière et les outils que j'utilise vraiment

Commentaires (0)

Cet article n'a pas encore de commentaires. Soyez le premier!

Ajouter des commentaires