Motion Skills
← Guides

Comment faire une vidéo avec Claude Code (étape par étape, 2026)

Oui. Claude Code peut faire des vidéos : il écrit l’animation sous forme de code et fait le rendu d’un MP4 sur votre propre ordinateur. Les solutions courantes sont les skills d’agent de Remotion, HyperFrames, ou un skill film complet de Motion Skills qui planifie, compose la musique et fait le rendu d’un film entier. Claude Code est inclus dans Claude Pro et Max, et vous n’avez pas besoin de Claude Motion, qui est une bêta distincte dans Claude sur les forfaits Team et Enterprise.

Ci-dessous : les quatre solutions côte à côte, un déroulé étape par étape de l’installation au MP4 avec Motion Director, le skill gratuit, et un vrai film suivi de son brief jusqu’à sa dernière révision.

Vérifié à partir de la page des tarifs de Claude, du quickstart de Claude Code, du guide pour agents de code de Remotion et du README de HyperFrames le 29 octobre 2026.

Quatre façons de faire une vidéo avec Claude Code

Solution Ce que vous écrivez Ce que vous obtenez Installation Coût
Un seul prompt à Opus Rien ; Claude écrit une animation HTML Une page qui s’anime dans le navigateur ; vous l’enregistrez ou en faites le rendu vous-même Aucune Votre forfait Claude
Remotion + ses skills d’agent Des composants React, écrits par Claude Un MP4, à partir d’un projet Remotion que vous gardez npx create-video, puis npx remotion skills add La licence propre de Remotion (voir leur page de licence)
HyperFrames HTML, CSS et GSAP, écrits par Claude Un MP4, rendu dans Chrome headless avec FFmpeg npx hyperframes init, ou son plugin Claude Code Open source (Apache 2.0)
Un skill film complet de Motion Skills Votre matière et une phrase Un film entier : une direction, une musique originale, des vérifications, le MP4 L’installation en une phrase ci-dessous Motion Director gratuit ; $4.90 par skill, ou un forfait

Un seul prompt à Opus est le moyen le plus rapide de voir ce que Claude sait animer : demandez « un titre animé de 15 secondes pour mon app, en un seul fichier HTML » et ouvrez-le. Le résultat change d’une exécution à l’autre, et c’est à vous de le transformer en MP4. Notre page des prompts Claude Motion contient des prompts partagés par d’autres utilisateurs exactement pour cela.

Remotion est le framework de référence pour la vidéo en React. Son guide pour agents de code vous fait créer un projet avec npx create-video --yes --blank my-video, ajouter ses skills d’agent avec npx remotion skills add, prévisualiser avec npm run dev, puis lancer Claude Code dans un second terminal. Il convient aux développeurs qui veulent un contrôle total sur chaque composant. Consultez la licence de Remotion avant de l’utiliser au travail. Comment ses skills d’agent se comparent à un skill film complet : Skills d’agent Remotion ou Motion Skills.

HyperFrames, de HeyGen, est un framework open source qui transforme « du HTML, du CSS, des médias et des animations navigables dans le temps » en fichiers MP4. Vous pouvez l’installer comme plugin Claude Code ou démarrer un projet avec npx hyperframes init my-video et faire le rendu avec npx hyperframes render. Nos anciens modèles d'animation, désormais conservés comme exemples, reposaient dessus. Pour comparer les deux moteurs, voir HyperFrames ou Remotion.

Un skill film complet de Motion Skills est un skill que votre agent charge. Vous n’écrivez pas de composants : vous lui donnez votre projet, vos notes, vos données ou votre script, et vous dites à quoi sert le film. Il choisit une direction et vous montre une image clé, écrit le film sous forme de code, compose sa musique, vérifie chaque image et fait le rendu du MP4 avec notre moteur ouvert, motion-skills (mo). La suite de ce guide utilise cette solution.

Ce qu’il vous faut

  • Claude Code, sur Claude Pro ou Max (également Team, Enterprise ou un compte Claude Console ; il n’est pas inclus dans le forfait gratuit).
  • Node.js 22 ou plus récent.
  • FFmpeg (brew install ffmpeg sur macOS).
  • Google Chrome. Le moteur de rendu le pilote en mode headless.

Le moteur s’installe tout seul via npx la première fois qu’il fait un rendu ; aucune clé d’API n’est nécessaire. La première étape du skill, mo doctor, vérifie ces trois éléments et indique ce qui manque. Pour savoir où se trouvent les skills, voir Comment installer des skills d’agent.

Étape par étape avec Motion Director

Motion Director est gratuit et ne demande qu’une connexion Google. Il fait un film de 10–20 secondes de n’importe quel type : un teaser de lancement, un chiffre qui marque, une idée expliquée, une accroche verticale.

1. Installez-le en une phrase

Ouvrez Claude Code dans un dossier (votre projet, ou un dossier vide) et collez :

Read https://claude-motion.com/skills/motion-director/install.md and follow it to install the "motion-director" skill, then make a first video with it.

Claude Code lit le guide et exécute une seule commande, npx motion-skills install motion-director. La première fois, une page s’ouvre dans votre navigateur : connectez-vous avec Google et approuvez le code affiché dans votre terminal. Vous préférez le terminal ? Chaque page de skill contient la commande pour Claude Code, Codex, Cursor et Gemini CLI : cliquez sur Copier le prompt d’installation et ouvrez l’onglet Installer dans le terminal.

2. Donnez-lui votre matière

Dites de quoi parle le film et indiquez ce qu’il doit utiliser : le dépôt où il se trouve, un README, un CHANGELOG, un tableur, un lien, un script. Par exemple :

Fais un teaser de lancement de 15 secondes pour cette app à partir de README.md et des notes de la 2.0 dans CHANGELOG.md. En 16:9, pour notre site.

Le skill commence un fichier sources.md : chaque phrase, chiffre et nom qu’il pourrait montrer, avec le fichier ou l’URL d’où il vient. Il ne pose que les questions qui changeraient le film (où il sera diffusé, la durée, votre marque), avec ses valeurs par défaut déjà indiquées. Pas encore de matière ? Il utilise un exemple de changelog fourni avec le skill et le signale.

3. Choisissez une direction

Avant de construire quoi que ce soit, le skill propose trois directions pour votre film, chacune en une phrase avec une image fixe dans son propre style et sa palette (typographie cinétique, histoire de données ou tableau blanc pour Motion Director). Vous en choisissez une, ou vous les mélangez (« les couleurs de la deuxième sur la première ») ; si vous avez dit « fais-le », il prend la plus forte et vous dit laquelle. Il écrit ensuite un court traitement pour cette direction : quand l’accroche arrive, quand le message tombe sur le temps le plus fort, et la fin tenue. C’est votre vérification du storyboard : une image fixe se modifie plus vite qu’un film terminé.

4. Laissez-le construire, vérifier et composer la musique

Il écrit le film dans un seul index.html (HTML et GSAP), puis examine son propre travail : une planche contact de tout le film, mo check pour les erreurs, mo audit pour que chaque phrase à l’écran ait une source, et des images fixes des moments clés qu’il ouvre et corrige. Il écrit une musique originale avec un court motif pour votre sujet. Il ne peut pas entendre, alors il vous dit ce qu’il a écrit.

5. Demandez une modification

Regardez le rendu et dites ce qu’il faut changer en langage courant : « le logo arrive trop tard », « utilise notre vert », « garde la dernière phrase plus longtemps ». Le skill fait la plus petite modification possible à cet endroit et à ce moment, puis refait le rendu. Vous pouvez aussi lancer mo studio pour ouvrir un aperçu en direct, appuyer sur C, cliquer sur l’image dont vous parlez et y écrire la modification.

6. Récupérez le MP4

Le dernier rendu est placé dans votre projet avec son chemin, sa durée et son format, une note d’une ligne sur le style et la musique, et un handoff.md. Quand vous voulez le film complet de ce type, un film de lancement de 30–90 secondes, une vidéo explicative ou une vidéo de données, le skill film complet du type correspondant reprend à partir du même dossier.

Un vrai exemple : « Claude Code en trois étapes »

Ce film de 29 secondes a été réalisé avec notre skill Vidéo de prise en main, qui fonctionne comme Motion Director, avec un film plus long et plus de styles.

Claude Code en trois étapes

Installer, démarrer dans un projet, poser la première question : le quickstart officiel, avec la vraie sortie de version.

Exemple de Vidéo de prise en main16:9 · 29 s

Démo non officielle, ni faite ni approuvée par Anthropic.

Le brief. « Une présentation de prise en main de 30 secondes en 16:9 pour des personnes sur un forfait Claude Pro ou Max qui n’ont jamais utilisé Claude Code, diffusée sur notre site et dans un e-mail de démarrage : l’installer, le lancer dans un projet, lui poser une question. Utiliser uniquement le quickstart officiel ; ne pas inventer de commandes ni de résultats. » La matière était constituée des pages publiques de quickstart et d’installation de Claude Code, plus une vraie exécution de claude --version.

Les directions. Le skill en a proposé trois : un grand terminal avec un rail d’étapes, une ligne de commande sans fin à travers des champs de couleur, et une carte du système montrant ce que touche chaque commande. Il a choisi le terminal : « le message est un flux de travail et l’interface est un terminal, donc la preuve la plus forte, ce sont les vraies commandes tapées en grand ». Il a aussi nommé le risque d’emblée : aucune vraie capture d’écran d’une session n’était disponible, cet écran devait donc se lire comme simplifié, et il est marqué « mise en page simplifiée » dans le film.

Le plan. Un traitement en mesures à 112 BPM : installer, lancer, demander, puis la réponse d’exemple sur le temps fort et la commande d’installation en carton final. Chaque mot à l’écran est rattaché au quickstart dans son sources.md ; la ligne de version est la vraie sortie.

La révision. Après le premier rendu, mo qa a montré une pause de 3 secondes après l’étape 1 et une pause de 2 secondes après l’étape 2 dont personne n’avait besoin. Les étapes 2 et 3 ont été avancées et le temps fort est arrivé une mesure plus tôt, ce qui explique que le film dure 29 secondes au lieu de 30.

La source du film, avec ses directions, son traitement et ses sources, est fournie comme exemple avec le skill Vidéo de prise en main.

Choisissez un skill film complet pour votre type de film

Motion Director s’arrête volontairement à 20 secondes. Pour le film complet, chaque type de film a son propre skill film complet, avec ses styles intégrés :

  • Lancement : films de lancement, présentations de prise en main, comparatifs, présentations de marque, promos d’événements, aperçus pour les app stores.
  • Enseigner : vidéos explicatives, leçons, explications d’articles scientifiques, frises chronologiques, explications mathématiques.
  • Réseaux : shorts verticaux, vidéos face caméra, titres et transitions, cartes pour les réseaux sociaux.
  • Rapports : vidéos de données, points d’équipe, replays de sessions, présentations commentées, points investisseurs.

Chaque skill coûte $4.90, ou tous sont inclus avec un forfait : $9.90 par mois, $79 par an, ou $169 une seule fois pour le pass fondateur à vie. Voir les tarifs.

Dépannage

  • « FFmpeg not found » ou « Chrome not found ». Lancez mo doctor (npx --yes motion-skills doctor) ; il indique ce qui manque. Sur macOS, brew install ffmpeg ; installez Google Chrome depuis le site de Google.
  • Claude Code n’utilise pas le skill. Démarrez une nouvelle session Claude Code après l’installation pour qu’il lise le nouveau skill, puis redemandez en le nommant : « utilise le skill motion-director ».
  • Le sandbox bloque un navigateur ou un serveur local. Le skill a besoin des deux pour ses vérifications visuelles. Approuvez-les quand Claude Code le demande ; ne le laissez pas sauter les vérifications.
  • Le film dure plus de 20 secondes. Motion Director fait les 20 secondes les plus fortes et vous indique quel skill fait le film complet.

Vous n’utilisez pas Claude Code ?

Les mêmes skills fonctionnent dans Codex, Cursor et Gemini CLI, ce qui est aussi la solution sur le forfait gratuit de Claude. L’emplacement des skills pour chaque agent est expliqué dans Comment installer des skills d’agent. Si vous cherchiez Claude Motion lui-même, voir Claude Motion absent de votre forfait ?. Le pas-à-pas pour ces agents, avec le dossier que chacun lit : Faire des vidéos avec Codex, Cursor ou Gemini CLI.

Questions

Claude Code peut-il faire des vidéos ?

Oui. Claude Code peut écrire une animation sous forme de code et en faire le rendu en MP4 sur votre ordinateur. Les solutions courantes sont les skills d’agent de Remotion (React), HyperFrames (HTML et GSAP), ou un skill film complet de Motion Skills qui planifie, compose la musique et fait le rendu d’un film entier. Claude Code est inclus dans Claude Pro et Max.

Ai-je besoin de Claude Motion pour faire des vidéos avec Claude ?

Non. Claude Motion est une fonctionnalité bêta distincte dans Claude sur les forfaits Team et Enterprise. Claude Code sur Pro ou Max peut faire le même type d’animation construite en code avec un skill, rendue sur votre propre ordinateur.

Que dois-je installer ?

Node.js 22 ou plus récent, FFmpeg et Google Chrome. Le moteur motion-skills s’installe tout seul via npx la première fois qu’il fait un rendu, et aucune clé d’API n’est nécessaire.

Est-ce gratuit ?

Motion Director est gratuit avec une connexion Google et fait des films de 10–20 secondes. Chaque skill film complet coûte $4.90, ou tous sont inclus avec un forfait : $9.90 par mois, $79 par an ou $169 une seule fois. Il n’y a pas de crédits ; la seule consommation est celle de votre propre forfait Claude.

Mon film quitte-t-il mon ordinateur ?

Le film est construit et rendu sur votre ordinateur. Quand un rendu se termine, le moteur indique à claude-motion.com quel skill a fait le rendu et s’il a fonctionné, rien sur le film lui-même ; définir MOTION_SKILLS_TELEMETRY=0 désactive cet envoi.

Sources

Ce guide est indépendant et sans lien avec Anthropic, Remotion ou HeyGen. Claude est une marque d’Anthropic, PBC. Vérifié à partir des pages ci-dessus le 29 octobre 2026.