Communitygithub.com

explainer-editor

Transformez un plan fixe vertical (9:16) d'une personne parlant à la caméra en une courte vidéo finie dans le LANGAGE EXPLICATIF Pipecorn, avec le mouvement d'un montage After Effects.

Qu'est-ce que explainer-editor ?

Ce skill transforme un enregistrement brut vertical d'une personne s'adressant à la caméra en une courte vidéo explicative animée dans le 'langage explicatif' propriétaire de Pipecorn. Il place le locuteur dans un cadre arrondi en bas d'une scène sombre éclairée comme un plateau de tournage, tandis que des éléments visuels (scènes, figures, titres) apparaissent au-dessus pour illustrer chaque propos en temps réel. Le rendu final imite le motion design d'After Effects avec des transitions par coup de fouet, des flous de mouvement, des ombres portées, des lueurs colorées, et une animation constante. Le skill s'appuie sur le moteur du skill `short-editor` (pour le rendu, le matting, l'audio) et ajoute ses propres modules de mise en page (`layout.mjs`), de scénographie (`stage.mjs`), de mesure (`measure.mjs`), et de gestion des fonds (`bed.mjs`). Il est conçu pour Claude Code, Cursor, Codex et autres agents IA, et nécessite ffmpeg, Python, ainsi que les polices Inter et Instrument Serif.

Compatible avec✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/ihsaneGTM/gtm-skills/tree/main/plugins/video/skills/explainer-editor

Demander à votre IA préférée

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

Documentation

explainer-editor : une explication mise en scène au-dessus du locuteur

L'utilisateur fournit un plan vertical d'eux-même parlant à la caméra. Ce skill les place dans un cadre en bas d'une scène sombre éclairée comme un plateau, leur tête dépassant du cadre, et dessine ce qu'ils expliquent au-dessus d'eux, au fur et à mesure, avec le mouvement et la lumière d'un montage After Effects : des scènes qu'une caméra parcourt, des figures qui volent, montent et apparaissent avec un flou de mouvement, chacune avec son ombre et sa lueur, un nouvel élément sur la scène chaque seconde environ, un son sur chaque mouvement. Leurs paroles défilent entre la scène et eux, une par une. Quelques fois par minute, un flash de caméra les montre en plein écran.

L'aspect d'une courte vidéo est fixé : § Le langage explicatif (ci-dessous dans le pipeline). Il a été mesuré image par image sur une courte vidéo que l'utilisateur a montée pour un client (108 s, un guide sur les accroches textuelles), puis évalué sur une première version (2026-10-05 : "pas du tout After Effects, pas du motion design, trop peu d'éléments à l'écran, c'est ennuyeux, les 'whoosh' manquent"), puis sur la seconde ("bien mieux ; pas assez de petites ombres et de lueurs derrière les éléments, le sol entièrement noir ne les met pas en valeur ; voici un pack pour beaucoup plus de sons très légers") : chaque ligne des deux verdicts est désormais une règle. Commencez chaque nouveau plan à partir de celle-ci (init.sh la met en place) ; ne la rouvrez pas.

Ce skill fonctionne sur le moteur du skill short-editor. Son rendu, son mixage, son masque de personne, ses aperçus, sa construction et sa vérification sont les fichiers du moteur, tels qu'écrits dans ../short-editor/SKILL.md § Prérequis, § Où se trouvent les choses et § 4 à § 6 ; ce fichier indique ce qui diffère. Les fichiers propres à ce skill : la mise en page (layout.mjs : le cadre du locuteur et les respirations plein écran, exécutée par build.sh et preview.mjs du moteur à la place de leur zoom), la scène (stage.mjs : la caméra, les scènes, le flou de mouvement, les figures, les légendes, les sons du mouvement), le fond (bed.mjs), les images fixes (stills.mjs) et les mesures (measure.mjs). Lire avant la première coupe, à chaque exécution :

  • ../../references/pitfalls.md § Transcription et légendes, § Méthode de travail : les pièges d'un montage sont écrits avec (ses autres sections quand leur étape arrive : § Audio avant un son mesuré à la main, § ffmpeg et § Le shell avant une commande personnelle ; les outils du moteur suivent le reste)
  • ../../references/brand-kit.md, lorsque le montage les montre : les vrais logos, écrans et chiffres de l'utilisateur, jamais inventés, et leur charte graphique définie une fois dans workspace/brand/ (§ Votre charte graphique, définie une fois)
  • $X/example/ : le projet de référence, tous les fichiers d'un montage livré (stage.theme: "light" pour sa version claire) ; $X/example-2/ : le skill exécuté de zéro sur un autre plan (deux plans, un enregistrement calme, pas de respiration), et ce que cette exécution a modifié

Lire lorsque l'étape le nécessite : ../../references/audio-spec.md aux niveaux (la norme de sonie, comment un niveau est mesuré à l'écoute). Les figures du moteur : node plugins/video/skills/short-editor/scripts/api.mjs <module> [figure], jamais leurs sources.

Je ne peux pas regarder la vidéo ni l'écouter. Où se trouve la tête, où commence un mot, à quel point un 'whoosh' est entendu : chacun est une mesure. verify.mjs se tient entre "c'est prêt" et un fichier cassé ; measure.mjs indique si la conception sonore est entendue. Ne les sautez jamais.

Tous les chemins ci-dessous sont relatifs à la racine du dossier GTM by Pipecorn. $X signifie plugins/video/skills/explainer-editor/scripts (ce skill), $E signifie plugins/video/skills/short-editor/scripts (le moteur). Exécutez-les par leur chemin absolu.

Prérequis (vérification préliminaire : à contrôler avant tout travail)

Ceux du moteur : ffmpeg + ffprobe dans le PATH (brew install ffmpeg) et python3 (Outils de développement Xcode) sont requis et ne peuvent pas être installés à partir d'ici ; arrêtez-vous et indiquez la commande si l'un manque. Tout le reste s'approvisionne seul : bootstrap.mjs du moteur (paquets node, venv de reconnaissance vocale, bibliothèque musicale) s'exécute dans init.sh, transcribe.sh et build.sh, et init.sh télécharge les polices : Inter (ExtraBold, Bold, SemiBold, Medium ; licence SIL Open Font, depuis le paquet npm inter-ui via jsDelivr) et Instrument Serif Italic (Google Fonts, OFL) dans le dossier assets/fonts/ du projet. Rien n'est installé à l'échelle du système. swiftc construit le masque de personne : sans lui, la tête ne dépasse pas du cadre (le cadre recadre simplement le locuteur) et la scène est dessinée sur la couche supérieure ; indiquez-le.

Où se trouvent les choses

Comme le dit le moteur, et uniquement de cette façon : un dossier de travail par montage, workspace/projects/<slug>/, un slug qu'aucun autre projet n'a ; le fichier final workspace/videos/<slug>.mp4 ; jamais les fichiers d'un autre projet, même pour le même plan ; les fichiers temporaires dans le dossier tmp/ du projet, jamais dans /tmp. Le dossier scripts/ du skill reste en lecture seule. Les images de l'utilisateur (captures d'écran, logos, images de leurs vidéos) vont dans le dossier assets/ du projet.

Le pipeline

0. Configurer le dossier de travail

$X/init.sh workspace/projects/<slug> <source.mp4> workspace/videos/<slug>.mp4 [--theme light]

Les éléments de base du moteur (project.json lu à partir du fichier, le pack SFX dans assets/sfx-top5/), puis plan.mjs et edl.mjs de ce skill, les clés du langage explicatif dans project.json (style: "explainer", layout : le chemin de $X/layout.mjs, blurBand 0), sfxMasterDb défini sur la voix du plan (sa sonie + 15,3 dB, + 0,13 dB par dB en dessous de −20,5 LUFS : les sons de la maison sont entendus comme dans les skills de base, quel que soit le niveau du plan), les polices, un master 1080x1920 pour un plan portrait plus petit (conservé lors d'une seconde exécution), et le thème (stage.theme : dark, la référence, ou light ; --theme light le définit ; un projet déjà défini conserve le sien). Exécutez chaque commande ultérieure à partir de ce dossier.

0.2. Demander d'abord, en UNE question

Le thème (sombre, la référence, ou clair : la même scène, verre blanc, mots foncés, ombres plus douces), la musique (la bibliothèque, plugins/video/assets/music/ ; Convergence par défaut ; indiquez que les morceaux qui ne sont pas Mixkit peuvent bloquer la monétisation de la vidéo), le rythme (×1 par défaut ; un débit lent se lit mieux à ×1.1), et les images que l'utilisateur peut fournir : captures d'écran de leur produit, images des vidéos dont ils parlent, leur logo, les vrais chiffres. Ce que l'utilisateur ne fournit pas est dessiné avec ses mots et les pictogrammes de la maison, jamais avec des écrans ou chiffres inventés. Exécuté depuis la page GTM by Pipecorn, le briefing du premier message y répond (le thème à partir de ses notes : "light" là signifie le thème clair) : décidez selon les règles ci-dessous et ne demandez pas à nouveau.

Le générique Pipecorn : un BONUS de chaque style, demandé à CHAQUE fois, jamais activé par défaut (plugins/video/references/pipecorn-generic.md) : environ 6 s à la toute fin, Pipecorn, puis ses valeurs se remplaçant dans un seul emplacement, puis Pipecorn à nouveau, sans musique. Non · Oui, avec quelles valeurs (1 à 4 ; node $E/generic.mjs --list ; par défaut couverture téléphonique, taux de connexion, pipeline).

Votre voix améliorée : un BONUS, demandé à CHAQUE fois, jamais activé par défaut (plugins/video/references/voice-clean.md) : l'isolateur vocal d'ElevenLabs supprime l'écho de la pièce et le bruit du plan. Non · Oui, améliorez ma voix. Il nécessite le connecteur ElevenLabs : sans clé, dites en une ligne qu'il existe (Paramètres › Connecteurs › Ajouter une clé) et continuez. En cas de oui, avant l'étape 1 : node plugins/video/motion/voice.mjs clean <source>, puis project.json › source est <…>-voice.<ext> (même durée, image intacte).

1. Transcrire, mot pour mot

$E/transcribe.sh --lang en      # la langue effectivement PARLÉE ; puis project.json "lang"

words.json, sur la durée du plan brut. Jamais traduit. Un plan plein de redémarrages est d'abord assemblé avec rough-cut.mjs du moteur (short-editor/SKILL.md § 0.7), puis retranscrit. Ensuite node $E/words.mjs (celui du moteur) : words-fixed.json, le début de chaque mot déplacé d'un silence vers la voix et sa vraie fin avant une pause, les mots douteux listés ; words.mjs env|end|say pour en lire un (short-editor/SKILL.md § 1). Jamais de script personnel pour cela.

2. Le masque et le cadre

node $E/matte.mjs                          # le masque de personne (nécessite swiftc), ~1 min par minute
node $X/layout.mjs --measure --write       # où se trouve la tête → project.json stage
node $X/layout.mjs --print                 # le cadre, la légende, les respirations

--measure trouve les plans de la prise (ses coupes sources, comme les trouve verify.mjs) et lit la tête sur le masque dans chacun (32 images par plan) : la largeur du cadre place la tête du plan le plus long à la taille de référence (226 px de large ; un plan serré obtient un cadre plus étroit, centré, de sorte que ses épaules et sa poitrine entrent : 598 px dans l'exemple travaillé, dont la tête fait 38 % de la largeur du plan, 782 dans le second plan ; --keep-frame conserve les 942 de référence et prévient que le cadre montrera surtout le visage) ; dans chaque plan, le bord supérieur du cadre passe à 88 px sous le sommet habituel de la tête (la référence), de sorte que la tête dépasse ; la légende monte en fonction de la hauteur habituelle de la tête (au maximum 90 px) et reste 20 px au-dessus ; le plein écran rend la tête à 45 % de la largeur. Un plan de plusieurs prises obtient stage.shots (le recadrage, la légende et le cadre plein de chaque prise ; la caméra bascule sur la coupe, le cadre reste). Vérifiez-le sur un aperçu (§ 5). Dans ce style, une coupe source se produit à l'intérieur du cadre du locuteur, une petite partie de l'image : verify.mjs peut la signaler "sous un plan plein écran" (le second plan) ; vérifiez qu'elle atterrit sur son cadre par les propres différences du cadre, pas à l'œil nu.

3. Lire la transcription, écrire le storyboard

C'est l'étape de jugement, et c'est tout le travail. Lisez la transcription du début à la fin et écrivez le storyboard comme une liste avant tout code : les scènes, et dans chacune, ce qui apparaît sur quel mot.

  • Scènes, reliées par des mouvements de caméra. Une scène est une idée (la promesse, le produit, un processus, les étapes, la liste, une comparaison) : 4 à 8 secondes, puis la caméra passe à la suivante. Le mouvement par défaut est le coup de fouet (un panoramique vers la droite : l'ancienne scène part à gauche dans un flou, une traînée lumineuse traverse, la nouvelle arrive) ; une montée lorsque l'idée suivante approfondit (l'ancienne scène monte) ; une poussée à travers l'ancienne scène lorsque la nouvelle y répond (un "pourquoi", une révélation) ; une coupe uniquement derrière une respiration. Jamais deux du même à la suite si possible.

  • Une scène arrive composée. Ce qui est placé au moment de la scène voyage AVEC la caméra (c'est déjà là à la fin du mouvement : la référence ne montre jamais une scène vide après un mouvement) ; ce qui vient plus tard entre sur son mot. Lorsque les choses de la scène sont nommées l'une après l'autre, placez-les toutes au moment de la scène, dans l'obscurité ou floues (dim: 0.6, blur: 10), et éclairez chacune sur son mot (.blurTo(on(i), 0).lit(on(i)) et son son) : la scène est pleine dès la première image et bouge encore sur chaque mot (les personnages et chaînes du second plan, 2026-10-05).

  • Quelque chose de nouveau chaque seconde environ. Chaque phrase qui nomme une chose, un nombre, une étape, une affirmation reçoit une figure ou un mouvement sur son mot : une figure qui entre, une étiquette révélée, une marque tracée autour de quelque chose, une chose éclairée, une scène qui bouge. Plus de 2 secondes sans rien de nouveau sur la scène est ennuyeux : c'était le verdict sur le premier montage (2026-10-05).

  • Le titre nomme la section en deux courtes lignes, son mot clé en empattement (*Killer* Text Hooks), une boîte rouge sur la ligne avec un compte ou une affirmation (3 Winning Types Of). Il change avec la section, l'ancien montant avant que les nouveaux mots ne montent.

  • Quelle figure pour quoi :

    ce qui est ditla figure
    une liste de N choses, étapes, règlesS.list : barres arrivant de la gauche, étiquettes floues jusqu'à ce que chacune soit dite (reveal), celle expliquée éclairée (focus), son verdict apparaissant à sa fin (glyph: "check", "cross"…) ; header transforme une barre en en-tête de section
    un nom, un terme, une définitionS.pill (un pictogramme dedans : glyph), S.arrow depuis ce qu'il nomme, S.ping (ring: true) autour de la chose, S.mark (un cercle, un cadre, un soulignement) dessiné sur le mot qui le souligne
    une chose composée de parties, une cause et ses effets, une chaîneS.tree (enfants tombant, chacun câblé avec une étincelle), S.wires entre deux
    une combinaison, une comparaisonS.equation (+, =), un signe VS avec S.shake et le glitch
    un produit, un outil, une plateformele logo de l'utilisateur (S.icon, sa lueur, ring pour faire sonner un téléphone), leur capture d'écran dans S.card ou S.phone, S.prompt tapé quand il est utilisé
    des exemples, des vidéos, une sérieS.cards de leurs images, ou des images du plan lui-même (stills.mjs) avec des cartes player
    une recherche, de nombreuses sources, une fouleune grille de S.cards avec des glyphs, éclairées l'une après l'autre (un scan)
    un nombreS.count montant jusqu'à lui, ou des mots colorés ({g:22 Days} vert, {r:A Few Weeks} rouge)
    bon / mauvais, oui / nonS.glyph (check sur une tuile verte, cross sur une rouge), le verdict d'une barre
    un appel à l'actionun titre (Comment "X", To Get The *Skill*), S.file pour ce qu'ils envoient
  • Les respirations (FULL) : une coupe franche vers le locuteur en plein écran (le flash de la caméra à l'arrivée, un whoosh au départ), rien de dessiné sauf les légendes. Sur une confidence, une chute, une opinion forte ; 2 à 6 s ; jamais dans les 15 premières secondes. Un plan qui n'est pas la tête parlante (b-roll, un plan large) passe en plein écran entier : [from, to, { zoom: 1 }]. La scène après une respiration s'ouvre derrière elle (S.scene(<fin de respiration> - 0.45, "push")), donc elle est là à la fin de la respiration.

  • Noms réels et chiffres réels uniquement (brand-kit.md) : une figure qui nécessiterait un écran ou un nombre que l'utilisateur n'a pas fourni est dessinée avec ses mots et les pictogrammes de la maison, ou supprimée.

  • Les légendes sont mot pour mot

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

Skills associés