Communitygithub.com

raycfu/effects

Ajoutez n'importe lequel des 51 effets vidéo à une vidéo de personne qui parle (orbit, projecteur, widgets en verre, timeline, liste de contrôle, mur de titres, boîte de commentaires, éventail de téléphones, graphique en verre liquide, match-cut, interrupteurs iPhone, panneau LED, zoom par-dessus l'épaule, pop-ups iMessage, placement en grille et plus encore). Les effets suivent le visage de l'orateur et peuvent se placer derrière sa tête. À utiliser lorsque l'utilisateur tape /effects, nomme un des effets, ou demande d'ajouter un effet, un zoom, un grade, un sticker ou une animation à sa vidéo.

Qu'est-ce que effects ?

Ce skill permet à un agent AI, tel que Claude Code, d'ajouter 51 effets visuels professionnels à une vidéo de type « talking head ». L'agent prend en charge l'ensemble du flux : configuration de l'environnement (FFmpeg, Python 3.12), analyse de la vidéo pour détecter les mots prononcés, création d'un plan d'effets au format JSON, vérification rapide des images clés et rendu final de la vidéo. Les effets incluent des animations autour de la tête (orbit, carrousel), des cartes et widgets graphiques (comment-box, glass-widgets), des transitions (lean-in, slow-push), des habillages éditoriaux (cover-star, match-cut) et bien d'autres. Le skill garantit que les effets ne cachent jamais le visage et gère automatiquement le détourage de la personne via MediaPipe ou Robust Video Matting. Les performances sont optimisées : rendu en 1080p par défaut, option 4K, et vérification des images avant le rendu final pour valider l'emplacement et la lisibilité des textes.

Compatible avec✓Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/raycfu/claude_design_skills/tree/HEAD/effects

Demander à votre IA préférée

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

Documentation

Effets : 51 effets vidéo (par Ray, @raycfu)

L'utilisateur n'est généralement pas technique. Restez bref et amical, faites le travail à sa place, et ne lui demandez jamais d'exécuter des commandes lui-même.

Tous les chemins ci-dessous sont relatifs au dossier de ce skill (le dossier où se trouve ce SKILL.md). Utilisez son chemin absolu dans les commandes.

1. Première exécution : configuration (une fois)

Exécutez bash scripts/setup.sh. Il affiche READY lorsque c'est terminé (la première fois prend 1 à 3 minutes).

  • NEED_FFMPEG : installez-le pour eux. Sur Mac : brew install ffmpeg (si brew est manquant, dites-leur d'installer Homebrew depuis brew.sh d'abord). Sur Windows : winget install ffmpeg.
  • NEED_PYTHON : installez Python 3.12 (Mac : brew install [email protected], Windows : winget install Python.Python.3.12), puis réexécutez setup.
  • Sur Windows, le Python se trouve dans .venv\Scripts\python.exe au lieu de .venv/bin/python.
  • Windows sans bash : exécutez py -3.12 -m venv .venv, puis .venv\Scripts\python.exe -m pip install -r requirements.txt. Découpe optionnelle plus propre : téléchargez https://github.com/PeterL1n/RobustVideoMatting/releases/download/v1.0.0/rvm_mobilenetv3_fp32.onnx dans models/.
  • NEED_PYTHON_312 : leur Python par défaut n'a pas pu installer les paquets. Installez Python 3.12 comme ci-dessus et réexécutez setup.
  • Les lignes de log inoffensives de TensorFlow Lite, MediaPipe ou OpenCV (INFO:, WARNING:, W0000, [ WARN) sont normales. Seules Done: ou saved signifient un succès.

2. Obtenir la vidéo et l'effet

  • Vidéo : l'utilisateur glisse le fichier dans le chat, ou donne un chemin. Une vidéo verticale de téléphone fonctionne le mieux.
  • Effet : depuis /effects <nom>, ou d'après ce qu'il décrit. Faites correspondre ses mots au tableau ci-dessous. Incertain ? Montrez-lui la liste.
  • Son nom et son pseudo : les effets qui affichent un profil (glass-widgets, comment-box, pastel-word, profile-wall, headline-wall et autres) utilisent par défaut Ray / @raycfu. Demandez les leurs une fois et passez name et handle à chaque effet.

3. Trouver le timing

  • S'ils disent « sur le mot X » ou « quand je dis ... », exécutez .venv/bin/python scripts/words.py <video> et utilisez ces temps.
  • S'ils ne donnent pas de timing, appliquez l'effet sur tout le clip, ou demandez quelle partie (une question courte).
  • Les fenêtres courtes sont les plus belles : 1,5 à 4 secondes par effet.

4. Ébauche, vérification, rendu

  1. Écrivez le plan à côté de leur vidéo sous <video-name>_effects.json :
    {"effects": [
      {"fx": "orbit", "start": 3.2, "end": 6.0},
      {"fx": "backdrop-word", "start": 14.0, "end": 16.3, "text": "CLAUDE"}
    ]}
    
  2. Vérifiez d'abord les images (rapide) : .venv/bin/python scripts/fx.py --plan <plan.json> <video> <folder>/check.png --still 4.5,15.2, en utilisant le milieu de chaque effet. Examinez les PNG vous-même. Corrigez le texte, le timing ou les options si quelque chose ne va pas (couvre le visage, coupé par le bord, illisible).
  3. Rendu : .venv/bin/python scripts/fx.py --plan <plan.json> <video> <video-name>_effects.mp4. La sortie conserve leur audio original. Le rendu se fait en 1080p par défaut ; ajoutez --width 2160 pour la 4K (plus lent).
  4. Dites-leur où se trouve le fichier. Rappelez-leur en une ligne de le regarder avant de le publier : c'est une ébauche, ils approuvent.

Un seul effet n'a pas besoin de plan : .venv/bin/python scripts/fx.py orbit <video> <out.mp4> --start 3 --end 6 --text "..." --opt key=value.

Les 51 effets

#Nom fxCe qu'il faitOptions (toutes optionnelles)
1noiseDes reels s'empilent derrière votre tête, un toutes les quarts de secondeimages (dossier de captures ou clips), size
2lineupDes tuiles numérotées se déploient en arc au-dessus de votre têtetext (noms des tuiles séparés par |)
3locked-onDes coins d'encadrement s'accrochent à votre visage, la caméra vous suitzoom (défaut 1.35), text (tag)
4orbitVos reels tournent autour de votre tête : devant en bas, derrière en hautimages, count, speed, size
5lean-inUn zoom rapide sur un motzoom (défaut 1.45, max 2), speed
6backdrop-wordUn mot géant tombe derrière voustext, color (hex), font (bold ou serif)
7spotlightÉteint les lumières, vous garde éclairétext (mot lumineux derrière vous), color, push
8the-billImprime vos instructions comme un ticket de caisse dans le mur au-dessus de votre têtetext (lignes séparées par |)
9moodyUn grade de couleur d'ambiancegrade (moody, bw, warm, cool, pop)
10swipeUn curseur avant/après balaye sur vousgrade (l'aspect « après »)
11todoUne carte de liste de contrôle à côté de votre tête coche au fur et à mesure que vous parleztext (éléments avec |), ticks (secondes vidéo avec |), title
12comment-boxUne barre de commentaire Instagram tape un mot et le publietext (défaut EFFECTS)
13tapUn bouton Follow apparaît et bascule en Followingat (seconde vidéo du basculement), x, y (0 à 1), color
14pause-pointFige l'image et vous pointe du doigt avec une flèche dessinée à la maintext (label), color, label_x
15uninstallUne barre de désinstallation glitchée brise le cadretext
16reel-frameVotre vidéo rétrécit dans une carte de reel Instagramtext (pseudo)
17shortcut-rainDes touches de clavier pleuvent derrière voustext (touches avec |), count
18reject-stampUn gros tampon rouge s'abat sur l'écrantext, color, angle, y
19countdown-flipUne horloge à retournement 3, 2, 1 au-dessus de votre têtefrom
20rabbit-holeLe cadre s'encastre en tunnel, en tournantratio, speed, spin
21cover-starVous devenez une couverture de magazine, titre derrière votre têtetext (titre), lines (avec |), issue, color
22scribbleDes gribouillis au marqueur se dessinent autour de voustext (label), color
23glass-widgetsDes widgets en verre dépoli et des mini-artefacts flottent autour de votre tête, plus une pillule Édité par Claudetext (grand nombre), name, handle, look (simple pour la version à 3 widgets)
24red-collageVous en noir et blanc, un mot rouge géant derrière, trois lignes s'abattenttext (mot rouge), lines (avec |), tag
25split-headlineUne carte de titre glisse et vous pousse dans la moitié inférieuretext (lignes avec |), hl (mot surligné), pill
26pastel-wordPièce lavande, mot géant derrière vous, une carte de profil se fait suivretext, name, handle
27check-pillsPièce en papier quadrillé, tableaux de reels derrière vous, un curseur clique sur des pills bleuestext (pills avec |), images
28timelineUn grade film rouge foncé avec une timeline de montage, un timecode REC et une tête de lecture lumineusetext (titre), sub, tc
29headline-boxUn zoom avec un titre sur deux lignes, la seconde ligne dans une boîte blanchetext (lignes avec |), zoom
30profile-wallGrille de vos reels remplit le mur derrière vous pendant qu'un compteur monteimages, count, label
31tier-listUne liste de niveaux tombe et Claude atterrit dans le niveau Stitle, item, others
32broll-splitB-roll en haut avec un autocollant de prix, vous en dessousimages, text (tag)
33phone-fanVos reels se déploient comme un éventail de téléphones sous un titreimages, text (lignes avec |)
34dot-revealVotre plan se construit à partir de points lumineux, puis s'affiche en image complètecolor, cell
35headline-wallVos propres titres s'empilent derrière votre tête, puis un total apparaît devanttext (headline::meta|...), total, label
36checklistUne liste de tâches Claude sous votre menton : chaque étape tourne, puis devient vertetext (step::meta|...), title
37liquid-glass-graphUne carte en verre liquide sous votre menton : un graphique vert monte tandis que le nombre défiletext (label), from, to (ex. 197K, 59%), color
38carousel-spinVos reels tournent autour de vous en carrousel 3D, puis ralentissent jusqu'à l'arrêtimages, count, size, turns
39match-cutDes pages d'actualités se coupent sur un mot, enfermé dans une boîte rouge derrière votre têtetext (le mot, défaut Claude), color
40apple-togglesUne carte de réglages iPhone sous votre menton active ses interrupteurs, une ligne à la foistext (rangées avec |), ticks (secondes avec |), color
41led-signLes lumières baissent et un panneau LED lumineux s'écrit derrière voustext (lignes avec |), color, push
42slow-pushUn lent zoom cinématographique sur votre visage tandis que la pièce se fond dans le flouzoom (défaut 1.6), blur
43over-the-shoulder-zoomLa caméra zoome dans un coin supérieur et un graphique en verre liquide transparent apparaît à côté de votre tête (la ligne monte, le nombre défile), puis recule, puis l'autre coin avec un deuxième graphique à barres associé. Votre tête reste devanttext (deux labels avec |), to (deux nombres avec |, ex. 197K|672K), zoom (défaut 2.0)
44messagesDes notifications iMessage apparaissent une par une, verre crémeux avec une lueur douce, s'empilant au-dessus du bas du cadretext (messages avec |), title (défaut Messages), y
45place-in-gridVous rétrécissez dans la tuile centrale de votre grille de profil 3x3 sur verre dépoli, puis 8 reels apparaissent autour de vous, un par image, avec les compteurs de vues Instagram sur chaque tuileimages (dossier de vos reels ou couvertures), views (9 comptes avec |, le 9e est le vôtre)
46tape-labelUne bande de ruban jaune avec votre texte se pose sur votre poitrine, hors de votre visagetext
47select-resizeUne boîte de sélection bleue avec poignées attrape votre nombre au-dessus de votre tête et un curseur le fait glisser pour l'agrandirtext (défaut 2X)
48wave-trimUn panneau sombre au-dessus de votre tête montre votre voix ; le silence pointillé rouge aux deux extrémités se réduit jusqu'à ce que seuls vos mots restentaucun
49huge-strikeUn grand mot en serif apparaît derrière votre tête, puis une ligne rouge le barretext, at (secondes dans l'effet quand la barre arrive, défaut 0.6)
50crayon-writeUn crayon rouge écrit votre mot derrière votre tête, le souligne et s'envoletext
51fan-buildLes couvertures de vos reels se distribuent en éventail derrière votre tête, une carte à la foisimages (dossier de vos couvertures), count (défaut 13)

Looks nommés (même effet, un look plus sophistiqué ; ils n'ajoutent pas au décompte) :

  • glitter-spotlight = spotlight avec look=sparkle : la pièce s'assombrit, des rayons dorés jaillissent derrière votre tête, un grand mot doré avec un balayage brillant, des étincelles scintillantes et une lueur autour de vous. text (le mot), color, push.
  • cover-star avec look=editorial : un look film chaud et doux, un classique en-tête serif derrière votre tête, une ligne de numéro et des lignes de couverture élégantes. text (en-tête), issue, lines (3 lignes avec \|), right (lignes avec \|), color, accent, lines_y, right_y.
  • liquid-glass-graph avec look=bento : le graphique ascendant se déplace vers un écran en verre fumé derrière votre tête, avec des tuiles bento en verre devant vous (un donut, un KPI, des barres). text, from, to, donut (29%::label), kpi (672K::label), bars (197\|140\|124::label).
  • apple-toggles se trouve maintenant au-dessus de vous, niché derrière votre tête, avec un zoom doux (pos=below pour l'ancienne carte sous le menton ; overlap, zoom).

Les alias fonctionnent aussi : bill, to-do, follow, stamp, countdown, cover, rain, pause.

Règles

  • Ne jamais couvrir le visage. Tout se place soit derrière la personne, soit évite le visage de lui-même ; si une image de vérification montre encore du texte sur le visage, déplacez-le (x, y) ou raccourcissez le texte.
  • Les effets s'exécutent dans l'ordre listé. Placez les effets de caméra (locked-on, lean-in, spotlight) en premier lorsqu'ils chevauchent d'autres effets.
  • Le zoom ne dépasse jamais 2x, afin que la vidéo reste nette.
  • Ce skill ajoute uniquement des visuels. Les effets sonores et les sous-titres sont à la charge de l'utilisateur (CapCut fonctionne bien).
  • Ce sont des versions de démarrage. Soyez honnête à ce sujet si l'utilisateur les compare à un reel qu'il a vu.

Options supplémentaires (édition Ray)

Elles ont été ajoutées aux effets de base pour corriger ce qui semblait incorrect sur des séquences réelles. Passez-les comme toute autre option ("key": "value" dans un plan, ou --opt key=value).

EffetOptionCe qu'il fait
tout effet carte/orbitplay=1Joue chaque vidéo du dossier images dans sa carte au lieu d'une image fixe
liquid-glass-graphpos=behindPlace le graphique sur un écran en verre sombre derrière votre tête au lieu de sur votre poitrine
liquid-glass-graphsmoke=0.5..0.85Verre fumé foncé au lieu de verre liquide transparent (pas de copie étalée de votre corps)
liquid-glass-graph, over-the-shoulder-zoomto=$32,000Les préfixes de devise et les séparateurs de milliers se comptent correctement
checklistsmoke, scale=0.86, bottom=0.95, guard=0Carte sombre lisible, plus petite, placée bas pour ne jamais toucher votre visage
checklistspan=2.9Secondes pendant lesquelles les coches arrivent, pour que la dernière coche corresponde à votre geste
spotlightflicker=0, lift=0.8Désactive le scintillement du néon, ou abaisse le mot pour que votre tête en couvre une partie
cover-starmast_y=0.15Hauteur fixe de l'en-tête (à associer à un recadrage plus serré pour que votre tête le chevauche)
comment-boxlock=1, avatar_color=#FDB827Fixe la feuille de commentaire en place, définit la couleur de l'avatar (la lettre provient de handle)

Mains devant une carte : effectuez le rendu de l'effet, puis exécutez .venv/bin/python scripts/hands_front.py <original> <with_effect> <out>.

Qualité du découpage : si models/rvm_mobilenetv3_fp32.onnx existe, chaque effet utilise Robust Video Matting pour le découpage de la personne (cheveux plus nets, pas de scintillement). Définissez FX_MATTE=mp pour utiliser le segmenteur MediaPipe d'origine.

Individual skills in this repo

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

Skills associés