uttamongithb/editorial-reel-video

Compétence Concept & Editorial Reel Video

Cette compétence enseigne aux agents comment produire des vidéos explicatives techniques et éducatives virales et à fort taux de rétention pour N'IMPORTE QUEL SUJET (ex. routage Tor, réseaux, bases de données, architecture système, Git, IA) en respectant strictement le rythme cible (ex. Reels de 60 secondes) avec des transitions riches, une cartographie de l'expression vocale, des incrustations de présentateur et des animations techniques continues.

---

1. Principes Clés & Exigences de Production

A. Respect Strict du Rythme & de la Durée (La Règle des 60 Secondes)

• Si un script désigne des horodatages de scène (ex. 0–7 s, 7–16 s, 16–27 s, 27–42 s, 42–50 s, 50–60 s), l'agent DOIT appliquer les durées cibles exactes.
• Les vitesses de TTS par défaut sont souvent trop lentes (~110 Mots/Min). Le générateur doit ajuster la vitesse de lecture audio à l'aide de FFmpeg atempo (préservation de la hauteur) pour atteindre la vitesse virale des Reels (160–180 Mots/Min) et verrouiller la durée d'exécution exacte de 60 secondes.

B. Exécution TTS de l'Agent & Standards d'Expression Vocale (Blueprint de Rétention Virale)

Les agents équipés de moteurs TTS intégrés (ex. Edge-TTS, ElevenLabs, Azure Speech, OpenAI) NE DOIVENT PAS utiliser les réglages plats/monotones par défaut. Le TTS par défaut (110–120 Mots/Min) perd les spectateurs de formats courts dès les 2 premières secondes. L'agent doit injecter des paramètres de rythme viral :

• Vélocité & Cadence : Appliquer la vélocité virale des Reels (160–180 Mots/Min ou rate: +15% à +20%).
• Hauteur & Inflexion : Injecter des excursions de hauteur expressives (pitch: +4 Hz à +8 Hz) sur les questions et les accroches.
• Micro-Pauses : Insérer des pauses tactiques de 100–180 ms (<break time="180ms"/>) juste avant les mots chocs (ex. avant "teen envelopes!").
• Cartographie des Balises d'Expression :
  • [curious] : Ouverture rapide (170 Mots/Min), levée terminale interrogative (pitch: +8%), intrigue conspiratrice.
  • [explaining] : Mesuré (155–165 Mots/Min), articulation nette, pauses de 60 ms avant les termes techniques.
  • [dramatic] : Rythme plus lent (145 Mots/Min), chute de hauteur vers la voix de poitrine (-5%), emphase staccato percutante.
  • [confident] : Débit dynamique (165 Mots/Min), ton de poitrine résonnant, levée terminale ascendante.
  • [excited] : Haute vélocité (180 Mots/Min), hauteur levée (+10%), accent rythmique marqué sur les noms.
  • [playful] / [laughing] : Débit conversationnel (165 Mots/Min), rire audible / sourire dans la respiration, ton espiègle.
• Sous-titres Mot par Mot : Extraire les horodatages des mots du TTS pour alimenter des surlignages dansants mot par mot (lueur jaune .word-active #FFE600) sur la puce inférieure.
• Blueprint Audio Maître :
  • Voix-off nivelée à -16 LUFS avec loudnorm=I=-16:TP=-1.5:LRA=7.
  • Fond musical instrumental réglé au volume 0.15 (= -29 LUFS, exactement 13 LU en dessous de la voix). Pas de ducking sidechain (l'écart de 13 LU constitue le ducking).
  • Bus d'effets sonores (gain 0.20) : pop.wav à chaque coupe de scène (gain 0.50), riser.wav 0,3 s avant les grands virages de scène (gain 0.28), click.wav à l'atterrissage des éléments d'interface (gain 0.40), chime.wav sur les révélations (gain 0.38), notify.wav sur le CTA (gain 0.35).
  • Export Maître : -14 LUFS intégrés, Crête Réelle <= -1,0 dBTP.
  • Consulter references/voice_audio_and_cutout_guide.md pour les extraits SSML complets et les configurations spécifiques aux moteurs.

C. Architecture d'Incrustation du Présentateur (Ancre 5)

Chaque scène présente une incrustation expressive du personnage du présentateur, ancrée en bas à droite (top: 63,4%, x: 20,7% depuis la droite, taille coupée par le bord du cadre, positionné sous la puce). Les poses sont directement cartographiées aux balises d'expression vocale :

• [curious] ➔ p1_shrug.png (paumes levées, yeux écarquillés, sourire excité)
• [frustrated] ➔ p2_facepalm.png (paume sur le front, grimace)
• [confident] ➔ p3_present.png (bras grands ouverts, pose ta-da, sourire fier)
• [explaining] ➔ p4_chin.png (tapotement du menton, demi-sourire malicieux, pose professorale)
• [analogy] / [recalling] ➔ p5_memory.png (se gratte la tête, petit déclic)
• [excited] / [numbers] ➔ p6_thumbs.png (grand pouce levé, énorme sourire ravi)
• [playful] / [laughing] / [cta] ➔ p7_cta.png (pointage vers le spectateur, sourire espiègle)
• [dramatic] / [look] ➔ p8_point.png (doigt pointé directement hors champ)
• [revelation] ➔ p9_idea.png (doigt levé comme une ampoule, yeux écarquillés)
• Consulter references/voice_audio_and_cutout_guide.md pour les invites de génération d'images complètes et les instructions de matage alpha.

D. Transitions de Scène Dynamiques (Pas de Coupes Rigides)

Chaque transition de scène doit utiliser une transition de mouvement active :

• Wipe Incliné Double Bande (wipe.html) : Balayage angulaire signature à -11deg avec fond de scène d'arrivée + bande de bordure d'accentuation de 120 px, alternant la direction horizontale (flip: 0 vs flip: 1).
• Push-In Caméra : Transition de zoom dans les nœuds réseau ou les couches d'architecture (scale: 0.85 -> 1.0).
• Flash Glitch Terminal : Flash chromatique rapide lors de l'entrée dans les environnements de code/terminal.
• Consulter references/v7_layout_and_transitions_guide.md pour les spécifications géométriques complètes et les chronologies GSAP.

E. Animations Continues Spécifiques au Sujet

Ne jamais montrer de diagrammes statiques. Tous les composants visuels doivent comporter un mouvement continu et réactif :

• Routage de Paquets & Dépouillement de Couches : Dans les explications Tor et réseau, montrer des paquets animés voyageant physiquement à travers les nœuds, dépouillant les couches de chiffrement (coque Green Guard, coque Yellow Middle, coque Red Exit) au fur et à mesure de leur progression.
• Éclairage Réactif des Nœuds : Les nœuds s'allument, pulsent et basculent les badges d'état (WAITING → ACTIVE → DECRYPTED) à mesure que les paquets les traversent.
• Fenêtres Terminal Interactives : Exécution de commandes en direct, journaux de circuit en temps réel et curseurs de bloc clignotants.

F. Système Typographique Éditorial Suisse

• Strictement aligné à gauche avec des marges propres.
• Hiérarchie à 3 niveaux : Accroche large espacée (#), titre massif empilé et pilules de badges mots-clés rectangulaires à fort contraste ([...]).
• Animations de glissement masqué (overflow: hidden).
• Zéro ornements floraux. Barre d'en-tête technique supérieure minimaliste et propre.

---

2. Démarrage Rapide : Script Vocal vers Vidéo

Lorsque l'utilisateur fournit un script formaté avec des expressions :

[HOOK — 0–7 sec | Curieux + mystérieux]
[curious] "Bhai, kabhi socha hai Tor Browser tumhari identity hide kaise karta hai? Tum website open karte ho, lekin tumhari request seedha website tak nahi jaati!"

[SÉLECTION DE ROUTE — 7–16 sec | Excité + explicatif]
[explaining] "Instead, Tor apne network se teen computers select karta hai — Guard Node, Middle Node aur Exit Node. Aur in teeno se milkar banta hai tumhara secret route!"

L'agent exécute le pipeline :

# 1. Analyser les sections, extraire les expressions, cartographier les poses du présentateur
python scripts/process_vo.py

# 2. Valider la conception selon les 7 lois et écrire les jetons
python scripts/prepare.py

# 3. Assembler les scènes et compiler le master index.html
python scripts/build_index.py

# 4. Rendre les images déterministes à 30 FPS
python scripts/render_video.py

# 5. Mixer la VO (-16 LUFS) avec le fond (-29 LUFS) et les effets sonores, puis muxer
python scripts/mix_audio.py
python scripts/qc.py

---

3. L'Architecture de Production V7 : Mises en Page & Transitions

La compétence adopte le Pipeline V7 Reel éprouvé en production (PARAMS.json -> prepare.py -> new_scene.py -> build_index.py -> mix_audio.py -> qc.py) :

A. Les Sept Lois de la Mise en Page et du Mouvement

1. Grille d'Ancrage Unique, Fixée en Bas :
   • Ancre 1 (Accroche) : Étiquette de catégorie/contexte à Y = 0,0667 avec tiret d'accent <i></i>.
   • Ancre 2 (Héros) : Mot d'affichage condensé à fort impact (1–3 mots) en Anton à Y = 0,1006.
   • Ancre 3 (Corps de Preuve) : Carte de preuve dynamique (A: card-led), odomètre (B: stat-led) ou déclaration sur 2 lignes (C: type-led) à Y = 0,3010.
   • Ancre 4 (La Puce) : Capsule de phrase parlée à Y = 0,5875 avec point d'accent <b></b>. Ne bouge jamais entre les scènes.
   • Ancre 5 (Le Présentateur) : Personnage coupé par le bord du cadre à Y = 0,6340 avec lueur de halo adaptative (#sX-glow). Ne bouge jamais entre les scènes.
2. Le Héros est un Mot, la Puce est la Ligne, la Carte est le Détail :
   • Héros : 1–3 mots (Anton, 17–25 % de la largeur du cadre, hauteur de ligne 0,88).
   • Puce : 3–6 mots (la ligne que lit un spectateur mobile en mode silencieux).
   • Carte : La preuve concrète (liste de fichiers, diff de mots-clés, terminal, progression du téléchargement, compteur de score).
3. Cycle de Couleurs à Six Champs :
   • accent → ground → ink → secondary → tertiary → quaternary. Aucune scène consécutive ne peut partager un fond.
4. Preuve, Pas de Décoration :
   • Chaque carte doit afficher une preuve réelle (4–6 lignes ou maquette remplissant ≥ 55 % de la carte). S'il n'y a pas de preuve, utiliser type-led (Ancre 3C) et omettre la carte.
5. L'Image 0 est une Affiche (data-cover="1") :
   • La scène 1 est composée à t = 0,0 s : accroche, héros, carte et présentateur déjà visibles. La puce atterrit à 0,65 s. Zéro image d'introduction vide.
6. Mouvement Uniquement par Transformation avec Atterrissage Précoce :
   • Les entrées atterrissent dans le premier tiers de chaque temps (0,24 s – 0,34 s, power3.out). Ne jamais animer le contenu textuel ou innerHTML.
   • Les scènes longues comportent une dérive continue subtile (tl.to("#sX-hero", { y: -14, duration: 0.7 })) pour maintenir une vie visuelle.
7. Le Son comme Ponctuation :
   • Effets sonores procéduraux (pop à chaque coupe, click/key sur les lignes d'interface, chime sur les révélations, notify sur le CTA). Mastérisé à -14 LUFS et <= -1 dBTP.

B. La Transition Wipe Incliné Double Bande (wipe.html)

• Géométrie : Balayage angulaire double bande incliné à -11deg (transform: skewX(-11deg)).
• Structure : #w-main (la couleur de fond de la scène entrante) + #w-edge (bande d'accent de 120 px).
• Alternance de Direction : Alterne horizontalement à chaque scène (flip: 0 de gauche à droite, flip: 1 de droite à gauche).
• Planification : Déclenché automatiquement 0,36 s avant chaque coupe par build_index.py, avec une durée adaptée (0,34 s – 0,62 s) pour correspondre à la longueur de la scène.

---

4. Références & Documentation

• references/voice_audio_and_cutout_guide.md : Direction vocale pour les expressions, cibles LUFS maîtresses, mixage du fond et système d'incrustation du présentateur en 9 poses.
• references/v7_layout_and_transitions_guide.md : Les spécifications mathématiques complètes de la mise en page, les formules de dérivation des jetons et la mécanique de transition wipe incliné.
• references/animation_and_transitions_guide.md : Catalogue de physique des transitions, recettes de dépouillement de couches de paquets et règles d'échelle de tempo audio.
• references/design_system.md : Couleurs CSS exactes, polices, hauteurs de ligne et zones de sécurité.
• references/concept_animation_guide.md : Comment concevoir des animations pour Tor, les bases de données, l'IA, Git, les réseaux et la conception système.