Aller au contenu

Module · 1h30 · gratuit

Module Vidéo HyperFrames (bonus avancé)

Génère tes vidéos LinkedIn courtes + intros formation + études de cas animées par code.

Créer des vidéos avec du code, c’est générer tes Reels LinkedIn, intros de formation, études de cas animées et bannières directement à partir de HyperFrames et Claude, sans Capcut, sans Adobe Premiere et sans monteur. Dans ce module tu apprends à produire les 4 formats vidéo essentiels d’un consultant indépendant : un Reel “1 méthode en 60 sec”, une vidéo intro formation/webinar, une vidéo étude de cas anonymisée et une bannière LinkedIn animée. Tu repars avec les prompts à coller, les commandes CLI et un workflow pour sortir jusqu’à 4 vidéos pro par semaine.

Où tu en es dans la formation : c’est le module le plus avancé du parcours. Si tu débarques, commence plutôt par le workbook (parcours 2h), puis reviens ici quand tu veux passer à la vidéo. Pour le ton et les accroches, le module LinkedIn et la banque de 12 prompts seront tes meilleurs alliés.

Avant de commencer

Pré-requis : il vaut mieux avoir parcouru le workbook (parcours 2h) et les autres modules avant celui-ci. Module + technique (Terminal + npm) : tu peux le mettre de côté si tu n’es pas à l’aise avec le terminal.

Ce module remplace Capcut + Adobe Premiere + monteur freelance pour les formats vidéo essentiels d’un consultant indépendant en 2026.

Pourquoi différentiel : aucun de tes pairs ne génère ses vidéos par code en 2026. 12-18 mois d’avance.

Durée : 1h30 · Bénéfice : 4 vidéos pro/semaine sans monteur, ni Capcut.

Pré-flight (10 min)

Objectif de cette étape : à la fin, HyperFrames tourne sur ta machine et une première animation s’ouvre dans ton navigateur. Tant que ce test ne passe pas, ne va pas plus loin : tout le reste du module en dépend.

Worksheet 0 : Installer HyperFrames

# Vérifie Node.js (>= 20)
node --version
# Si pas installé : https://nodejs.org → LTS

# Installer HyperFrames CLI
npm install -g hyperframes

# Vérifier
hyperframes --version

À faire

  • Active dans Claude les skills : hyperframes, hyperframes-cli, gsap
  • Crée ton dossier de travail : 
    mkdir ~/Dev/consultant-videos && cd ~/Dev/consultant-videos
hyperframes init test
cd test && hyperframes preview
  • Une page s’ouvre dans le navigateur avec une animation. Si OK : tout est prêt.

Si tu n’as JAMAIS ouvert un terminal, prévois 10 min de plus. Pas dur mais nouveau.

En clair : tu installes l’outil une seule fois, tu vérifies que l’aperçu s’ouvre, et tu n’y reviens plus.

Acte 1 · Les 4 formats vidéo consultant (5 min)

Objectif de cette section : à la fin, tu sais quel format vidéo sert à quoi, à quel ratio le produire et à quelle fréquence le publier. C’est la carte du module : chaque Acte qui suit construit l’un de ces formats.

FORMAT 1 : REEL LINKEDIN "1 MÉTHODE EN 60 SEC"
- Ratio : 9:16 (1080x1920)
- Durée : 30-60 sec
- Usage : LinkedIn natif, repurpose Insta Reels
- Volume : 2/mois suffit

FORMAT 2 : VIDÉO INTRO FORMATION / WEBINAR
- Ratio : 16:9 (1920x1080)
- Durée : 30-60 sec
- Usage : ouverture d'une session live, intro replay
- Volume : 1 par offre / 1 par lancement

FORMAT 3 : VIDÉO STUDY CASE ANONYMISÉE
- Ratio : 1:1 ou 9:16
- Durée : 60-90 sec
- Usage : preuve sociale en proposition commerciale, post LinkedIn
- Volume : 1 par cas client signé

FORMAT 4 : BANNIÈRE LINKEDIN ANIMÉE
- Ratio : 1584x396 cover
- Durée : 6-10 sec en boucle
- Usage : header profil
- Volume : 1 fixe + 1 saisonnier

En clair : le Reel (Acte 2) et l’étude de cas (Acte 3) sont tes deux formats à produire en série ; la bannière (Acte 4) se règle une fois par trimestre.

Acte 2 · Reel “1 méthode en 60 sec” (25 min)

Objectif de cette section : à la fin, tu auras un Reel vertical 9:16 prêt à publier sur LinkedIn, généré de bout en bout (storyboard, puis code, puis rendu MP4). C’est le format à maîtriser en premier, car il se réplique le plus vite.

Format roi B2B. Tu peux sortir 1 Reel par méthode en 10 min une fois calé.

Worksheet 1 : Storyboard

On commence toujours par le storyboard : tant que la structure n’est pas claire, le code ne sert à rien.

Structure éprouvée :

0-3s : HOOK FORT (problème + promesse en 1 ligne)
3-15s : SETUP (le contexte, l'erreur courante)
15-40s : LES 3 ÉTAPES de la méthode (texte plein écran)
40-55s : LE RÉSULTAT / IMPACT (data ou cas)
55-60s : CTA + signature
PROMPT À COLLER : Storyboard Reel méthode

Génère le storyboard d'un Reel LinkedIn 60 sec sur ma méthode [...].

CONTRAINTES
- Durée : 55-60 sec
- Ratio : 9:16 (1080x1920)
- Format : Hook → Setup → 3 étapes → Résultat → CTA
- 1 phrase courte par scène max
- Voix off : optionnelle (je dirai si je veux du TTS)

PRODUIS
1. Liste des visuels/screencaps nécessaires
2. Tableau scène par scène : | Timecode | Visuel | Texte écran | Animation | Son |
3. Texte voix off (40 sec parlées max)
4. Caption LinkedIn qui accompagne
5. 3 hashtags pertinents (pas plus)

Pour cadrer le ton et le hook de ta caption, tu peux t’appuyer sur le module LinkedIn, et sur la banque de 12 prompts pour les variantes d’accroche : le post LinkedIn d’autorité si tu mets une data en avant, ou le post LinkedIn storytelling si tu racontes une scène de mission.

Worksheet 2 : Génération HyperFrames

Le storyboard validé en Worksheet 1, tu le donnes à Claude pour qu’il écrive le code de la vidéo.

cd ~/Dev/consultant-videos
hyperframes init reel-methode-[slug]
cd reel-methode-[slug]
PROMPT À COLLER : Génération code HyperFrames

Génère le code HyperFrames complet pour ce Reel.

CONTEXTE
- Storyboard validé : [colle Worksheet 1]
- Charte visuelle : [lis 06_Marketing/charte.md]
- Durée cible : 55-60 sec

PRODUIS
1. index.html complet :
   - Toutes les scènes
   - Animations GSAP fluides (fade-in, slide-up, kenburns subtil)
   - Typo + couleurs charte
   - Sous-titres lisibles mobile (>36px, ombre légère)
   - Logo / signature en fin

2. hyperframes.config.js :
   - Ratio 9:16
   - FPS 30
   - Durée exacte
   - Audio (à ajouter manuellement si musique)

3. Commandes CLI à lancer (preview, render)

4. Si voix off activée :
   - Script TTS optimisé (élocution naturelle, pauses)
   - Commande `hyperframes tts`

RÈGLES
- 0 émoji dans la vidéo
- 0 mot interdit (mon-ton.md)
- Pas de musique copyright (recommande Epidemic Sound ou YouTube Audio Library)
- Vidéo finale < 30 MB

Si la charte visuelle ou les visuels te manquent, le module Design (visuels sans Canva) te montre comment les produire.

À faire

  • Lance Claude, récupère code, colle dans le dossier
  • hyperframes preview → vérifie navigateur
  • Ajuste si besoin
  • hyperframes render → MP4 dans output/
  • Upload LinkedIn

En clair : storyboard d’abord, code ensuite, aperçu avant rendu. Une fois ce circuit calé, un Reel te prend une dizaine de minutes.

Acte 3 · Vidéo étude de cas anonymisée (15 min)

Objectif de cette section : à la fin, tu sauras transformer un cas client signé en vidéo de preuve sociale (chiffres animés, format carré 1:1), à glisser dans une proposition commerciale ou un post LinkedIn. Le mécanisme est le même qu’à l’Acte 2 : ici on l’applique à un résultat client.

PROMPT À COLLER : Vidéo étude de cas

Génère le code HyperFrames pour une vidéo cas client.

INFOS (anonymisées)
- Secteur / taille société : [...]
- Problème initial : [...]
- Méthode appliquée : [...]
- Résultat mesurable : [...]
- Durée mission : [...]

FORMAT
- Ratio : 1:1 (1080x1080) pour LinkedIn feed
- Durée : 60-75 sec

STRUCTURE
0-5s : Stat marquante (ex: "x3 leads qualifiés en 6 mois")
5-15s : Le contexte client (anonymisé)
15-30s : Le problème
30-50s : La méthode appliquée (3 étapes)
50-65s : Le résultat (chiffres animés)
65-75s : "Et le vôtre ?" + signature

ANIMATIONS
- Chiffre principal : pop-in avec rebond
- Stats : compteurs animés
- Charte couleurs respectée
- Police charte

PRODUIS index.html + config + commandes.

Pour récupérer proprement les chiffres et le témoignage du client, appuie-toi sur le bilan de fin de mission + demande de témoignage de la banque de prompts.

En clair : une vidéo de cas client = une stat forte d’entrée, 3 étapes de méthode, le résultat chiffré, et un “Et le vôtre ?” pour ouvrir la conversation.

Acte 4 · Bannière LinkedIn animée (15 min)

Objectif de cette section : à la fin, tu auras une bannière de profil LinkedIn animée (format cover, boucle courte, sous la limite de poids), un détail que quasiment aucun consultant n’exploite. Contrairement aux Actes précédents, ce format se produit une seule fois et se renouvelle rarement.

LinkedIn accepte les bannières .mp4 depuis 2025. Très peu de consultants l’utilisent.

PROMPT À COLLER : Bannière LinkedIn animée

Génère le code HyperFrames pour ma bannière LinkedIn.

CONTRAINTES
- Ratio : 1584x396 (cover LinkedIn obligatoire)
- Durée : 6-10 sec en boucle parfaite
- Output : MP4 H.264, < 8 MB (limite LinkedIn)
- Centre (zone 1128x191) doit rester lisible (mobile crop)

CONTENU
- Gauche : mon nom + titre métier
- Droite : 1 promesse ou stat clé
- Centre : libre pour photo profil

ANIMATION
- Très subtile (élégance > épate)
- Suggestions : parallaxe léger sur fond ville flouté, texte qui apparaît par lettres en fade au début, ligne accent qui se dessine sous le titre
- AUCUN flash, AUCUN clignotement

STYLE
- Charte couleurs
- Photo de fond [ville ou bureau ou visuel abstrait] avec overlay sombre 40%
- Mode pro

PRODUIS index.html + config + render + instructions upload LinkedIn.

Besoin d’une photo de fond ou d’un visuel abstrait propre ? Le module Design (visuels sans Canva) couvre la génération de ces images.

En clair : sobriété absolue (aucun flash), centre lisible pour le crop mobile, poids sous 8 MB. C’est un réglage qu’on pose une fois pour toutes.

Acte 5 · Production en série (10 min)

Objectif de cette section : à la fin, tu auras un workflow hebdo qui transforme la production vidéo en routine, et tu sauras réutiliser chaque vidéo sur plusieurs plateformes sans la refaire. C’est ce qui te fait tenir le rythme de 4 vidéos/semaine sans y passer tes journées.

Workflow hebdo

LUNDI MATIN (15 min)
- Identifier les sujets / méthodes / cas à publier cette semaine
- Brief Claude pour storyboards

LUNDI APRÈS-MIDI (30 min)
- Génération des Reels via HyperFrames
- Render → MP4
- Stockage dans 05_Veille & contenus/videos/

MARDI MATIN (5 min) : publication Reel #1
JEUDI MATIN (5 min) : publication Reel #2

VENDREDI (10 min) : si nouvelle mission signée OU bilan d'1 mission, génère la vidéo cas client

TRIMESTRE (1h tous les 3 mois)
- Renouveler bannière LinkedIn animée

Pour trouver les sujets du lundi matin, le prompt veille hebdo + idée de contenu te donne un angle prêt à storyboarder. Et pour automatiser le stockage des MP4 et la veille autour de ces vidéos, regarde le module Cowork (connecter Claude au Drive/Gmail).

Réutilisation 4 plateformes

  1. LinkedIn natif (vertical 9:16 ou carré 1:1)
  2. Reels Insta (vertical 9:16)
  3. YouTube Shorts (vertical 9:16)
  4. Pitch slide animée (export PNG/GIF pour deck)

Toujours générer en 9:16 pour la flexibilité.

En clair : tu produis le lundi, tu publies le mardi et le jeudi, et tu génères 1 vidéo en 9:16 que tu réutilises sur 4 plateformes au lieu d’en refaire 4.

Pour aller plus loin (6 mois)

  • Voix off TTS : hyperframes tts génère voix naturelles depuis ton script
  • Sous-titres auto : hyperframes transcribe génère sous-titres depuis voix off
  • Animations avancées : skill gsap pour transitions plus poussées
  • Vidéos longues YouTube : 5-10 min “méthode complète” pour évergreen
  • Testimonials clients vidéo : capter brut, HyperFrames pour habillage

5 pièges à éviter

À éviter

  1. Tout faire en 1h le 1er jour → bloque-toi 1 demi-journée pour la première
  2. Surcharger animations → sobriété > effet
  3. Pas tester mobile → 80% des vues seront mobile
  4. Musique copyright → ban LinkedIn. Royalty-free uniquement.
  5. Pas garder fichiers source → garder TOUJOURS index.html source dans Veille & contenus

Ressources

Pour creuser d’autres usages de Claude, parcours la banque de 12 prompts, les 6 templates de brief et le bonus 7 erreurs à éviter avec Claude.

Module Vidéo HyperFrames Consultant · NUNC · Matthieu Daumain · v1.0 · Mai 2026