Skills › HyperFrames › media-use › mixing.md

mixing.md

72 lines · skills/media-use/references/mixing.md at a595755

Runs code

Most marks come from matching words in the file, so treat them as pointers.

1# Mixing in HyperFrames

3Preview and render run the same Web Audio graph, so what plays while scrubbing is what renders. Everything lives in attributes on the `<audio>` or `<video>` element.

Mixing in HyperFrames

Preview and render run the same Web Audio graph, so what plays while scrubbing is what renders. Everything lives in attributes on the <audio> or <video> element.

Raw lines 1 to 4

5## Level and fades

7| Attribute | Meaning |

8| ------------------------------- | ----------------------------------------------------------------------------------------- |

9| `data-volume` | Track gain, 1 = 0 dB |

10| `data-fade-in`, `data-fade-out` | Edge fades in seconds |

11| `data-playback-rate` | Constant speed, 0.1–10, pitch preserved; give a video and its paired audio the same value |

13A crossfade is two clips on different tracks that overlap, each with a fade.

Level and fades

Attribute	Meaning
`data-volume`	Track gain, 1 = 0 dB
`data-fade-in`, `data-fade-out`	Edge fades in seconds
`data-playback-rate`	Constant speed, 0.1–10, pitch preserved; give a video and its paired audio the same value

A crossfade is two clips on different tracks that overlap, each with a fade.

Raw lines 5 to 14

15## `data-automation`: envelopes

17```html

18<audio

19 id="music"

20 data-automation='{"version":1,"lanes":[{"target":"volume","points":[{"t":0,"v":1},{"t":2.5,"v":0.35}]}]}'

21 …

22></audio>

23```

25- `target` is `volume`, `rate` (a speed ramp, 0.1–10, overrides `data-playback-rate`) or `fx.<nodeId>.<param>`.

26- `t` is seconds from the start of the clip, not of the composition. `v` is in the parameter's unit: 0..1 for volume, dB for a gain, Hz for a frequency.

27- A `volume` lane multiplies `data-volume` in preview and render, so write the level in one of them: `data-volume="0.5"` under a lane at `0.5` plays at `0.25`.

28- A lane holds its first value back to the clip's start and its last value to its end, so a bed that starts before the voice needs an explicit full-level point at `t: 0`.

29- `curve` (-1..1) bends the segment leaving a point. 512 points per lane at most.

30- Don't also tween `volume` with GSAP on a track that has a volume lane or a `data-volume`; lint flags both.

`data-automation`: envelopes

<audio
  id="music"
  data-automation='{"version":1,"lanes":[{"target":"volume","points":[{"t":0,"v":1},{"t":2.5,"v":0.35}]}]}'
  …
></audio>

target is volume, rate (a speed ramp, 0.1–10, overrides data-playback-rate) or fx.<nodeId>.<param>.
t is seconds from the start of the clip, not of the composition. v is in the parameter's unit: 0..1 for volume, dB for a gain, Hz for a frequency.
A volume lane multiplies data-volume in preview and render, so write the level in one of them: data-volume="0.5" under a lane at 0.5 plays at 0.25.
A lane holds its first value back to the clip's start and its last value to its end, so a bed that starts before the voice needs an explicit full-level point at t: 0.
curve (-1..1) bends the segment leaving a point. 512 points per lane at most.
Don't also tween volume with GSAP on a track that has a volume lane or a data-volume; lint flags both.

Raw lines 15 to 31

32## `data-fx-chain`: effects

34```json

35{

36 "version": 1,

37 "nodes": [

38 { "type": "highpass", "id": "n1", "label": "Remove rumble", "params": { "frequency": 80 } },

39 {

40 "type": "peaking",

41 "id": "n2",

42 "label": "Clarity",

43 "params": { "frequency": 3000, "gain": 2.5, "q": 1 }

44 },

45 { "type": "limiter", "id": "n3", "params": { "limit": -1 } }

46 ]

47}

48```

50- Write the attribute double-quoted with the JSON's quotes as `"`.

51- Order is signal order. `id` is what automation targets (`fx.n2.gain`); give every node one, and a `label` when it does a named job. `enabled: false` bypasses a node.

52- Effects: `gain`, `highpass`, `lowpass`, `peaking`, `lowshelf`, `highshelf`, `compressor`, `limiter`, `gate`, `saturate`, `delay`, `reverb`, `chorus`, `phaser`, `bitcrush`.

53- `compressor`, `limiter`, `gate` and `bitcrush` can't be automated; a lane on them does nothing. Automate a `gain` before them instead.

54- Never set `fromCarve` by hand.

55- `reverb` and `delay` make the rendered track longer than its source; that is expected.

57| It sounds like | Reach for |

58| --------------------------- | ------------------------------------------- |

59| Hum, rumble, handling noise | `highpass` at 80 Hz |

60| Boomy, too close | `peaking` 200 Hz, −4 dB |

61| Muffled | `peaking` 250 Hz, −3 dB |

62| Words hard to make out | `peaking` 3 kHz, +2.5 dB, or duck the music |

63| Harsh | `peaking` 3.2 kHz, −3 dB |

64| Peaks clipping | `limiter` last in the chain |

`data-fx-chain`: effects

{
  "version": 1,
  "nodes": [
    { "type": "highpass", "id": "n1", "label": "Remove rumble", "params": { "frequency": 80 } },
    {
      "type": "peaking",
      "id": "n2",
      "label": "Clarity",
      "params": { "frequency": 3000, "gain": 2.5, "q": 1 }
    },
    { "type": "limiter", "id": "n3", "params": { "limit": -1 } }
  ]
}

Write the attribute double-quoted with the JSON's quotes as ".
Order is signal order. id is what automation targets (fx.n2.gain); give every node one, and a label when it does a named job. enabled: false bypasses a node.
Effects: gain, highpass, lowpass, peaking, lowshelf, highshelf, compressor, limiter, gate, saturate, delay, reverb, chorus, phaser, bitcrush.
compressor, limiter, gate and bitcrush can't be automated; a lane on them does nothing. Automate a gain before them instead.
Never set fromCarve by hand.
reverb and delay make the rendered track longer than its source; that is expected.

It sounds like	Reach for
Hum, rumble, handling noise	`highpass` at 80 Hz
Boomy, too close	`peaking` 200 Hz, −4 dB
Muffled	`peaking` 250 Hz, −3 dB
Words hard to make out	`peaking` 3 kHz, +2.5 dB, or duck the music
Harsh	`peaking` 3.2 kHz, −3 dB
Peaks clipping	`limiter` last in the chain

Raw lines 32 to 65

66## Music under a voice

68Duck the bed with a `volume` lane on the music: full level before the voice, down to about 0.3–0.4 while anyone speaks (word timings from `npx hyperframes transcribe` or the voiceover give the times), back up after. Then carve the bed, which dips only the bands the voice uses: `node <SKILL_DIR>/audio/scripts/carve.mjs --comp index.html` (needs `ffmpeg` and `@hyperframes/core` in the project; `--dry-run` to see the plan). It is the same analysis as Studio's carve panel. It reads only double-quoted attributes (JSON quotes as `"`), so write the bed's chain and lanes that way or it overwrites them. Never put a carve on a voice track.

Music under a voice

Duck the bed with a volume lane on the music: full level before the voice, down to about 0.3–0.4 while anyone speaks (word timings from npx hyperframes transcribe or the voiceover give the times), back up after. Then carve the bed, which dips only the bands the voice uses: node <SKILL_DIR>/audio/scripts/carve.mjs --comp index.html (needs ffmpeg and @hyperframes/core in the project; --dry-run to see the plan). It is the same analysis as Studio's carve panel. It reads only double-quoted attributes (JSON quotes as "), so write the bed's chain and lanes that way or it overwrites them. Never put a carve on a voice track.

Raw lines 66 to 69

Runs code scripts/carve.mjs :68

70## Group buses

72Give clips the same `data-audio-group="<id>"` to treat them as one group. An `<hf-audio-group id="<id>"></hf-audio-group>` element with that id (closed like that: `/>` does not close it) makes the group a submix bus with one `data-fx-chain`, one volume and one automation clock for every member. Keep one role per group: `voiceover`, `music`, `sfx`.

Group buses

Give clips the same data-audio-group="<id>" to treat them as one group. An <hf-audio-group id="<id>"></hf-audio-group> element with that id (closed like that: /> does not close it) makes the group a submix bus with one data-fx-chain, one volume and one automation clock for every member. Keep one role per group: voiceover, music, sfx.

Raw lines 70 to 72