3d-explode
3d-explode
3D-EXPLODE — five product teardowns built from primitives, in the look of a hardware launch film: take a thing apart in depth and put it back. Every part is its own node driven by hand-written position / rotation / scale keyframes, staggered so the eye can follow each piece out and back. 1 unit = 1 mm. WebGPU. The pure-UI explodes (layer stacks, screen sandwiches, dashboard bursts, recompose) live in ../ui-disassemble/ui-disassemble.promo — scene numbering here continues from there (s06–s10). Preview: http://localhost:4444/runtime?project=promos/primitives/animations-transitions/3d-explode/3d-explode.promo Concept frames (FLUX.2 [flex]) the scenes were agreed from: concepts/contact-sheet.jpg
Read the rig's notes
UI SOURCE — every app screen, callout and display is Tailwind HTML in 3d-explode.screens.html,
converted by `npx tsx scripts/html-screens.mts 3d-explode.screens.html 3d-explode.sections.json
3d-explode.screens.json` and dropped in below as templates (t-…). The s09 watch-face layers
are TRANSPARENT sections carrying only their own content + a cyan hairline, so stacked flush
they compose the face, and pulled apart each one reads on its own.
THE RECIPES
· axial teardown s06 s07 s10 — the product's axis is world x; parts slide along it
to fixed exploded stations, front parts out to +x, rear parts out to −x.
· vertical teardown s08 — parts rise out of the speaker body to stations on y while
the camera orbits.
· stack along a normal s09 — every layer is a node at its own rest offset; one track per
layer adds k × gap along the normal. EXPLODE top-first, COMPRESS bottom-first: with that
stagger no layer ever overtakes its neighbour, so nothing z-fights on landing.
· rails that stretch s09 — a unit cylinder (height 1, base at y=0 inside a g) whose g
scale.y track rides the top layer's offset; corner dots ride each layer.
SCENE MAP
s06 axial-teardown massage gun explodes along its barrel; the app turns intensity up to level 4
s07 spec-walk camera tracks the exploded gun; callouts pin to parts, fold into one card
s08 vertical-stack a smart speaker comes apart upward; its touch display plays a track
s09 watch-hybrid a watch: hardware and watch-face UI layers in one stack
s10 snap-together scattered gun parts align, then lock one by one; the app says Connected
AUDIO — music:3d-explode-bed (procedural, D dorian 120 BPM, shared with ui-disassemble)
+ designed SFX media:xp-*.wav (procedural): whoosh-out on every explode, whoosh-in ending on
every landing, snaps/ticks/clunks on contact frames, and s10's seven locks climbing D minor
pentatonic into the "Connected" chime. Built-in UI sfx for the app taps.
LOOK — every scene: renderer tone_mapping=None + film_grain output_transform=2 (the sRGB
encode), bloom, SSAA ×2 last, dof_pass=three. Navy-to-black backdrop, cyan #35e0ff / teal
#2ee6c8 accents. Each scene stands on a studio set: a glossy floor with a faint grid, a lit
plinth or pedestal, and standing light bars behind.- Scenes
- 5
- Kind
- reference rig
//
3D-EXPLODE — five product teardowns built from primitives, in the look of a hardware launch
film: take a thing apart in depth and put it back. Every part is its own node driven by
hand-written position / rotation / scale keyframes, staggered so the eye can follow each
piece out and back. 1 unit = 1 mm. WebGPU. The pure-UI explodes (layer stacks, screen
sandwiches, dashboard bursts, recompose) live in
../ui-disassemble/ui-disassemble.promo — scene numbering here continues
from there (s06–s10).
Preview: http://localhost:4444/runtime?project=promos/primitives/animations-transitions/3d-explode/3d-explode.promo
Concept frames (FLUX.2 [flex]) the scenes were agreed from: concepts/contact-sheet.jpg
UI SOURCE — every app screen, callout and display is Tailwind HTML in 3d-explode.screens.html,
converted by `npx tsx scripts/html-screens.mts 3d-explode.screens.html 3d-explode.sections.json
3d-explode.screens.json` and dropped in below as templates (t-…). The s09 watch-face layers
are TRANSPARENT sections carrying only their own content + a cyan hairline, so stacked flush
they compose the face, and pulled apart each one reads on its own.
THE RECIPES
· axial teardown s06 s07 s10 — the product's axis is world x; parts slide along it
to fixed exploded stations, front parts out to +x, rear parts out to −x.
· vertical teardown s08 — parts rise out of the speaker body to stations on y while
the camera orbits.
· stack along a normal s09 — every layer is a node at its own rest offset; one track per
layer adds k × gap along the normal. EXPLODE top-first, COMPRESS bottom-first: with that
stagger no layer ever overtakes its neighbour, so nothing z-fights on landing.
· rails that stretch s09 — a unit cylinder (height 1, base at y=0 inside a g) whose g
scale.y track rides the top layer's offset; corner dots ride each layer.
SCENE MAP
s06 axial-teardown massage gun explodes along its barrel; the app turns intensity up to level 4
s07 spec-walk camera tracks the exploded gun; callouts pin to parts, fold into one card
s08 vertical-stack a smart speaker comes apart upward; its touch display plays a track
s09 watch-hybrid a watch: hardware and watch-face UI layers in one stack
s10 snap-together scattered gun parts align, then lock one by one; the app says Connected
AUDIO — music:3d-explode-bed (procedural, D dorian 120 BPM, shared with ui-disassemble)
+ designed SFX media:xp-*.wav (procedural): whoosh-out on every explode, whoosh-in ending on
every landing, snaps/ticks/clunks on contact frames, and s10's seven locks climbing D minor
pentatonic into the "Connected" chime. Built-in UI sfx for the app taps.
LOOK — every scene: renderer tone_mapping=None + film_grain output_transform=2 (the sRGB
encode), bloom, SSAA ×2 last, dof_pass=three. Navy-to-black backdrop, cyan #35e0ff / teal
#2ee6c8 accents. Each scene stands on a studio set: a glossy floor with a faint grid, a lit
plinth or pedestal, and standing light bars behind.
promo#3d-explode(width=1920 height=1080 fps=30)
audio
tracks
// music — music:3d-explode-bed: D dorian, 120 BPM (every cut lands on a beat), −16 LUFS.
// The bed was scored for the original 83 s cut that opened with the five UI explodes; a track
// has no source offset, so this 42 s cut plays the bed's opening (intro, pulse from 16 s, groove
// from 32 s) and its s10 riser (at 80 s in the bed) no longer lands on "Connected" — re-score
// with the procedural-music skill to bring the riser back onto 39.0.
track#music(asset="music:3d-explode-bed" start=0 volume=0.55)
// designed SFX (media/xp-*.wav, procedural): whoosh-out = layers parting (peak 0.74 s in);
// whoosh-in = a reversed swell that stops dead on the landing (1.04 s long → starts 1.04 before)