Le blog Conseil & Marketing EntrepriseAccompagnement
Créer des vidéos avec l'IA : comment nous avons fabriqué la démo de LetsLigo
La démo de LetsLigo, tournée sans caméra ni studio : Claude pilote, Playwright filme l'application, ElevenLabs fait la voix et la musique, HeyGen la présentatrice.
Points clés de cet article :
- La vidéo de démonstration de LetsLigo, notre produit, a été tournée sans caméra, sans studio et sans comédienne.
- Claude Code écrit les scripts qui filment l'application, animent les écrans et montent la vidéo. Playwright filme, ElevenLabs fait la voix et la musique, HeyGen anime la présentatrice.
- Règle de tournage : on ne montre que de vrais écrans, filmés dans l'application, avec de vraies données de démo.
- Nous filmons de la même façon chaque ticket que nous livrons, sur tous nos projets. La vidéo sert à la recette, puis à la documentation, à la conduite du changement et au marketing du produit.
- Une fois la chaîne en place, une fonctionnalité filmée se décline en formats courts pour LinkedIn, Instagram et TikTok.
Une vidéo de démonstration avec présentatrice, voix, musique, écrans animés et sous-titres se fabrique aujourd'hui sans caméra ni studio. Nous en produisons pour nos clients. Celle de LetsLigo, notre outil qui transforme les cartes de visite en contacts suivis, sert d'exemple.
Les outils pour créer une vidéo avec l'IA
- Claude Code, l'outil de code d'Anthropic, écrit avec nous le scénario, puis les scripts de tournage, d'animation et de montage. Il les relance à chaque correction.
- Playwright, un outil de test de navigateur, pilote l'application au rythme d'un humain : le curseur se déplace, le texte se tape, l'assistant IA répond en direct. Il filme l'écran en haute définition.
- ElevenLabs génère la voix off à partir du texte, et compose la musique à partir d'une description : le style, le tempo, l'ambiance.
- HeyGen anime la présentatrice : on lui donne la piste de voix, elle synchronise les lèvres et les gestes de l'avatar.
- GSAP, une bibliothèque d'animation web, fait le motion design de l'intro et de la sortie, où le logo se dessine. Playwright rend ces animations image par image. Les surlignages et le curseur se posent pendant le tournage, les zooms au montage.
- Whisper, qui tourne en local, retranscrit la voix au mot près. Le montage cale chaque plan sur la phrase qui en parle, et les sous-titres en sortent.
- ffmpeg assemble le tout et fait les zooms : écrans, présentatrice en plein cadre ou en bulle, musique sous la voix, sous-titres.
Fabriquer sa vidéo avec Claude, étape par étape
- Écrire le scénario. Pour chaque passage de la voix, on note l'écran à montrer, l'action à filmer et la zone à zoomer. On l'écrit avec Claude Code.
- Préparer les données de démo. Des personnes fictives, des sociétés réelles dont les données publiques s'affichent. Les contacts se créent en passant par l'application, pour que l'IA et l'enrichissement tournent réellement à l'écran.
- Filmer les écrans. Claude écrit le scénario Playwright de chaque séquence : se connecter, scanner une carte, ouvrir la fiche, faire écrire la relance. Le script se rejoue autant de fois que nécessaire, à l'identique.
- Générer la voix. Le texte part sur ElevenLabs. Les noms de marque se réécrivent pour l'oreille (« Let's Ligo » pour LetsLigo), les sous-titres gardent la vraie graphie.
- Composer la musique. On décrit à ElevenLabs la piste voulue : pour LetsLigo, de l'électro-pop entraînante qui monte sur l'intro et se calme sous les démonstrations. La piste est composée pour la vidéo, sans passer par une banque de sons.
- Animer la présentatrice. La piste de voix est téléversée dans HeyGen, sur un avatar posé devant un décor généré.
- Monter. Whisper donne le minutage de chaque mot, le script de montage place les écrans, accélère les temps d'attente de l'IA et écrit les sous-titres. La musique monte sur l'intro, baisse d'elle-même dès que la présentatrice parle et repart sur la sortie.
- Relire. Chaque plan se compare à l'application réelle avant publication.
Les rendus HeyGen et ElevenLabs sont payants : on ne les lance qu'une fois le texte validé. Tout le reste se rejoue gratuitement, autant de fois qu'il faut.
Nos astuces de fabrication
Pour filmer l'application avec Playwright
- Filmer en double résolution. Une fenêtre de 1600 × 900 rendue à 2x donne une image de 3200 × 1800 : on peut zoomer au montage sans flou.
- Ajouter un curseur. Un navigateur piloté n'affiche pas de souris. Un petit script injecté dans la page dessine une flèche qui suit les mouvements, et une onde rose à chaque clic.
- Nettoyer l'écran. Le même script masque la barre de débogage, le bandeau de développement et le lien d'administration avant chaque prise.
- Remplacer la webcam par un fichier. Chrome accepte une vidéo à la place de la caméra : le scan de carte de visite se filme avec une vraie carte, sans téléphone.
- Horodater les actions. Le script note l'instant de chaque clic et de chaque saisie. Le montage s'en sert pour savoir où zoomer et quels temps morts accélérer.
Pour la voix et la présentatrice
- Écrire le texte pour l'oreille. La voix reçoit une version phonétique des marques (« Mèl-tchimp » pour Mailchimp), les sous-titres gardent la vraie graphie. On écoute chaque nom propre avant d'envoyer la piste à HeyGen.
- Faire la voix sur ElevenLabs, l'avatar sur HeyGen. HeyGen reçoit la piste audio déjà validée : on garde la même voix d'une vidéo à l'autre, et un défaut d'avatar se corrige sans regénérer la voix.
- Une seule scène, tête centrée. Un export HeyGen d'un seul tenant, présentatrice au centre, se recadre au montage en plein écran ou en bulle ronde dans un coin.
- Valider une vidéo pilote. Pour les formats courts, on publie une ou deux vidéos d'essai avant de lancer la série.
Pour le montage
- Rendre les animations image par image. Filmer une animation en temps réel fait sauter des images. On avance la timeline GSAP d'une image à la fois et Playwright fait une capture à chaque pas : le rendu est identique d'une fois sur l'autre.
- Baisser la musique sous la voix automatiquement. ffmpeg compresse la musique dès que la voix parle (le sidechain), puis normalise le volume au niveau attendu par les réseaux.
- Accélérer l'attente de l'IA. Quand l'application réfléchit, le plan s'accélère pour tenir dans la phrase qui le commente.
- Couper court. Un plan dure rarement plus de quatre secondes.
Le logo animé en motion design
L'intro part du fichier vectoriel du logo, le SVG que la marque utilise déjà sur son site. Claude Code en reprend les tracés et écrit l'animation avec GSAP : les deux cartes du symbole se dessinent au trait, se remplissent en glissant l'une vers l'autre, le point rose tombe entre elles et envoie une onde. Le nom s'écrit ensuite lettre par lettre, un reflet traverse le logo et la promesse s'affiche.
L'animation est une page web. Playwright la rend image par image, à cadence fixe, ce qui donne une vidéo nette à intégrer au montage. La même animation sert de sortie, et se réutilise en ouverture de chaque format court. Une marque qui a son logo en SVG a déjà de quoi faire la sienne.
Les sous-titres en SRT
LinkedIn et Instagram lancent les vidéos sans le son. Les sous-titres sortent de la voix elle-même : Whisper, qui tourne sur la machine, retranscrit chaque mot avec son minutage, et le script de montage le recale sur le texte prévu pour corriger l'orthographe des noms propres.
Le montage écrit deux fichiers à part, au format SRT pour les logiciels de montage et les réseaux, et au format VTT pour le web et YouTube. Pour les réseaux, les sous-titres sont aussi incrustés dans l'image. Nous suivons la charte de sous-titrage française : deux lignes au plus, une quarantaine de caractères par ligne, une coupe sur une unité de sens, et les sons utiles notés entre crochets, comme « [musique entraînante] ».
Une vidéo en plusieurs langues
Toute la chaîne se rejoue dans une autre langue. Pour la version anglaise de LetsLigo, Playwright a refilmé l'application en anglais, ElevenLabs a lu le texte avec une voix anglaise, HeyGen a animé la même présentatrice, et les sous-titres sont sortis en anglais. Le texte anglais est une adaptation relue.
Le surcoût d'une langue de plus tient aux rendus et à une relecture. Sans tournage ni comédien, une démo produit peut sortir dans la langue de chaque marché.
Ne montrer que de vrais écrans
L'IA sait générer une interface qui n'existe pas. Dans une vidéo de démonstration, c'est une promesse que le produit ne tiendra pas. Nos règles de tournage :
- les écrans sont filmés dans l'application, et les animations se limitent à la caméra, au curseur et aux surlignages ;
- aucun chiffre n'est posé à la main pour faire vrai : les compteurs sont ceux que l'application calcule ;
- les images générées montrent des situations (une pile de cartes sur un bureau, une allée de salon), jamais une fonctionnalité.
Une vidéo à chaque ticket livré
Sur tous nos projets, chaque ticket livré a sa vidéo. Avant la mise en production, notre agent IA rejoue le parcours prévu dans la spécification et filme la fonctionnalité en marche, avec une légende à chaque étape. Ces vidéos de recette n'ont ni voix ni musique.
Le client valide sur la vidéo, puis sur un site de test. Il voit ce qui a été livré sans avoir à installer quoi que ce soit, et il repère tout de suite un écart avec ce qu'il attendait.
La même vidéo ressert ensuite :
- pour former les utilisateurs, qui voient le geste sur le vrai écran ;
- pour rédiger la documentation, où elle remplace une page de captures ;
- pour la conduite du changement, quand les équipes découvrent la nouvelle version avant de l'utiliser ;
- pour l'équipe marketing, qui valorise le produit en avant-vente, montre un MVP à ses premiers clients ou annonce la mise en ligne : il suffit d'y ajouter une voix et une musique.
Que vous nous confiiez une nouvelle application métier, un MVP, la reprise d'une application existante ou des demandes au fil de l'eau en abonnement, chaque livraison arrive avec sa vidéo.
Des vidéos courtes pour les réseaux sociaux
Les écrans filmés une fois se recadrent en vertical pour Instagram, TikTok et LinkedIn. Pour LetsLigo, nous en tirons des microvidéos d'environ 30 secondes : une situation que vit la cible, puis le geste sur le vrai écran. La présentatrice HeyGen devient une créatrice de contenu récurrente, avec son décor et son ton. Les sous-titres sont incrustés pour une lecture sans le son, et la publication est planifiée sur tous les réseaux depuis un même outil.
Une fois la chaîne en place, une nouvelle vidéo coûte un texte, une relecture et les rendus.
Nous montons ce type de production pour nos clients avec le content studio réseaux sociaux. Les contacts que ces vidéos amènent se suivent avec la relance LinkedIn branchée sur le CRM.
Apprendre à le faire, ou nous le confier
Si votre équipe veut fabriquer ses propres vidéos, la formation IA opérationnelle part de vos cas réels : votre logiciel à filmer, vos contenus à décliner, les outils à brancher entre eux.
Si vous cherchez d'abord où la vidéo et l'automatisation du contenu vous feraient gagner du temps, le diagnostic et la feuille de route IA vous le dit avant tout achat d'outil.
Vous vous posez la même question ?
Racontez-nous votre situation. On vous dira dans le même échange si c'est un sujet pour nous, et par quoi on commencerait.
ou choisissez un créneau tout de suite, ou appelez le 06 01 91 57 40