The bar: every piece of content, on every channel, is built to win a Webby. The rail: for a "minus the hype" brand, award-grade spectacle is only on-brand as proof, not peacocking — one focal motion per moment, skippable, real payoffs, every effect earning its place. Space and 3D are not decoration; they are the brand's signature world, made literal on every surface.
This doc is the single creative source of truth. It governs what storyboards and templates look like, which effect goes where (and why not, where not), and which repo renders what. It sits over governance/brand.json (tokens/voice/motion), governance/asset_specs.yaml (sizes/routing), and the brand book (the human reference).
One coherent universe carried across the Lab, video, email, blog, and social. Extends the Lab's already-built R3F world (apps/lab/src/lab3d/).
#0a0a0c), a faint 44px grid receding into depth, ember particle drift (red sparks rising; sanctioned ember-drift, 9s linear). Red accent stays under ~8% of frame.EdgesGeometry, white glow, slow elliptical orbits, parallax/scroll-reactive). Each pillar's content stars its own shape as the hero object — instant per-territory identity:| Pillar | Shape | Pillar | Shape | |
|---|---|---|---|---|
| Performance Marketing | dodecahedron | Strategic Relations | tetrahedron | |
| Brand Marketing | icosahedron | IT & Development | box | |
| Multimedia | octahedron | Staff Training | knot | |
| Social Marketing | torus | Emerging Tech | cone |
ExtrudeGeometry, in its 6 §02 treatments: white-knockout · color · liquid-chrome · ember-fill · wireframe · 3D-extrude. Materials cross-fade as the camera moves.Camera & depth: one continuous camera that dollies through real depth (never resets), parallax by layer (Signal Field slowest/back · shapes mid · mark/type front). Translate-only on type.
Drawn from brand.json:motion — tokens are law.
Tokens: durations fast 120ms · base 240ms · slow 480ms · cinematic 6s. Easing standard (.22,.61,.36,1) · entrance (.16,1,.3,1) · exit (.55,.06,.68,.19).
Sanctioned (the only moves that ship): kinetic-build (headline rise+settle) · logo-reveal · crossfade-8f · receipts-count (count-up, holds) · ember-drift · spatial-parallax · cinematic-push (≤6s, 1.05–1.18 scale) · laser-lock (beam acquires a shape) · coalescence (the peak).
Forbidden, everywhere: bounce/elastic, confetti/sparkle/fireworks, spin-without-meaning, autoplay audio w/o captions, AI-generated on-screen text (type is always composited), cheesy transitions (star-wipe/page-curl), motion >6s that isn't a cinematic push, performed-excitement/exclamation energy.
Reduced motion: every asset ships a static first-frame poster; honor prefers-reduced-motion.
| Repo / tool | Job in the system |
|---|---|
| three.js / React-Three-Fiber | the real-time 3D — the Lab + interactive 3D heroes (apps/lab/src/lab3d/) |
Remotion + @remotion/three | the 9-output video matrix with REAL 3D in-frame (the Signal Field as comps) |
| html-in-canvas → HyperFrames | brand-accurate type / UI / receipts data panels as textures inside the 3D video (pixel-perfect, deterministic) |
| ffmpeg (GPU, NVENC) | the aspect-ratio matrix + encode + GIF dithering |
| CSS keyframes | email html-motion blocks + web micro-interactions + brand-book demos |
| fal · kie · Replicate · Higgsfield (Soul ID) · Seedance | backplates · textures · ambassador characters ONLY — never on-screen text |
| ComfyUI · Blender · TouchDesigner | designed set-pieces + generative space/nebula textures |
| CSS3DRenderer / poster fallback | the reduced-motion + no-WebGL path |
The discipline: **every effect / logo treatment / asset type appears on every surface it can run** — and every blank is labeled with why (C = platform constraint · D = fidelity downgrade · E = editorial/rail choice). Use this as a gap-finder: anything thin gets scheduled into upcoming cells so the full library is exercised across the calendar.
Asset-type fidelity ladder (how an effect degrades by surface):
real-time 3D (Lab/web) → pre-rendered 3D video (YouTube/social) → GIF loop (email Primary, MMS) → static poster (SMS text, dark email, reduced-motion).
Effect × surface matrix — ✅ used · ⬇ used as downgrade · ✖ not used (reason):
| Effect / treatment | Lab/web | YouTube + 9:16/1:1/4:5/16:9 social | SMS/MMS | Blog (.xyz/blog + Duda) | |
|---|---|---|---|---|---|
| Orbiting pillar shapes (3D) | ✅ real-time | ✅ pre-rendered | ⬇ GIF (Primary) | ⬇ GIF (MMS) / ✖ text-SMS (C) | ✅ hero loop/still |
| Ember drift | ✅ | ✅ | ⬇ GIF/CSS | ⬇ flattened | ✅ |
| Laser-lock beams | ✅ cursor-driven | ✅ scripted sweep | ⬇ GIF (Primary) | ⬇ MMS / ✖ text (C) | ⬇ hero loop |
| Kinetic-build type | ✅ | ✅ | ⬇ html-motion+GIF | ✖ (C — no motion) | ⬇ CSS on page |
| Receipts count-up | ✅ | ✅ | ⬇ GIF | ✖ static number (D) | ✅ CSS on page |
| Cinematic push-in | ✅ | ✅ | ✖ (E — single block, no room) | ✖ (C) | ⬇ subtle |
| html-in-canvas data panel | ✅ | ✅ (HyperFrames) | ⬇ static block (D) | ✖ (C) | ✅ live HTML |
| ★ Coalescence peak | ✅ | ✅ (the resolve) | ⬇ GIF end-frame | ⬇ MMS still | ⬇ hero |
| Logo: white-knockout | ✅ | ✅ | ✅ (dark blocks) | ⬇ MMS | ✅ |
| Logo: color | ✖ (E — dark world) | ⬇ light cards | ✅ (light blocks) | ⬇ | ✅ light UI |
| Logo: liquid-chrome | ✅ hero | ✅ feature beats | ✖ (E — premium only) | ✖ | ⬇ hero |
| Logo: ember-fill | ✅ | ✅ announce beats | ⬇ GIF | ⬇ | ⬇ |
| Logo: wireframe | ✅ | ✅ technical beats | ⬇ | ✖ | ✅ |
| Logo: 3D-extrude | ✅ | ✅ large title | ✖ (E — large only) | ✖ | ⬇ hero |
(C = platform can't run it · D = fidelity downgrade is the intended form there · E = editorial choice / would break the one-focal-motion rail.) The matrix lives here and is enforced at scale by the per-cell finalize gate (§7): a cell may not under-use the library without a logged reason.
Layered on the existing sizes in governance/asset_specs.yaml (add as a treatment: block per slot).
temerarii.xyz/blog + Duda; body uses live html-in-canvas data panels where useful.Authored into each brands/temerarii-media/content/storyboards/**/reel.md + its storyboard-registry.json cell. The ~10s reel (the long-form YouTube hero = an expanded version of the same arc):
| # | t | Scene | 3D / motion treatment | VO + on-screen (composited) | Audio |
|---|---|---|---|---|---|
| 1 | 0–1.5s | Cold open | deep-space field, ember drift, pillar shape drifts in (spatial-parallax) | — / pillar eyebrow | bed in |
| 2 | 1.5–4s | The hook | kinetic-build claim line | the claim, sourced | — |
| 3 | 4–7s | The proof | shape rotates → html-in-canvas receipts panel, receipts count-up, laser-lock on the figure | the method + the number | — |
| 4 | 7–9s | ★ Coalescence ★ | embers + shape + beams converge → ignite into the TM mark | — | swell |
| 5 | 9–10s | Resolve | mark holds (its treatment), CTA stance + lockup | the one next step | bed out |
Each storyboard cell carries: composition · cut spec (frames@fps) · the per-scene table · timecoded VO · per-channel caption variants · audio note (VO + ducked bed, −16 LUFS) · the pillar shape + mark treatment + motion patterns named (these are what the finalize gate checks).
engine/gates/verify_storyboard_finalized.py (or extend verify_cell_manifest.py): every scheduled video/social cell MUST carry (a) a template assignment from asset_specs, (b) a finalized storyboard (scene table populated, not a stub), (c) the pillar shape + mark treatment + motion patterns named, (d) no coverage-audit gap without a logged reason. Gate green across W23–52 = good to execute at scale.
Red <8% of frame · one focal motion per moment · 0 forbidden patterns · 0 AI on-screen text (composited only) · reduced-motion poster ships · voice clean (no banned words, no exclamation/emoji) · the spectacle reads as proof, not performance. If a frame looks like it's trying to impress rather than to show the work, it doesn't ship.