Son et synchronisation musicale

Que fait Son et synchronisation musicale ?

Le son, c'est la moitié de la vidéo, et la moitié que l'on oublie souvent. Une animation médiocre coupée sur le rythme avec une voix off propre paraît professionnelle ; une belle animation avec des coupes flottantes et une voix enterrée sous la musique paraît amateur. C'est la couche du goût audio. Vous décidez où tombent les coupes, où les effets sonores ponctuent le rythme, comment la voix off respire et comment le mix se positionne - puis vous transmettez les chiffres concrets (trames de beat, horodatages SFX, niveaux de duck) à remotion-compose pour les câbler sur la timeline et à remotion-render pour les exporter. Vous n'écrivez pas le JSX <Audio> et vous n'exécutez pas le rendu ; vous prenez les décisions créatives qui les alimentent.

Ceci fonctionne avec le reste du pack motion-video-direction : une liste de scènes de video-storyboard et les décisions de timing de motion-design-principles sont vos entrées - vous marquez la partition sur des beats qui existent déjà. Si du texte s'anime sur l'audio, synchronisez-le avec kinetic-typography ; si le rythme des coupes porte une démonstration produit, coordonnez-vous avec product-demo-director ; si vous montez une version verticale/réseaux sociaux, redérivez les beats par plateforme avec social-video-formatter. Le mix audio est sa propre couche - laissez l'aspect visuel (étalonnage, éclairage, contraste) à motion-color-and-light et marquez la partition sur ce qu'il étalonne.

Workflow

Exécutez ces étapes dans l'ordre. Ne commencez pas à placer les SFX avant que les coupes ne soient verrouillées sur le beat, et ne finalisez pas le mix avant que le timing de la VO ne soit bon - chaque étape dépend de la précédente.

1. Choisissez la piste et verrouillez le tempo. Choisissez une musique qui correspond à l'énergie et à la durée de la vidéo, confirmez sa licence (voir references/royalty-free-sourcing), et obtenez son BPM. La plupart des bibliothèques libres de droits indiquent le BPM ; sinon, tapez le rythme ou utilisez un détecteur. Le BPM est l'épine dorsale de tout ce qui suit - un beat dure 60 / BPM secondes, et au fps du projet, cela fait fps * 60 / BPM trames.

2. Construisez la grille de beats et accrochez les coupes. Convertissez les beats en numéros de trame et placez chaque coupe dure et chaque changement de scène majeur sur un beat (exécutez beat_grid.js ci-dessous). Coupez sur le temps fort - beats 1, 5, 9 en 4/4 - pour insister ; coupez sur n'importe quel beat pour les transitions de routine. Une coupe qui arrive deux ou trois trames en décalage du beat est perçue comme « erronée », même par des spectateurs qui ne peuvent pas expliquer pourquoi. Transmettez la liste des trames accrochées à remotion-compose comme limites de <Sequence from={...}>.

3. Placez les effets sonores sur les transitions, pas par-dessus. Les SFX existent pour rendre le mouvement physique. La règle : le son atteint son apogée à l'instant où le mouvement atteint le sien. Un whoosh conduit un balayage (commencez-le ~3 à 5 trames avant la coupe pour que sa queue tombe sur la coupe) ; un impact/bruit sourd tombe sur la trame où une carte s'encastre ; un clic/pop tombe sur la trame où un élément UI apparaît ; un riser monte sur les 10 à 20 trames avant une révélation et se résout sur celle-ci. Un SFX par transition - les empiler transforme la ponctuation en bruit. Voir references/sfx-placement.

4. Donnez du souffle à la voix off. La VO définit le rythme réel de la vidéo ; les visuels la servent, pas l'inverse. Visez un rythme conversationnel d'environ 150 mots par minute (≈2,5 mots/seconde) - plus rapide semble précipité, plus lent semble une vidéo d'otage. Laissez un silence d'un beat (8 à 15 trames) avant une ligne clé et après l'appel à l'action. Écrivez pour l'oreille : phrases courtes, une idée chacune, des contractions. Ne laissez jamais une coupe de scène tomber au milieu d'un mot - alignez les limites des scènes sur les espaces entre les phrases. Chronométrez la VO d'abord, puis étirez ou compressez les durées des scènes pour l'adapter (cela devient le durationInFrames que remotion-compose utilise).

5. Mixez : réduisez la musique pour que la VO reste au-dessus. C'est l'échec audio le plus courant. La musique et la VO à plein volume se disputent la même gamme de fréquences et les paroles se perdent. Réduisez le volume de la musique à environ 25-35 % de son niveau à chaque fois que la VO parle, puis remontez-le dans les silences. Exécutez mix_levels.js pour obtenir les niveaux et les timings concrets. Visez la VO autour de -3 à -6 dB (claire, jamais écrêtée), la musique réduite autour de -18 à -22 dB. Transmettez l'enveloppe de duck (quelles trames réduire, le niveau plancher) à remotion-compose, qui l'applique via des callbacks volume par <Audio>.

6. Vérifiez l'exportation. Après que remotion-render a produit le MP4, écoutez sur les haut-parleurs d'un ordinateur portable et sur ceux d'un téléphone, pas seulement sur un bon casque - la plupart des spectateurs regardent sur de mauvais haut-parleurs. Confirmez : chaque mot de la VO est intelligible sur la musique, aucun SFX n'écrête ou ne surprend, les coupes semblent verrouillées sur le beat, et le moment le plus fort ne distord pas. Si un mot est perdu, réduisez davantage sur cette plage ; si un SFX surprend, baissez-le de 6 dB.

Barre de qualité

L'audio est A+ seulement lorsque toutes ces conditions sont remplies :

• Chaque coupe dure tombe sur une trame de beat de la grille - aucune ne flotte entre les beats.
• Chaque SFX de transition atteint son maximum sur la trame exacte où son mouvement atteint le sien ; les risers se résolvent sur la révélation, ni avant ni après.
• La VO tourne à ~140-160 mpm avec un silence délibéré avant les lignes clés et après l'appel à l'action ; aucune coupe de scène au milieu d'un mot.
• La VO est entièrement intelligible sur la musique sur les haut-parleurs d'un téléphone - vérifié, pas supposé - parce que la musique est réduite à ~30 % pendant la parole.
• Exactement un SFX par transition ; la piste boucle ou se termine proprement sans coupure brutale sur la trame finale.
• La licence de chaque actif audio permet l'utilisation prévue (commerciale / publicités payantes / travail client) et les exigences d'attribution sont enregistrées.

À NE PAS FAIRE

• Ne laissez pas les coupes flotter hors du beat pour préserver la durée « naturelle » d'une scène - étirez ou réduisez la scène au beat le plus proche à la place.
• Ne diffusez pas la musique à plein volume sous la voix off ; la musique non réduite est la raison pour laquelle la VO semble brouillée. Réduisez-la chaque fois que quelqu'un parle.
• N'empilez pas plusieurs SFX sur une seule transition, et ne réutilisez pas le même whoosh sur chaque coupe - variez-les, sinon l'oreille cesse de les entendre.
• N'écrivez pas le JSX <Audio>, ne définissez pas les callbacks startFrom/volume et n'invoquez pas le rendu ici - produisez les chiffres et transmettez-les à remotion-compose / remotion-render.
• Ne tirez pas de pistes de rips YouTube, de sites « gratuits » sans licence déclarée ou du Spotify d'un client - une utilisation commerciale nécessite une source réellement libre de droits ou sous licence.
• Ne normalisez pas tout le mix pour qu'il soit aussi fort que possible ; laissez de la marge pour que l'impact le plus fort n'écrête pas.
• Ne laissez pas la VO se précipiter pour s'adapter à une durée fixe - re-coupez les visuels sur la VO, pas la VO sur les visuels.

Calculateur : grille de beats

Script Node autonome. Enregistrez sous beat_grid.js et exécutez avec node beat_grid.js. Il transforme un BPM et un fps en les numéros de trame exacts sur lesquels vos coupes doivent atterrir, et signale les temps forts. Aucune dépendance. Transmettez les trames imprimées à remotion-compose comme limites de <Sequence from={...}>.

// Grille de beats. Modifiez les entrées, puis : node beat_grid.js
const input = {
  bpm: 120,            // tempo de la piste choisie
  fps: 30,             // fréquence d'images du projet
  durationSeconds: 12, // durée de la vidéo
  beatsPerBar: 4,      // mesure 4/4 ; le temps fort est tous les 4 beats
}

const framesPerBeat = (input.fps * 60) / input.bpm
const totalFrames = Math.round(input.durationSeconds * input.fps)
const beats = []
for (let b = 0; ; b++) {
  const frame = Math.round(b * framesPerBeat)
  if (frame > totalFrames) break
  beats.push({ beat: b + 1, frame, downbeat: b % input.beatsPerBar === 0 })
}

console.log('Trames par beat :', framesPerBeat.toFixed(2), '(' + (60 / input.bpm).toFixed(3) + 's chacune)')
console.log('Coupez sur ces trames (* = temps fort, idéal pour les coupes dures) :')
for (const b of beats) {
  console.log('  beat ' + String(b.beat).padStart(2), '-> trame ' + String(b.frame).padStart(4), b.downbeat ? '*' : '')
}
console.log('Trames de temps forts uniquement :', beats.filter((b) => b.downbeat).map((b) => b.frame).join(', '))

Exemple de sortie

Avec les entrées ci-dessus, le script imprime :

Trames par beat : 15.00 (0.500s chacune)
Coupez sur ces trames (* = temps fort, idéal pour les coupes dures) :
  beat  1 -> trame    0 *
  beat  2 -> trame   15 
  beat  3 -> trame   30 
  beat  4 -> trame   45 
  beat  5 -> trame   60 *
  beat  6 -> trame   75 
  beat  7 -> trame   90 
  beat  8 -> trame  105 
  beat  9 -> trame  120 *
  ...
Trames de temps forts uniquement : 0, 60, 120, 180, 240, 300, 360

Lecture : à 120 BPM et 30 fps, un beat fait exactement 15 trames. Placez les transitions de routine sur n'importe quelle trame listée et vos coupes les plus dures - la coupe intro-contenu, la révélation du CTA - sur un temps fort (0, 60, 120…). Si une scène veut durer 70 trames, accrochez-la à 75 (beat 6) plutôt que de laisser la coupe flotter à 70. Ces numéros accrochés sont exactement ce que remotion-compose insère dans <Sequence from={...}>.

Calculateur : niveaux de mix et timing de duck

Script Node autonome. Enregistrez sous mix_levels.js et exécutez avec node mix_levels.js. Il calcule le niveau de musique réduite et les plages de trames par ligne de VO à réduire, afin que vous transmettiez à remotion-compose une enveloppe concrète au lieu d'une impression. Aucune dépendance.

// Planificateur de mix et de duck. Modifiez les entrées, puis : node mix_levels.js
const input = {
  fps: 30,
  musicVolume: 0.8,       // niveau de la musique quand personne ne parle (0-1)
  duckToPercent: 0.30,    // réduire la musique à cette part de son niveau sous la VO
  voVolume: 1.0,          // niveau de la voix off (gardez la VO comme élément le plus fort)
  duckFadeFrames: 8,      // fondu entrée/sortie pour que la réduction ne soit pas un saut brusque
  // Lignes de VO en [startSeconds, endSeconds] ; réduire la musique sur chacune, avec une marge de fondu
  voLines: [
    [0.5, 3.2],
    [4.0, 7.5],
    [8.2, 11.0],
  ],
}

const duckedLevel = +(input.musicVolume * input.duckToPercent).toFixed(3)
const toFrame = (s) => Math.round(s * input.fps)
// dB approximatif pour référence : 20*log10(niveau)
const dB = (v) => (v <= 0 ? '-inf' : (20 * Math.log10(v)).toFixed(1) + ' dB')

console.log('Niveau VO :           ', input.voVolume, '(' + dB(input.voVolume) + ')  <- élément le plus fort')
console.log('Musique (sans parole) : ', input.musicVolume, '(' + dB(input.musicVolume) + ')')
console.log('Musique réduite sous VO :', duckedLevel, '(' + dB(duckedLevel) + ')')
console.log('Fondu de duck :          ', input.duckFadeFrames, 'trames entrée/sortie')
console.log('Réduire la musique sur ces plages de trames (marge de ' + input.duckFadeFrames + 't de chaque côté pour le fondu) :')
for (const [start, end] of input.voLines) {
  const a = toFrame(start) - input.duckFadeFrames
  const b = toFrame(end) + input.duckFadeFrames
  console.log('  VO ' + start + 's-' + end + 's  -> trames de duck', Math.max(0, a), 'à', b)
}

Exemple de sortie

Niveau VO :            1 (0.0 dB)  <- élément le plus fort
Musique (sans parole) :   0.8 (-1.9 dB)
Musique réduite sous VO : 0.24 (-12.4 dB)
Fondu de duck :           8 trames entrée/sortie
Réduire la musique sur ces plages de trames (marge de 8t de chaque côté pour le fondu) :
  VO 0.5s-3.2s  -> trames de duck 7 à 104
  VO 4s-7.5s    -> trames de duck 112 à 233
  VO 8.2s-11s   -> trames de duck 238 à 338

Lecture : la VO reste à plein niveau (l'élément le plus fort du mix), la musique monte à 0.8 dans les silences et descend à 0.24 - environ un tiers - chaque fois que quelqu'un parle, avec un fondu sur 8 trames pour que la baisse ne soit pas un saut brusque. Les plages de trames sont exactement les intervalles que remotion-compose transmet au callback volume de l'<Audio> de la musique : niveau plein en dehors des plages, duckedLevel à l'intérieur, avec une rampe linéaire sur la marge de fondu. C'est pourquoi les paroles restent claires sans que la musique ne disparaisse.

Modèle : fiche de repérage audio

Copiez ceci, remplissez les champs ENTRÉE avec les sorties de votre grille de beats et de vos niveaux de mix, et transmettez la fiche complétée à remotion-compose. C'est la source unique de vérité pour chaque décision audio dans la vidéo.

FICHE DE REPÉRAGE AUDIO. [ENTRÉE : nom de la vidéo]. fps [ENTRÉE] / [ENTRÉE] BPM / [ENTRÉE]s total

MUSIQUE
  Piste :                [ENTRÉE : titre + source]
  Licence :              [ENTRÉE : p. ex. Epidemic Sound commerciale / CC0] - attribution : [ENTRÉE : oui/non, texte]
  Niveau (sans parole) : [ENTRÉE : 0-1]    Réduite sous VO : [ENTRÉE : 0-1] (~30%)

GRILLE DE BEATS (de beat_grid.js) - les coupes atterrissent ici
  Tramps de temps forts : [ENTRÉE : 0, 60, 120, ...]
  Coupes dures sur :      [ENTRÉE : quels temps forts portent les grosses coupes]

SFX (un par transition ; pic SUR le pic du mouvement)
  TRAME    SFX            RÔLE
  [ENTRÉE]   [ENTRÉE whoosh]  conduit un balayage (commencer ~4t avant, queue sur la coupe)
  [ENTRÉE]   [ENTRÉE impact]  encastrement de carte, atterrit SUR la trame de coupe
  [ENTRÉE]   [ENTRÉE riser]   monte sur 10-20t, se résout sur la révélation
  [ENTRÉE]   [ENTRÉE pop]     apparition d'un élément UI

VOIX OFF (~150 mpm ; les scènes s'adaptent à la VO, pas l'inverse)
  LIGNE                                  DÉBUT   FIN    SCÈNE
  [ENTRÉE ligne]                            [ENTRÉE]  [ENTRÉE] [ENTRÉE]
  (silence 8-15t avant ligne clé / après CTA)

ENVELOPPE DE DUCK (de mix_levels.js) - plages de trames pour baisser la musique
  [ENTRÉE : 7-104, 112-233, ...]  fondu [ENTRÉE]t entrée/sortie

TRANSFERT : remotion-compose câble les callbacks <Audio> + volume ; remotion-render exporte.

references/royalty-free-sourcing

Une vidéo commerciale a besoin d'une musique que vous êtes réellement autorisé à utiliser - « Je l'ai trouvée sur YouTube » n'est pas une licence, et le Spotify d'un client non plus. Sources sous licence/libres de droits, par cas d'utilisation :

• Bibliothèques d'abonnement (les plus sûres pour le travail client/commercial/publicités) : Epidemic Sound, Artlist, Musicbed, Soundstripe. Frais fixes, licence commerciale large, grandes bibliothèques SFX, pas d'attribution par vidéo. La valeur par défaut pour le travail rémunéré.
• Gratuites avec conditions (vérifiez chaque licence) : YouTube Audio Library, Free Music Archive, Freesound.org. Licence souvent CC BY, donc attribution requise - notez-la dans la fiche de repérage. Certaines interdisent l'usage commercial ; confirmez avant d'utiliser pour un travail client.
• Évitez absolument : Rips YouTube (« convertisseur YouTube en MP3 »), « free music » sans licence écrite, Spotify/Apple Music (usage personnel uniquement), sites qui ne listent pas d'auteur/compositeur. Si vous ne pouvez pas répondre « oui » à « ce morceau est-il sous licence pour des publicités payantes ? », n'utilisez pas ce morceau.

Quelle que soit la source, enregistrez l'URL de la piste, le nom de l'artiste, la licence et le texte d'attribution (le cas échéant) dans la fiche de repérage. Si votre client est poursuivi pour violation de droits d'auteur, la question sera « quelle était votre licence ? » - et la fiche de repérage est votre réponse.