Communitygithub.com

atlantis-mk/remotion-video-template

Créez automatiquement des vidéos explicatives de style infographie sombre à partir d'un sujet : rédaction du script, doublage avec Doubao, storyboard et assets, animation Remotion, rendu final, couverture et texte de publication. Prend en charge les formats paysage et portrait.

Qu'est-ce que remotion-video-template ?

Ce skill permet à un agent AI (comme Claude Code, Cursor, Codex) de produire de manière autonome des vidéos complètes de type "infographie parlée" (explications financières, technologiques, scientifiques) dans un style visuel sombre et moderne. Il couvre l'ensemble du pipeline : génération du script en sections, synthèse vocale via l'API Doubao (TTS), création d'un storyboard structuré, récupération d'assets visuels (icônes, images, graphiques), assemblage d'un projet Remotion, rendu de la vidéo et de la couverture, et génération des textes de publication. Le skill impose des règles strictes : les données doivent être sourcées, les couleurs et animations proviennent de tokens centralisés, et aucun secret (clé API) n'est exposé. Il fonctionne en mode autonome : après le choix du sujet, l'utilisateur n'a plus à intervenir jusqu'à la livraison du fichier final. Il supporte à la fois le format paysage (1920×1080) et portrait (1080×1440).

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/atlantis-mk/remotion-video-template/tree/HEAD/.agents/skills/remotion-infographic-video

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Vidéo Infographie Parlée

Emplacement et Structure de Livraison (Architecture v1.11)

  • La racine du dépôt de livraison doit contenir AGENTS.md (comment utiliser ce template) ; ce skill est fixé dans .agents/skills/remotion-infographic-video/.
  • tests/ se trouve à la racine du dépôt (au même niveau que .agents/) et appartient à la CI – n'appartient pas à l'exécution du skill et n'est pas copié lors de l'installation du seul skill.
  • Le fichier .env se trouve uniquement dans le répertoire du skill, pas à la racine du dépôt.

Préparation avant Utilisation (Copier et Utiliser)

  1. Copie :
    • Utilisation du dépôt complet : Clonez/copiez la racine du dépôt de livraison et ouvrez-la (inclut AGENTS.md à la racine et tests/).
    • Installation du seul skill : Copiez .agents/skills/remotion-infographic-video/ vers le même chemin relatif dans le projet cible (inclut scripts/ et son sous-répertoire lib/).
    • Le package du skill lui-même ne nécessite pas d'installation pip / npm ; scripts/ utilise uniquement la bibliothèque standard Python. Une fois le .env configuré, vous pouvez exécuter les étapes 0–5.
  2. Configuration de .env : Dans le répertoire du skill, exécutez cp .env.example .env, puis éditez .env en renseignant :
    • Obligatoire : DOUBAO_TTS_API_KEY= (écrivez la clé après le signe égal, sans guillemets)
    • Optionnel : DOUBAO_SPEAKER= (voir les voix par défaut dans VOICE)
    • .env est ignoré par .gitignore – ne collez pas la clé dans la conversation et ne changez pas de moteur de doublage.
  3. Prérequis système (à installer manuellement, le script ne le fait pas) : Node 18+, Python 3, ffmpeg, ffprobe, connexion réseau.
  4. Lancer la création : Lorsque l'utilisateur dit « Commencer la création » ou une intention équivalente :
    • Exécutez d'abord python3 scripts/check_env.py (vous pouvez utiliser --skill-dir <chemin absolu du skill> ; par défaut, le répertoire courant).
    • Code de sortie 3 : invitez l'utilisateur à remplir DOUBAO_TTS_API_KEY dans .agents/skills/remotion-infographic-video/.env (ou le chemin absolu du skill), attendez la réponse « j'ai rempli » avant de relancer ; ne faites pas de doublage et ne créez pas de projet avant.
    • Si OK : si le sujet a déjà été mentionné dans le message, passez directement aux étapes fixes ; sinon, demandez le sujet en une seule question (vous pouvez préciser « portrait » ; par défaut paysage 1920×1080, portrait 1080×1440, règles dans LAYOUT). Le nom de la plateforme n'affecte pas le format de l'image.

Règles Strictes

  • La clé API est lue uniquement depuis DOUBAO_TTS_API_KEY dans le fichier .env du répertoire du skill (dans le dépôt de livraison : .agents/skills/remotion-infographic-video/.env) ; n'obligez pas l'utilisateur à coller la clé dans la conversation, ne changez pas de moteur de doublage, n'affichez pas la clé dans les sorties.
  • Ne publiez pas, ne téléchargez pas : produisez uniquement la vidéo finale, la couverture et les fichiers de texte.
  • Les chiffres doivent avoir une source ; les chiffres affichés à l'écran doivent porter un badge de source ; les icônes illustratives doivent être marquées « Illustration ».
  • La dernière ligne stdout de chaque script est un résumé JSON ; gérez selon le code de sortie : 3 = clé manquante (invitez à remplir .env, arrêtez), 4 = échec d'authentification (arrêtez), 5 = corrigez l'artefact en amont, 6 = relancez uniquement les éléments échoués, 7 = passez en mode réparation.

Étapes Fixes

  1. Vérification préalable : python3 scripts/check_env.py. Code de sortie 3 : invitez à remplir .env comme indiqué ci-dessus, puis relancez.
  2. Collecte du sujet : Déterminez le topic, le slug et le format de l'écran, écrivez <slug>/job.json (par défaut paysage si non précisé) ; si l'utilisateur nomme une plateforme, écrivez platforms, sinon utilisez les plateformes par défaut selon PUBLISH.
  3. Rédaction : Écrivez script.md (avec ## Sxx NomSection + - [01] Texte {context: … | rate: 0 | pause: 300}) et sources.md (avec un bloc json à la fin), exécutez python3 scripts/validate.py sources <slug>/script.md <slug>/sources.md ; les chiffres sans source doivent être supprimés ou une source doit être ajoutée.
  4. Doublage : Si un outil MCP de doublage avec entrée/sortie équivalente (tts_synthesize) est disponible dans l'environnement, utilisez-le ; sinon, exécutez python3 scripts/tts_doubao.py <slug>/script.md --out-dir <slug>/voice ; le timeline.json produit par les deux méthodes doit être validé avec le même schéma (dans assets/schemas/) : python3 scripts/validate.py timeline <slug>/voice/timeline.json. Pour les phrases en échec, relancez avec --only.
  5. Storyboard : Écrivez storyboard.json (chaque phrase doit être couverte par au moins un plan, les transitions de section et les entrées de plan doivent utiliser des valeurs énumérées), exécutez python3 scripts/validate.py storyboard <slug>/storyboard.json --timeline <slug>/voice/timeline.json.
  6. Assets : Utilisez python3 scripts/fetch_asset.py add pour enregistrer chaque asset, prune pour supprimer les assets inutilisés ; n'utilisez pas d'assets sans licence claire.
  7. Construction du projet : python3 scripts/scaffold_project.py --job <slug>/job.json --out <slug>/project génère le projet, écrivez les scènes de chaque section selon l'exemple (assets/example/), puis exécutez python3 scripts/build_timeline.py --timeline <slug>/voice/timeline.json --storyboard <slug>/storyboard.json --subtitles <slug>/voice/subtitles.json --manifest <slug>/assets-manifest.json --project <slug>/project, puis npm ci dans le répertoire du projet.
  8. Auto-vérification : bash scripts/check_project.sh <slug> ; en cas d'échec, lisez check/report.json, corrigez et relancez (maximum 3 fois) ; si toujours en échec, arrêtez et rapportez.
  9. Rendu : bash scripts/render.sh <slug> produit la vidéo finale (<slug>/out/video.mp4) et la couverture (<slug>/publish/cover_<W>x<H>.png) avec vérification automatique.
  10. Texte de publication et livraison : Selon PUBLISH, pour chaque plateforme cible, écrivez un ensemble publish/<plateforme>/title.txt, description.txt, et les tags dans publish/<plateforme>/tags.txt (un par ligne), puis exécutez python3 scripts/validate.py publish <slug>, python3 scripts/validate.py deliverable <slug>, python3 scripts/validate.py leak <slug>, et enfin python3 scripts/fetch_asset.py credits-diff --manifest <slug>/assets-manifest.json --slug-dir <slug> pour vérifier les crédits.

Résumé des Règles de Style

  • Les couleurs, tailles de police et valeurs d'animation proviennent uniquement de assets/tokens.json ; couleur de fond de base #070A0F ; le code des scènes ne contient pas de valeurs de couleur (voir STYLE).
  • Les entrées sont toutes en ressort ; 5 types de transitions de section, 3 types d'entrées de plan (valeurs énumérées dans le storyboard) (voir MOTION).
  • Utilisez uniquement les 15 composants du registre ; pour les composants en dehors de la liste, écrivez-les dans le projet en utilisant les tokens + useLayout() (voir COMPONENTS).
  • Seulement quatre couches : background / scene / hud / subtitle ; pas d'écran de crédits en fin de vidéo ; durée = durée du doublage.
  • Utilisez uniquement random(seed) pour l'aléatoire ; interdiction de Math.random.
  • La disposition est dérivée de la largeur et de la hauteur du canevas ; dans src/, seul src/layout/presets.ts peut contenir les dimensions du canevas (voir LAYOUT).
  • Le format du script est décrit dans SCRIPT, les paramètres de doublage dans VOICE, et les licences/crédits des assets dans ASSETS.

Interdictions

  • Ne publiez pas et ne téléchargez sur aucune plateforme.
  • Ne divulguez pas la clé API : ne l'affichez pas, ne l'écrivez pas dans les artefacts, n'obligez pas l'utilisateur à la coller dans la conversation, ne changez pas de moteur de doublage.
  • N'utilisez pas d'assets sans licence claire ; pas de liens dans les crédits, descriptions ou titres.
  • Ne fabriquez pas de données : les chiffres sans source n'entrent pas dans le script ni ne s'affichent à l'écran.
  • N'interrogez pas l'utilisateur entre la détermination du sujet et la livraison, et ne demandez aucun asset.

Livraison

Renvoyez le contenu de deliverable.json en une seule fois : chemin et durée de la vidéo finale, format de l'écran, couverture, titres et descriptions par plateforme, tags, crédits des assets, répertoire de sortie et notes.

Skills associés