Communitygithub.com

yahiafarid1/toon3d-story-shorts

Créez un court métrage animé vertical de 45 à 65 secondes dans un style cartoon en 3D, avec des personnages plats 2D à tête blanche, un éclairage chaleureux et une caméra glissante, rendu avec three.js et Remotion sur Mac.

Qu'est-ce que toon3d-story-shorts ?

Cette compétence permet de générer automatiquement des courtes vidéos animées verticales (1080x1920, 30 ips) d'une durée de 45 à 65 secondes, dans un style cartoon en 3D distinctif : des personnages plats 2D blancs évoluent dans un monde 3D coloré aux contours encrés, avec un éclairage motivé, un flou d'objectif et une caméra qui ne coupe jamais. Le récit, rapide (environ 3,7 mots par seconde), est accompagné de sous-titres mot à mot et d'une bande sonore originale (musique + effets sonores) masterisée à -14 LUFS. La compétence est parfaite pour les histoires vraies surprenantes, les anecdotes historiques ou scientifiques, et utilise un pipeline complet : recherche de sujets viraux, rédaction de script avec sources, génération vocale (edge-tts), plan de tournage détaillé avec transitions douces (dissolve, iris, poussière, flash), et rendu final via Remotion et three.js sur Mac. Elle intègre des étapes d'approbation (validation du script puis 'review board' avant rendu final) et respecte des préférences et vérifications utilisateur. Basée sur le projet mromidev/claude-animated-shorts (MIT), elle corrige toutes les lacunes identifiées dans son audit.

Compatible avec✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/yahiafarid1/toon3d-story-shorts/tree/HEAD/skill/toon3d-story-shorts

Demander à votre IA préférée

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

Documentation

Courts métrages animés cartoon en 3D (three.js + Remotion)

Ce qu'il produit : un court métrage 1080x1920, 30 ips, 45 à 65 secondes. Une histoire vraie originale racontée selon la méthode de référence : un accroche absurde au passé, des sceptiques qui rient, « Vous voyez », puis une conclusion en une ligne. Des cartes plates cartoon se tiennent dans un monde 3D peint avec des contours encrés, une lumière chaude motivée contrastant avec une ombre froide, un flou d'objectif et une caméra qui ne coupe jamais. Un narrateur rapide (~3,7 mots/s), des sous-titres mot à mot, une musique originale et des effets sonores synthétisés, masterisés à -14 LUFS.

Exemple concret : Les Faux Acheteurs (1937, Sylvan Goldman paie des acteurs pour pousser ses nouveaux chariots de courses), qui se trouve dans project/src/videos/fake-shoppers/ et project/stories/fake-shoppers/.

Règles de base (toujours)

  • L'histoire, les personnages, la voix et la musique sont les nôtres. Utilisez la référence pour l'apparence et la formule, jamais ses scripts, personnages ou plans. Ne mentionnez jamais le nom de la chaîne dans une vidéo, un titre ou une description. Les vidéos de référence sont du matériel d'étude privé : ne les téléchargez ni ne les partagez jamais.
  • Les faits sont recherchés et sourcés en haut du SCRIPT.md de l'histoire. Les blagues sont des hyperboles ou des faits réels, jamais une histoire inventée présentée comme un fait.
  • Outils gratuits et locaux uniquement. Utilisez edge-tts ou la propre voix de l'utilisateur ; pas de générateurs payants. Demandez avant d'utiliser des crédits sur un connecteur.
  • Pas de pauses dans la voix (coupez les écarts à 0,07 s, ou 0,2 s en fin de phrase). Les sous-titres sont activés (style de référence). La vidéo se termine ≤0,5 s après le dernier mot, sans outro ni appel à l'action.
  • Vérifiez references/TOPICS_DONE.md avant de choisir un sujet.
  • Deux portes d'approbation, puis « fais-le » (conservé de la compétence d'origine) :
    1. Script : montrez le script (avec ses sources) et attendez l'accord de l'utilisateur avant la voix et le plan de tournage. Après cela, travaillez sans demander jusqu'à la porte 2.
    2. Comité de révision : avant le rendu complet, l'utilisateur regarde un brouillon en demi-taille sur le comité de révision, épingle des notes sur des moments ou des scènes, et appuie sur « Looks good » (étape 8). Les cycles se répètent jusqu'à ce moment ; pas de rendu complet avant.
  • Le goût de l'utilisateur et les vérifications apprises (des comités de révision précédents). Lisez les deux fichiers PREFERENCES avant d'écrire le script (étape 2), le plan de tournage (étape 4), les décors (étape 5) et le casting (étape 6). Parcourez les deux fichiers CHECKS à l'étape 8, ainsi que les Pièges de lisibilité :
    • partagés par chaque compétence vidéo : ~/video-editor/review-board/PREFERENCES.md, ~/video-editor/review-board/CHECKS.md ;
    • ce style uniquement : references/PREFERENCES.md, references/CHECKS.md.
  • Reprendre une histoire existante : exécutez d'abord node ~/video-editor/review-board/cli.mjs show stories/<name>/review. Les notes que l'utilisateur a envoyées pendant qu'aucune session n'était en cours sont traitées avant toute autre chose (étape 8.5).
  • Un rendu complet. Démarrez-le en arrière-plan, indiquez à l'utilisateur l'ETA (~4 ips en 1080, ~10 min pour 60 s en 2K), et ne le sondez pas : le travail signale quand il se termine. Les aperçus à --scale 0.5 sont gratuits à répéter.

Ce Mac (configuré et testé le 2026-11-07)

  • Projet de travail : ~/video-editor/toon3d-shorts/, créé par setup.sh. Il contient src/engine (générique), src/videos/<name>/ (un dossier par vidéo), stories/<name>/ (script, voix, repères, partition), audio/ (kit de synthé + mixeur), tools/measure.py, scripts/ et public/. Une copie fraîche se trouve dans le dossier project/ de cette compétence. Recréez-le n'importe où avec bash ~/.claude/skills/toon3d-story-shorts/setup.sh <dir>, qui exécute npm install (versions épinglées) et pip install --user scipy.
  • Node 24 + Remotion 4.0.539 : GPU via ANGLE/Metal. Les images fixes prennent ~1,3 s chacune après un bundle de ~20 s ; un aperçu complet de 60 s se rend en ~45 s à --scale 0.5.
  • Python 3.9 : numpy, PIL, scipy. ffmpeg-full. whisper-cli avec ~/video-editor/models/ggml-large-v3-turbo-q5_0.bin. edge-tts (python3 -m edge_tts).
  • Étude de référence (à vous de construire, non incluse) : ~/video-editor/reference-study/, réalisée à partir des courts métrages de référence que vous étudiez (téléchargez-les vous-même dans ~/Downloads/reference-shorts/ ; ce sont des documents d'étude, ne les partagez jamais). L'étude de l'auteur a mesuré 19 courts métrages ; les nombres dans references/ en proviennent :
    • STYLE_BIBLE.md et SCRIPTS_ANNOTATED.md
    • measure/ (statistiques par image, transcriptions, feuilles de contact de 2 s / 60 images, images à 1 ips, summary.json), qui sert de référence pour tools/measure.py ours ... --refs
    • frames/ et sheets/ (vues à 1 ips / 2 s utilisées pour les comparaisons côte à côte)
  • Définissez TMPDIR/REMOTION_TMP sur ~/video-editor/remotion-tmp (stills.mjs le fait). Les bundles Remotion s'y accumulent. Supprimez les anciens dossiers remotion-webpack-bundle-* uniquement lorsque l'utilisateur est d'accord.

Pipeline

  1. Idées → sujet → faits. Lorsque l'utilisateur n'a pas de sujet, ou demande des idées, exécutez un tour d'idées (references/VIRAL_IDEAS.md contient les données, les sources, la grille d'évaluation et les règles de fait) :

    • Ce qui gagne maintenant (quelques appels à l'API de recherche YouTube ; demandez d'abord si le connecteur facture des crédits) :

      • Les courts métrages les plus populaires de la chaîne de référence : youtube_channel_shorts avec channel_id <REFERENCE_CHANNEL_ID> (la chaîne dont vous étudiez les courts métrages) et sort_by popular. Ajoutez tous les nouveaux titres à TOPICS_DONE.md.
      • Sujets de niche : faceless_outliers_videos avec une query sémantique par type gagnant (par exemple « court métrage animé révélant la raison cachée derrière une étrange invention historique, une astuce ou une loi, avec une fin twistée »), videoType shorts, langues ["english"], minOutlierScore 3. Ignorez les résultats hors sujet (jeux, gadgets). Notez les modèles de titres et ajoutez les histoires déjà traitées à TOPICS_DONE.md.
    • Candidats : rassemblez environ 30 histoires vraies à partir de la liste de sources, avec WebSearch/WebFetch. Mappez chacune à un type gagnant : raison cachée derrière un objet ou une pratique ancienne, système ou faille étranger, psychologie du cerveau, astuce ou arnaque d'argent, fable ou paradoxe.

    • Notez chacune avec la grille des 10 tests (sur 20). Pour le top 10, vérifiez la fraîcheur avec youtube_search (type shorts) : abandonnez une histoire déjà vue au-dessus d'1 M de vues au cours des 12 derniers mois, ou trouvez un angle nouveau.

    • Présentez 5 à 8 idées avec : un titre de travail dans un modèle gagnant, l'accroche en une ligne, l'objet, le mécanisme + l'analogie, la répartition des notes, pourquoi elle pourrait devenir virale (les chiffres de référence de son type), et 2 à 3 sources. Sauvegardez-les toutes dans references/IDEAS_BANK.md. L'utilisateur en choisit une.

    • Recherchez le sujet choisi :

      • ≥2 sources solides et indépendantes pour chaque nombre, date, nom et affirmation ;
      • légende présentée comme légende ; moqueries dramatisées marquées comme telles ;
      • un bloc de faits (affirmation → liens → confiance) en haut de stories/<name>/SCRIPT.md.

      Pour un sujet volumineux, la compétence de recherche approfondie peut effectuer cette étape.

    Un bon sujet est une histoire vraie surprenante avec un seul objet central et un mécanisme caché que le spectateur peut visualiser, plus une analogie quotidienne qui l'explique (bol de soupe, téléphone glissant d'une table, boutons d'ascenseur).

  2. Script (160-240 mots, 45-65 s). La formule mesurée de la chaîne (references/STYLE_BIBLE.md §2, SCRIPTS_ANNOTATED.md) :

    • Accroche (terminée à ~5 s, 9-20 mots) : une action absurde présentée comme un fait, au passé (« Il a payé des inconnus pour faire semblant de faire les courses dans son propre magasin. »). Alternatives : une affirmation paradoxale (« X est illégal, pourtant... ») ou une promesse conditionnelle (« Si jamais vous... »). Jamais une question.
    • Contexte : 1 à 2 lignes au présent, avec des chiffres concrets et l'année.
    • Sceptiques : quelqu'un rit ou se moque, avec une moquerie citée dans le personnage. Utilisez 1 à 2 moqueries par vidéo.
    • Question du spectateur : « Attendez, ...? » / « Mais comment ? » (environ une par vidéo).
    • Escalade : sauts dans le temps et répétition (« Semaine après semaine », « En juillet... »), plus une blague hyperbolique toutes les 10-15 s (« tellement X que Y », une comparaison qui dégonfle).
    • Tournant : « Puis, un soir/matin... ».
    • Révélation : « Vous voyez, » à ~65-87 % de la durée, donnant le vrai mécanisme en 1 à 3 phrases simples, idéalement à travers l'analogie quotidienne. (« Vous voyez, » juste après l'accroche fonctionne aussi comme un pivot contextuel.)
    • Conclusion : une courte phrase déclarative qui recadre tout (les sceptiques ont eu tort). Coupez dessus. Bonus : écrivez la dernière phrase pour qu'elle fasse écho à la première, pour une boucle fluide.
    • Style : accroche au passé, puis présent ; mots parlés avec contractions ; ~14 mots par phrase ; les connecteurs sont « donc / mais / alors », jamais « et puis ». La deuxième personne (« Imaginez-vous... ») est un mode valide.
    • Ne jamais narrer ce que le spectateur peut déjà voir (conservé de la compétence d'origine). La voix ajoute ce que l'image ne peut pas : la cause, le nombre, la blague, les enjeux. L'image montre l'action.
    • Titre : un écart de curiosité autour de l'objet, 4 à 8 mots, dans un modèle gagnant (« [L'objet] qui [résultat absurde] », « Pourquoi [groupe] [a fait une chose étrange] », « Comment une [petite chose] [a fait une grande chose] », « Ce que [objet] signifiait vraiment », « [La personne] qui [paradoxe] »). Proposez 3 options avec le script.
    • Test de l'accroche : lisez la première phrase à voix haute. Elle doit atterrir en moins de ~3 s et sembler fausse ou impossible. Si elle a besoin de contexte, réécrivez-la.
    • Livrez pour la porte 1 : le script, les 3 titres et le bloc de faits avec sources.
  3. Voix dans stories/<name>/voice/ :

    • Générez : python3 -m edge_tts --voice en-US-AndrewNeural --rate=+14% --text "$(cat ../script.txt)" --write-media raw.mp3, ou utilisez l'enregistrement de l'utilisateur.
    • Resserrez : python3 scripts/tighten_voice.py raw.mp3 voice.wav --sentence-gap 0.12 coupe les écarts à 0,07 s, ou 0,12 s en fin de phrase (la référence a environ 1 pause de plus de 0,25 s par vidéo), et produit du mono 48 kHz.
    • Timings des mots : whisper-cli -l en -ml 1 -sow -oj sur une copie 16 kHz, puis convertissez en words.json ([{w, a, b}] en secondes). Utilisez l'orthographe du script, pas celle de whisper. Copiez-le aussi dans words_authored.json : la timeline sur laquelle le plan de tournage est écrit (story.ts construit RETIME à partir de la paire ; fichiers identiques = aucun changement).
    • L'enregistrement propre de l'utilisateur : comparez ses mots avec le script et mesurez son rythme (mots/s, pauses de plus de 0,25 s). Le resserrement aide à peine une lecture qui est déjà serrée ; si elle est plus lente que les cibles ci-dessous, créez une version avec préservation de la hauteur --tempo 1.1 et laissez l'utilisateur entendre les deux avant de choisir.
    • Remplacement de la voix après le plan de tournage (mêmes mots, nouvel enregistrement ; fait pour Les Faux Acheteurs le 2026-11-08) : ne retimbrez rien à la main.
      • Conservez les anciens timings comme words_authored.json et mettez les nouveaux dans words.json (orthographe du script, même nombre de mots). Des mots différents signifient un nouveau plan de tournage.
      • RETIME = makeRetime(authored, spoken, FPS) (engine/retime.ts) mappe chaque image de sortie sur la timeline écrite, en suivant la nouvelle voix mot par mot avec un lissage de ±2 mots (erreur médiane d'onset ~1 f). index.tsx utilise total: RETIME.total, retime: RETIME ; cast.ts lip-sync continue d'importer words_authored.json.
      • Vérifiez quelques images clés sur les images fixes, puis publiez le nouveau brouillon sur le comité de révision avec chaque scène listée sous --changed.
      • Le son bouge avec, sans rien replacer à la main :
        1. node scripts/retime_cues.mjs <name> conserve cues_authored.json une fois et écrit cues.json dans le temps de sortie (événements, arg dur, fonds sonores, whooshes) plus timemap.json.
        2. python3 score.py music.wav <RETIME.total> timemap.json : les accents suivent l'image, la grille de beats suit section par section. Sans carte, la partition est inchangée (vérifié échantillon par échantillon).
        3. python3 audio/mix.py stories/<name>/cues.json public/<name>/mix.wav, puis whisper du mix pour confirmer que chaque mot est entendu.
    • Cibles : 3,6-3,9 mots/s, accroche terminée ≤6 s. TOTAL = ceil(dernier mot fin × 30) + 6 images.
    • Resserrez avant le plan de tournage, jamais après. Chaque image du plan est construite sur le words.json resserré, donc un re-resserrage ultérieur signifie un retiming de toute la vidéo. (L'exemple a sauté cela et a conservé 10 pauses de plus de 0,25 s, contre environ 1 pour la référence.)
  4. Plan de tournage dans src/videos/<name>/story.ts (copiez l'exemple) :

    • SHOTS : {id, a, b, light, set} en images. Un nouveau visuel toutes les ~2,2 s (environ tous les 8 mots). L'action atterrit sur le mot-clé, 0-3 f avant son onset.
    • TRANSITIONS : comment un plan arrive :
      • dissolve (4-8 f) lors d'un changement de lieu ou de temps
      • iris (12-16 f, cx/cy) à travers des hublots, judas, lentilles ou horloges
      • dust (20-26 f) quand une bouffée ou un nuage remplit le cadre
      • flash (4 f) après l'accroche uniquement Les plans dans le même décor sans transition sont automatiquement joints par un glissement de caméra enchaîné centré sur la frontière (makeCamAt ; chain = 18 f, ou un enregistrement par plan entrant dimensionné par le trajet), donc l'échange de décor atterrit en plein mouvement. Ne jamais couper franchement. Une frontière enchaînée dont le trajet serait > ~1100 px ou un virage > 90° reçoit un dissolve à la place.
    • CAMS : clés par plan {f, dur?, dissolve?, s: f => dolly(pos, look, pushK(f, f0, rate, punch?), {fov, roll})}. Règles de caméra (references/studies/camera.md, 12 courts métrages à 30 ips) :
      • Budget d'images : 15-20 % fixes, ~45 % rampantes, ~33 % glissantes (3-30 px/f à 540 de large), ≤3 % rapides.
      • Un nouveau cadrage toutes les ~1,4 s. La plupart sont de petits recadrages : enveloppez les clés comme withReframes(CAMS, ENDS) et chaque longue tenue reçoit un panoramique latéral de 14 f de ±5 % de la distance du sujet toutes les 42 f, en conservant la poussée propre de cette clé. Marquez les tenues fixes délibérées hold : true. Environ 4 mouvements rapides par minute : pic 35-55 px/f (cap 70), 20-34 f.
      • Environ 7 mouvements par 10 s, dont la plupart sont petits et lents (pic ~10 px/f, 80-150 px de trajet). Utilisez withNudges(CAMS, [[shot, baseKeyF, at, dur, ±0.05-0.07], ...]) pour les petits recadrages latéraux dans les longues tenues (ils conservent la poussée de cette clé), puis withReframes remplit le reste. La caméra de l'exemple après ce re-cadrage mesure dans la référence pour chaque classe (fixe 19,5 / rampante 49,9 / glissante 27,1 / rapide 3,5 %, 7,4 mouvements par 10 s ; studies/camera.md).
      • Vérifiez la direction de chaque nudges sur une image fixe. Déplacez-vous vers le bord le plus proche. Si le nudges entre en collision avec un autre dans les 6 f, fusionnez-les en un seul.
      • Le FOV ne change jamais plus d'un point en 12 f (à 30 ips, chaque graduation de 1° est 12-36 f). Commencez à 20-22° pour les gros plans extérieurs (pop de 15-30 f depuis 30°), 28-34° pour la plupart des plans, 40-45° pour les intérieurs exigus. Aucune torsion ($roll$) dans la fenêtre de 90-270° du cadre ; les torsions dehors vont à <0,9°/f en pic.
    • Vérifications du plan de tournage : une fois écrit, exécutez npx tsx src/engine/run_checks.mts <name> (présent dans le projet exemple). Cela vérifie les chevauchements de plans, les clés manquantes, les défauts de marquage chain et les budgets de classes de caméra.

[Le contenu continue... (coupé par l'utilisateur)]

Skills associés