Example

Snapshot blend

Two captured snapshots, one Parameter, interpolated mix per frame. The full vanilla source is on GitHub.

Click Unlock & start to load two music layers and begin looping them. Drag the slider — engine.blendSnapshots(calm, combat, t) snaps the live mix to lerp(calm, combat, t) on every change. Music bus fades in, drums bus fades up, all from one knob.

How it's wired

snapshot-blend (excerpt) ts
// Capture two mix shapes — calm and combat.
engine.bus('music').level = 0.6;
engine.bus('drums').level = 0.0;
const calm = engine.captureSnapshot('calm');

engine.bus('music').level = 0.25;
engine.bus('drums').level = 0.85;
const combat = engine.captureSnapshot('combat');

// Drive blendSnapshots from a Parameter — the slider feeds 'tension'.
const tension = engine.parameter('tension', 0);
tension.subscribe((t) => engine.blendSnapshots(calm, combat, t));

slider.addEventListener('input', () => tension.set(Number(slider.value)));

The vanilla version of this demo lives at examples/snapshot-blend/ — a zero-build index.html + main.ts pair you can deploy as-is.

Related