Communitygithub.com

tareqmm535-crypto/cartoon-audio-short

Réalisez un court métrage animé vertical en arabe ou en anglais. Propose 10 idées, écrit le script, puis transforme la voix de l'utilisateur en un MP4 final avec musique douce et effets sonores sous la voix. Utilisez-le pour toute demande de court métrage animé ou d'histoire animée, y compris les demandes en arabe comme فيديو كرتون، قصة متحركة، أنميشن، شورتس.

Qu'est-ce que cartoon-audio-short ?

Cette compétence vous permet de créer un court métrage animé vertical au format 1080×1920, 30 images par seconde, à partir d'une idée, d'un script et d'une voix off. Elle est spécialement conçue pour les agents IA comme Claude Code, Cursor ou Codex, et prend en charge l'anglais et l'arabe, y compris les dialectes. La compétence génère d'abord 10 idées originales, écrit un script en cinq parties (accroche, contexte, escalade, pivot, rebondissement), puis produit la vidéo complète en MP4 avec un style cartoon 2D plat (personnages bean-head), un monde 3D coloré, et des niveaux audio optimisés : la musique est placée 16 dB sous la voix, les effets sonores à 50 % du volume vocal. Le processus utilise un kit de code contenant un moteur Three.js, des outils Python pour le timing et le mixage, et des polices arabes (Lalezar). L'agent gère tout le flux de travail, de l'idée au rendu final, avec une check-list de tâches et une planification automatique des scènes.

Compatible avec✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/tareqmm535-crypto/cartoon-short-kit/tree/HEAD

Demander à votre IA préférée

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

Documentation

Court métrage animé : idée → script → voix off → MP4 final

Le style : personnages cartoon 2D plats, tête en forme de haricot, dessinés comme des "cartes" sur toile avec contours prune, dans un monde 3D coloré avec contours noirs à l'encre, textures peintes, profondeur de champ et caméras glissantes. Le résultat est en 1080×1920, 30 images/s, exactement de la même durée que la voix off. La voix de l'utilisateur est inchangée. La musique de fond et les effets sonores sont synthétisés : musique 16 dB sous la voix, effets sonores à 50 % du niveau vocal ou moins. Testé sur "Le soldat qui n'est jamais parti" (19,7 s, 8 plans).

Si cette compétence arrive sous forme de fichiers dans le chat

L'utilisateur peut envoyer SKILL.md et cartoon-short-kit.zip et dire quelque chose comme "lis cette compétence, installe-la et utilise-la" (اقرأ هذه المهارة، وثبّتها، واستخدمها). Ensuite :

  1. Lisez tout ce fichier et suivez-le. N'expliquez pas ce qu'est une compétence et ne posez pas de questions de configuration.
  2. Dézippez le kit dans un dossier inscriptible (voir 4.0). Vérifiez que engine/main.js et vendor/three.module.js sont présents.
  3. Si cet environnement possède un dossier personnel de compétences (par exemple ~/.claude/skills/), copiez SKILL.md et le kit dans cartoon-audio-short/ à cet endroit. S'il n'en a pas, ne dites pas qu'il est installé de manière permanente : dites en une ligne qu'il est prêt pour ce chat et que les deux fichiers devront être renvoyés dans un nouveau chat.
  4. Répondez en une courte ligne et passez directement à l'Étape 1.

Langue : arabe ou anglais

  • Chat : répondez dans la langue des messages de l'utilisateur dès la première réponse. S'ils écrivent en arabe ou demandent l'arabe, chaque message est en arabe : questions, libellés et descriptions des options, liste des tâches, idées, notes de progression, erreurs et note de livraison. Utilisez des mots simples et quotidiens, et adaptez-vous à leur dialecte s'ils écrivent dans un dialecte. L'anglais reste uniquement pour les noms de fichiers et les commandes, sur leur propre ligne pour que le texte de droite à gauche ne les perturbe pas.
  • Script : la langue du script suit celle du chat, sauf si l'utilisateur demande autrement. "أريد أفكار بالعربي" tapé à n'importe quelle question signifie Étape 2, en arabe.
  • Variété d'arabe : écrivez en arabe standard simple, sauf s'ils écrivent ou demandent un dialecte (irakien, égyptien, du Golfe, levantin, etc.). Ne vous arrêtez pas pour demander. Terminez la réponse du script par une ligne : "تريده بلهجة ثانية؟ اكتب اللهجة وسأعيد كتابته." Ne mélangez jamais le standard et le dialecte dans un même script, sauf s'ils le demandent.
  • Questions fixes en arabe. Utilisez ce libellé :
    • "من أين نبدأ؟"
      • "الصوت جاهز" : téléchargez le fichier audio, avec le texte s'il existe, et je ferai la vidéo.
      • "عندي نص" : je l'améliorerai et vous donnerai des conseils d'enregistrement, puis je ferai la vidéo après le téléchargement du son.
      • "أحتاج إلى أفكار ونص" : je proposerai dix idées originales, puis j'écrirai le script pour l'idée que vous choisirez.
    • "كم مدة الفيديو؟"
      • "من 20 إلى 30 ثانية (مُوصى به)" : environ 40 à 60 mots.
      • "من 30 إلى 45 ثانية" : environ 60 à 90 mots.
      • "من 45 إلى 60 ثانية" : environ 90 à 120 mots.

Règles

  • Les histoires, les personnages et les plans sont toujours originaux. Ne recréez jamais la vidéo d'un autre créateur plan par plan. Proposez plutôt une version originale de la même idée.
  • Pas de personnes réelles, nommées et vivantes comme personnages, et pas de mascottes de marque ou de logos.
  • Pas de sous-titres sauf si l'utilisateur le demande. Le texte diégétique (un message gravé, un panneau) est acceptable, et il doit être lisible (non inversé). Les panneaux, les étiquettes et les titres utilisent la langue du script : une vidéo en arabe aura "بِيعَ", pas "SOLD". Dessinez-les comme en 4.3.
  • Ne modifiez jamais et ne recalculez jamais le rythme de la voix. L'image est synchronisée sur elle, et chaque réaction visuelle arrive 0 à 3 images avant le mot correspondant.
  • Niveaux audio : la musique de fond se trouve à 16 dB sous la voix (RMS avec porte), de sorte que la narration reste claire. Les effets sonores sont à 50 % ou légèrement moins, avec des pics limités pour qu'aucun coup ne dépasse la narration. Mélangez toujours avec mix.py, jamais à la main. N'utilisez pas de ducking ou de compression qui modifierait ce rapport ; un seul gain linéaire plus un limiteur de crête s'applique à l'ensemble du mix.
  • Tenez l'utilisateur informé avec une liste de tâches. Envoyez une planche contact d'images avant le rendu long.

Étape 1 : Accueil (toujours en premier)

Si un fichier audio est déjà attaché, passez à l'Étape 4. Si un script a également été donné, utilisez-le pour le minutage. Sinon, demandez une AskUserQuestion (ou du texte brut si cet outil est manquant) : "D'où partez-vous ?"

  • La voix off est prête : demandez-leur de la télécharger, ainsi que le texte du script s'ils l'ont (le script rend le minutage exact). Passez à l'Étape 4 à son arrivée.
  • J'ai un script, besoin de la voix off : resserrez le script selon l'Étape 3 si nécessaire, renvoyez-le avec des conseils d'enregistrement, demandez le téléchargement, puis passez à l'Étape 4.
  • J'ai besoin d'idées de vidéo et d'un script : passez à l'Étape 2. Demandez également la durée cible s'ils ne l'ont pas précisée. La valeur par défaut est 20-30 s ; 45-60 s est autorisé. Dans un chat en arabe, utilisez le libellé sous Langue.

Étape 2 : 10 idées de vidéo

Donnez exactement 10 idées en une seule réponse, numérotées, et demandez à l'utilisateur de répondre avec un numéro (ou "plus"). Chaque idée comprend :

  • Titre (5-8 mots, suscitant la curiosité, par exemple "Le soldat qui n'est jamais parti").
  • Phrase d'accroche : la première phrase parlée, un paradoxe énoncé comme un fait ("Un homme a vendu la Tour Eiffel. Deux fois.").
  • Le rebondissement en une ligne (le dénouement ironique qui termine la vidéo).
  • Pourquoi ça s'anime bien : les 2-3 grands moments visuels (un effondrement, une révélation, une poursuite).
  • Vrai ou légende : dites clairement s'il s'agit d'histoire documentée, d'un récit contesté ou de folklore.

Ce qui rend une idée "parfaite" pour ce format :

  • Une histoire surprenante avec une cause et un effet physiques que l'on peut montrer.
  • Un personnage clair de tous les jours, des enjeux qui montent en puissance, et un rebondissement dans la dernière ligne.
  • Un décor qui peut être construit à partir de formes 3D simples plus des cartes de dessin animé (villes, ponts, navires, châteaux, déserts, laboratoires, palais).
  • Mélangez les 10 idées à travers les époques et les thèmes : antique, médiéval, années 1800, moderne, science, animaux, inventions, catastrophes, lois étranges, accidents chanceux.
  • Pour tout ce qui est présenté comme vrai, vérifiez les faits clés avec une recherche web avant de le proposer. Ne présentez pas une légende virale comme un fait. Si l'utilisateur la veut quand même, présentez-la comme "la légende dit".
  • Pas de personnes réelles vivantes comme objet de plaisanterie, rien de graphique et rien de politique.

Pour les idées en arabe :

  • Écrivez le titre, l'accroche, le rebondissement et les notes en arabe. Écrivez l'accroche comme une phrase arabe naturelle, pas comme une traduction. Donnez aux noms étrangers leur orthographe arabe habituelle.
  • Mélangez des histoires de l'histoire arabe et islamique et de la science avec des histoires mondiales, afin que la liste semble faite pour ce public.
  • Recherchez en arabe ainsi qu'en anglais. Les histoires arabes populaires se propagent également sans sources, alors étiquetez-les avec Vrai ou légende de la même manière.
  • Ne montrez jamais les prophètes, leurs compagnons ou d'autres figures sacrées comme personnages. Ne plaisantez pas sur la religion, les sectes, les tribus ou les nationalités.

Étape 3 : Script (après leur choix)

Écrivez uniquement la narration (pas d'indications scéniques dans le texte parlé). L'anglais est dimensionné à environ 3,7 mots/s : 20 s ≈ 75 mots, 30 s ≈ 110, 60 s ≈ 220. L'arabe est plus lent, environ 2 mots/s : 20 s ≈ 40 mots, 30 s ≈ 60, 60 s ≈ 120. Les mots arabes portent plus de syllabes, et les voix arabes réelles mesurées font 1,6 à 2,1 mots/s. Formule :

  1. Accroche (phrase 1, sans mise en contexte) : le fait absurde.
  2. Contexte en 1-2 lignes : quand, où, qui, un détail concret.
  3. Escalade, 2-4 temps, chacun plus grand. Les autres doutent ou se moquent. Utilisez une blague d'exagération.
  4. Mystère ou pivot : "Mais quand..." / "Vous voyez," introduit le mécanisme réel, souvent avec une analogie quotidienne.
  5. Rebondissement / dénouement : court, ironique, et les derniers mots de la vidéo. Utilisez l'anglais parlé simple, des contractions, des phrases d'environ 8 à 15 mots, et les nombres écrits en toutes lettres. Ne décrivez jamais ce que le spectateur voit déjà.

Pour un script en arabe :

  • Gardez les phrases à environ 6-12 mots, et utilisez la même formule en cinq parties. Les pivots comme "لكن عندما…" et "والسبب؟" fonctionnent bien.
  • Écrivez les chiffres et les années en toutes lettres (ألف وتسعمئة وأربعة وتسعون), et épelez les mots étrangers et les noms de marques en lettres arabes, afin que la voix les lise correctement.
  • Ponctuez pour la voix : "،" et "." pour les respirations, "…" pour une pause avant une révélation, et "؟" pour les questions. Le minutage utilise également cette ponctuation.
  • Donnez un bloc vocal copiable prêt à être collé dans le générateur de voix :
    • Tashkeel sur chaque mot, ce qui aide surtout pour les noms et les mots ayant plus d'une lecture. Laissez de côté les terminaisons de cas qu'un narrateur ne dirait pas, et écrivez le dialecte tel qu'il est parlé. S'ils demandent sans tashkeel, ou si cela sonne faux, supprimez-le.
    • Balises audio pour Eleven v3 en anglais, telles que [excité], [curieux], [sérieux], [murmure], [chaleureusement]. Utilisez-en un ou deux par groupe de phrases au maximum, uniquement là où les mots les justifient.
    • "g" irakien : écrivez گ et چ là où le son parlé en a besoin (تِگْدَر, لْگِيت), car ك se lit comme "k".
    • Parties : pour un script de plus d'environ 700 caractères, divisez-le en parties numérotées à la fin des phrases.
  • Le nombre de mots et la durée utilisent le taux arabe ci-dessus, les balises et le tashkeel étant ignorés.

Répondez ensuite avec :

  • Le script dans un bloc copiable, avec le nombre de mots et la durée estimée.
  • Un plan visuel d'un paragraphe (les plans que vous allez animer).
  • Des conseils d'enregistrement : une voix de narrateur stable et chaleureuse ; ElevenLabs fonctionne bien (une voix de narrateur grave, vitesse environ 1,05-1,1, stabilité environ 45-55 %). Mp3 ou wav convient. Laissez des pauses naturelles à la fin des phrases. Exportez sans musique.
  • Conseils d'enregistrement en arabe : utilisez Eleven v3, car les anciens modèles lisent les [balises] à haute voix. Commencez avec Stabilité sur Naturel et vitesse environ 0,95, et essayez les premières phrases avant de générer l'ensemble. Avec un autre générateur, supprimez d'abord les balises. Leur propre voix fonctionne aussi, sans les balises ni le tashkeel.
  • La demande : "Téléchargez la voix off quand elle est prête et je ferai la vidéo complète." Gardez le texte final du script. Il pilote le minutage à l'Étape 4, donc aucune reconnaissance vocale n'est nécessaire. S'ils ont enregistré une version modifiée, demandez le texte final.

Étape 4 : Construire la vidéo (après le téléchargement de la voix off)

Faites tout à partir d'ici sans vous arrêter. Ne demandez que si le minutage ne peut pas être résolu.

4.0 Obtenir le kit

Le kit de code contient le moteur, les outils, un exemple fonctionnel, Three.js r160 vendu, la bibliothèque toon.ts Pen de github.com/mromidev/claude-animated-shorts (tous deux MIT) et la police arabe Lalezar (SIL OFL). Trouvez-le dans cet ordre et traitez-le en lecture seule :

  1. Un dossier kit/ à côté de ce SKILL.md, trouvé avec find / -name SKILL.md -path "*cartoon-audio-short*" 2>/dev/null.
  2. Un dossier cartoon-short-kit déjà dézippé.
  3. cartoon-short-kit.zip parmi les fichiers envoyés dans ce chat : find / -name "cartoon-short-kit*.zip" 2>/dev/null, puis dézippez-le dans ~/cartoon-short-kit-src/. Le kit est le dossier à l'intérieur qui contient engine/.

Exécutez ensuite bash <kit>/tools/setup.sh ~/shorts/<slug>. Il copie le moteur et les outils dans le projet, installe le Three.js vendu, supprime les types de toon.ts avec Node 22 module.stripTypeScriptTypes, et lie Playwright. Aucun réseau n'est nécessaire. Si les fichiers vendus sont manquants, il revient à npm ou à un clone git.

  • Prérequis : Node 22.6+, Python 3 avec numpy + Pillow, ffmpeg, et Playwright avec Chromium (npm i -g playwright && npx playwright install chromium si manquant).
  • Si les registres de paquets sont bloqués, git via GitHub fonctionne généralement. Ne désactivez jamais TLS et ne contournez pas le proxy.
  • Chromium : utilisez le navigateur Playwright pré-installé avec --use-angle=swiftshader --enable-unsafe-swiftshader --ignore-gpu-blocklist. Cela donne WebGL CPU à environ 3-10 s par image.

4.1 Minutage

Exécutez python3 timing.py voice.mp3 script.txt --out work. Ajoutez --lang ar pour l'arabe s'il n'y a pas de script. Le script peut être le bloc vocal exact : il supprime les [balises] et le tashkeel, et il divise également les phrases à la ponctuation arabe.

  • Avec whisper ou faster-whisper installé, il utilise les horodatages des mots. Pour l'arabe, il utilise un modèle multilingue, et il conserve les propres mots du script, de sorte qu'un mot dialectal mal entendu ne peut pas changer le texte.
  • Sinon, il aligne les phrases du script (divisées à la ponctuation) sur les segments de parole détectés par silence, avec une DP qui fait correspondre les syllabes à la durée et pénalise les fins de phrase à l'intérieur d'un segment et les longs silences à l'intérieur d'une phrase.
  • Sans ASR et sans script, demandez le script. Claude ne peut pas entendre l'audio.
  • Vérifiez work/phrases.json : les pauses doivent tomber à la fin des phrases. Images totales = round(duration × 30).

4.2 Plan des plans (work/PLAN.md avant le code)

Faites une ligne par plan : images, mots, décor, lumière, mouvement de caméra, personnages/poses/expressions, effets et repère d'effet sonore.

  • L'image 0 est déjà l'image d'accroche.
  • En général, un plan par phrase. Fusionnez les très petites phrases dans le plan suivant.
  • Illustrez chaque phrase littéralement. Les accessoires portent les blagues.
  • Variez les tailles de plan : accroche plan moyen serré → plan large de révélation → plan deux → plan rapproché d'insert sur l'objet clé → plan rapproché de réaction → mouvement d'environnement pour le dénouement.
  • Utilisez la lumière pour les temps : jour pour le normal, doré pour le déclin ou le drame, bleu nuit pour l'explication. Un saut dans le temps obtient un flash blanc de 6 images.
  • La ligne de rebondissement reçoit une piqûre (la musique s'arrête, coup bas, zoom avant avec roulis). Le dénouement physique du dernier plan atterrit sur le dernier mot.

4.3 Monde (web/main.js)

Gardez les sections du moteur : matériaux toon, contrat d'encre, add/tbox, ciel, lumières, cartes, cibles de rendu/post, applyLight, drawActors, swapForNd, renderFrame. Remplacez le monde d'exemple entre // ---------- world ---------- et // ---------- cards ----------, plus les parties histoire de worldState().

  • Construisez à partir de primitives avec des textures peintes sur toile (paint.js : planches, poutres, bois pourri, pierre, mousse/lierre, herbe, terre, plâtre, tuiles de toit, marbre, banderoles, texte gravé). Écrivez de nouveaux peintres dans le même style plat avec des joints sombres.
  • Utilisez tbox pour une densité de texels constante, un dégradé toon en 2 étapes, et brouillard = couleur de l'horizon.
  • Arrière-plan : collines (sphères à demi enterrées), montagnes (cônes + calottes enneigées), cyprès/pins, maisons lointaines, panneaux publicitaires de nuages peints.
  • Les éléments de décor (effondrements, chutes, portes) sont des groupes pivotés pilotés par une progression 0..1 à partir de worldAt(f), avec des parties assouplies et décalées.
  • Le texte diégétique incurvé utilise des UV plans. Vérifiez qu'il n'est pas inversé.
  • Texte arabe sur quoi que ce soit : utilisez P.signCanvas(text, opts) avec P.tex() pour les panneaux et les étiquettes, P.drawText() sur votre propre toile, ou P.carvedText() pour la gravure. Ils chargent la police incluse, définissent la direction de droite à gauche et dessinent des chaînes entières. Ne dessinez jamais l'arabe lettre par lettre, car cela inverserait l'ordre des lettres et rendrait la lecture impossible.

4.4 Cartes de personnages (web/main.js, section drawActors)

Les cartes sont des canevas hors écran (300×300 ou moins) avec l'image finale peinte, exprimant exactement l'expression du plan. Utilisez P.characterSheet(parts, poses) pour les ensembles d'expressions réutilisables. Les personnages sont :

  • Une tête de haricot (ovale arrondi, pas de cou) avec de grands yeux expressifs, une bouche en 5 formes (sourire, neutre, bouche ouverte, triste, cercle de surprise), et des sourcils.
  • Un corps en bois (forme de base en T ou en rectangle, articulé aux épaules et aux hanches).
  • Des accessoires facultatifs (chapeaux, outils, ailes) attachés en tant que canevas séparés.

Pour l'arabe, les yeux regardent de gauche à droite lorsqu'ils lisent, et les panneaux dans la scène sont dessinés en RTL.

4.5 Rendu (bash <kit>/tools/render.sh work)

render.sh lit PLAN.md, phrases.json et les fichiers source. Il lance Playwright Chromium pour capturer chaque image en tant que PNG, en utilisant la pile WebGL CPU. Après le rendu, exécutez python3 <kit>/tools/encode.py work pour le MP4 final, et python3 <kit>/tools/mix.py work/video.mp4 voice.mp3 music.mp3 SFX/ pour l'audio. music.mp3 est une boucle générée par python3 <kit>/tools/music.py --duration <s> --out music.mp3 avec des paramètres par défaut (piano discret + cordes ambiantes).

  • Pour une boucle plus courte que la voix off, répétez-la. Coupez la queue à la dernière image.
  • mix.py mélange tout (voix, musique, SFX) avec les niveaux exacts de la règle Audio. Le volume de la musique est un gain linéaire constant qui le place 16 dB sous le RMS de la voix ; aucun ducking. Les SFX sont réduits à 50 %, avec un limiteur de crête à -6 dBFS pour attraper les pics. Vérifiez avec --dry-run.
  • Les SFX sont synthétisés : python3 <kit>/tools/sfx.py --type <type> --out SFX/implosion.wav (types : implosion, explosion, quiosh, coup, grincement, impact, mécanisme, chuchotement, ding). La hauteur et la durée sont définies par la carte de plan.
  • Encodez avec ffmpeg -y -i video.mp4 -i audio.wav -c:v libx264 -crf 18 -preset slow -c:a aac -b:a 192k output.mp4. Optimisez le niveau de la vidéo (0-255, pas de TV).

Étape 5 : Nettoyage et livraison

  1. Supprimez les fichiers temporaires : rm -rf work/frames/.
  2. Vérifiez output.mp4 (taille, durée, pas d'artefacts). Si la vidéo dure plus de 5 minutes, demandez avant d'envoyer.
  3. Envoyez le MP4 d'une manière que l'utilisateur peut télécharger (outil d'envoi de fichier, lien, etc.).
  4. Ajoutez une note finale avec un résumé d'une ligne en bas.

Dépannage

  • Le rendu échoue au plan N : exécutez node web/main.js --frame N-5 pour déboguer visuellement. Vérifiez PLAN.md pour des valeurs manquantes.
  • L'audio est désynchronisé : exécutez python3 timing.py --recheck voice.mp3 script.txt. La ligne "Total frames = X" doit correspondre à la durée réelle de la voix off. Ajustez manuellement les phrases dans work/phrases.json et réexécutez render.sh avec --skip-timing.
  • La police arabe ne s'affiche pas : vérifiez que Lalezar-Regular.ttf se trouve dans le kit fonts/ et est chargé au début de web/main.js. Le rendu texte nécessite CanvasRenderingContext2D.direction = "rtl".
  • Le rendu WebGL est lent : réduisez renderTarget à une taille plus petite temporairement pour les tests, puis remettez-la à 1080×1920 pour le rendu final.
  • Capture d'écran vide dans Playwright : vérifiez que --use-angle=swiftshader est passé et que le navigateur a headless: true. Essayez page.screenshot({fullPage: true}) après un délai pour le rendu du premier coup.

Guide de référence rapide

ÉtapeActionCommande/Sortie
1AccueilDemander le point de départ
210 idées de vidéoListe numérotée
3Script + plan visuelBloc copiable
4.0Configurer le kitsetup.sh ~/shorts/<slug>
4.1Minutagetiming.py voice.mp3 script.txt → work/phrases.json
4.2Plan des planswork/PLAN.md
4.3Construire le mondeModifier web/main.js
4.4Cartes de personnagesdrawActors dans web/main.js
4.5Rendurender.sh work → encode.py → mix.py
5LivrerEnvoyer le MP4 + note

Ce fichier décrit la compétence entière. Lisez-le en entier avant de commencer n'importe quelle étape. Ne demandez pas à l'utilisateur ce qu'est chaque étape ; commencez à l'Étape 1 et suivez le flux.

Skills associés