Topics
Each topic holds reference rigs: small films built to show one subject. Open one to read its source, edit it and play it.
Abstract
1 rigTagsicon3d
Actions
1 rigAnimations transitions
12 rigs3d-explode5 scenes3D-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 aOpen and play →animated-states3 scenesSkinned rigs — the three.js animation system authored as keyframes.Open and play →assembly-generic37 scenesOpen and play →assembly-reels18 scenesOpen and play →camera-transitions17 scenesTransition primitives — every way the engine can get from one scene to the next, one scene per transition, each one NAMED on screen.Open and play →emerge-demo4 scenesemerge-demo — the ENGINE VERIFICATION reel for transition="emerge", the mirror of transition="through".Open and play →emotion-lens1 sceneOpen and play →in-scene-ui-assemble1 sceneIN-SCENE UI ASSEMBLE — one continuous scene. The UI does not start on the device: each part of the app lives in the WORLD, in the room it controls, next to the props it talks about. The camera tours them one by one while the VO explains each, then flies to the centre, where the pOpen and play →match-morph-particles23 scenesParticle Morph — match-move pairs that dissolve into a particle swarm.Open and play →transition-lens14 scenesTransition Lens — Cameras That Cut.Open and play →ui-assemble5 scenesUI ASSEMBLE — the reverse of ../ui-disassemble/: every scene opens on an EMPTY set (a bare pedestal, a phone with a black screen, a laptop showing only empty slot outlines, a blank browser). The UI is already blown apart so far that no piece is in frame: each one waits 700–2000 mOpen and play →ui-disassemble5 scenesUI DISASSEMBLE — five ways to take an app UI apart in depth and put it back together (ui3d: clear layers and cards, NOT the `assembly` shard preset), in the look of a hardware launch film. Each scene opens on the finished UI, explodes it and packs it home. Every layer, tile and sOpen and play →
Backgrounds
3 rigsaurora35 scenesAURORA — one tag, two light fields.Open and play →band-field51 scenesONE TAG, BOTH FAMILIES — the unified displaced surface.Open and play →hazes15 scenesHaze Backgrounds — ten ANIMATED premium brand palettes, exact hexes as specified. Groups: Elite Dark & Minimalist (apple-frost, spotify-onyx, stripe-midnight), Rich Earth & Warmth (amber-noir, oatmeal-minimalist, mocha-luxe), Jewel & Editorial (emerald-reserve, rosewood-velvet, dOpen and play →
Camera
8 rigscamera-dof-bokeh215 scenesCamera depth-of-field primitives — the whole DOF surface, one knob per scene.Open and play →camera-dof-device-lattice1 sceneCamera DOF — the DEVICE lattice. camera-dof-lattice.promo's idea (a 3D grid built with `repeat` + `vary`, a lens that racks through it) with devices in place of the mirror balls, and a camera that never parks: it dives down a corridor, orbits a laptop, flies through a column gap,Open and play →camera-dof-lattice1 sceneCamera DOF — the three.js lattice. A port of three.js's examples/webgpu_postprocessing_dof.html onto this engine, built to be profiled next to the original (devtools runtime, three.js Inspector: key I or ?inspector=1) and compared frame for frame against it.Open and play →camera-dof8 scenesCamera depth-of-field primitives — the whole DOF surface, one knob per scene.Open and play →camera-framing-devices10 scenesCamera-framing primitives · DEVICES + UI — the companion reel to camera-framing.pug. Same `<frame>` pose track, same parameters; the targets here are device rigs, their screens, browser windows and UI panels.Open and play →camera-framing-dof2 scenesOpen and play →camera-framing9 scenesCamera-framing primitives — every parameter of `<frame>`, one scene each.Open and play →depth-corridor1 scenePulse — Depth Corridor. A real app promo as ONE continuous fly-through: iPhone → browser → iPad → live metrics → MacBook, each at its own depth, the camera_dof lens handing focus from screen to screen while emissive dust and haze bloom into bokeh behind them. Preview: /packages/rOpen and play →
Tagssphere
Closeups
1 rigClosup fast
1 rigCode
1 rigCoverage
1 rigDevices
4 rigsdevices-explode9 scenesDEVICES-EXPLODE — every device's `explode` channel and the laptop's lid states, in one promo. Every GLB device (<iphone>, <laptop>/<macbook>, <ipad>, <imac>) is built in parts from code (scripts/device-models): each layer of the real hardware is its own node with real thickness aOpen and play →iphone-fold3 scenesIPHONE-FOLD — the foldable iPhone as a device tag: a GLB built in parts (scripts/device-models/iphone-fold.mts → iphone_fold_parts.glb) with a hinge the `state` channel swings, an `explode` teardown, and TWO live screens. 1 unit = 1 mm. Preview: http://localhost:4444/runtime?projOpen and play →keyboard-type1 sceneKEYBOARD-TYPE — a macro on the MacBook's keyboard types "Promo", Return starts a render, and the camera pulls out to the whole machine on a desk at night. One shot, 9 s. 1 unit = 1 mm. Preview: http://localhost:4444/runtime?project=promos/primitives/devices/keyboard-type/keyboardOpen and play →peripherals2 scenesPERIPHERALS — the code-built keyboard and mouse (scripts/device-models/keyboard.mts, mouse.mts), and every way their `state` channel drives them. npm run models:devices -- keyboard --out <promo dir>/models/keyboard.glb npm run models:devices -- mouse --out <promo dir>/models/mousOpen and play →
Effects
5 rigsaura16 scenesorbit-aura — the comet that runs an element's outline, on every kind of mesh the promo vocabulary can build. One scene per family; the aura params are held constant across a scene so any difference you see comes from the GEOMETRY, not from the settings.Open and play →clipping12 scenesClipping primitives — the `clip` channel, one idea per scene.Open and play →effects6 scenesEFFECTS — foundation library of six secondary-environment effects, rebuilt as a near pixel match of the approved reference renders (screenshots/reference/*.png, captured from accent-scenes.html). One effect per scene, staged around a neutral sphere subject at the origin. Modular Open and play →gradient-glass6 scenesGRADIENT GLASS — the field-sampled physical material, every knob on screen.Open and play →imported-vfx15 scenesimported-vfx — everything ported from HyperFrames (Apache-2.0) in one reel.Open and play →
Fast cutting
10 rigsfast-cut-acceleration11 scenesFast cutting · technique 09 — ACCELERATION. 11 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-beat10 scenesFast cutting · technique 05 — ON THE BEAT. 10 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-cause-effect8 scenesFast cutting · technique 03 — CAUSE → EFFECT. 8 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-center6 scenesFast cutting · technique 02 — CENTER FRAMING. 6 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-flow6 scenesFast cutting · technique 01 — FLOW CUT. 6 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-invisible6 scenesFast cutting · technique 06 — INVISIBLE CUT. 6 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-jump7 scenesFast cutting · technique 07 — JUMP CUT. 7 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-smash8 scenesFast cutting · technique 08 — SMASH CUT. 8 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cut-sound6 scenesFast cutting · technique 04 — SOUND DESIGN. 6 shots, taken whole. One of the nine fast-cut disciplines, split out of the full reel beside it (fast-cutting.promo) so it can be studied and lifted on its own: a title card, the technique played straight, and a hold to land on.Open and play →fast-cutting61 scenesFast-cutting primitives — NINE MONTAGE TECHNIQUES, one reel, 61 shots. A fast-cut montage condenses time with clips of 3–18 frames; what keeps it readable is not the speed but the discipline behind each cut. Every chapter here isolates one discipline, names it on a title card, anOpen and play →
Fonts
1 rigGraphs
1 rigHdr
1 rigLayouts
2 rigslayout9 scenesLayout primitives — every layout container the engine has, one scene each. Each scene holds a static pose: the CONTAINER does the arranging, not keyframes. Three matched haze lobes (hz0..hz2) ride every scene so `transition=match-move` carries the backdrop across each cut.Open and play →layouts18 scenesOpen and play →
Lights
3 rigslens-flare17 scenesLENS-FLARE — the one accent tag that is not a mesh, and what it is FOR.Open and play →physical-lights3 scenesPHYSICAL LIGHTS — a one-scene port of three.js `webgl_lights_physical`, kept faithful on purpose: it is the acceptance test for the point light's inverse-square decay, Reinhard tone mapping and the bump/roughness/metalness texture slots.Open and play →rect-area-light8 scenesRECT AREA LIGHT — a one-scene port of three.js `webgl_lights_rectarealight`, kept faithful on purpose: it is the acceptance test for the area light, the torus-knot primitive and the procedural checker roughness map.Open and play →
Materials
6 rigsglow-lines1 sceneGLOW LINES — two neon lines that are nothing but a path. Each one is born BEHIND the camera (amber on the left, cyan on the right), streaks past the lens, carves through the set — a corkscrew round the phone, a loop-the-loop — and ends by closing a ring behind the phone, where itOpen and play →glow-ribbons8 scenesGLOW RIBBONS — eight neon-line looks, each built only from the glow recipe (a dark base, roughness 1, metalness 0, the colour in the emissive), swept into tubes and ribbons. Companion to glow.promo and glow-lines.promo. Every scene keeps the "Ember" phone in the set.Open and play →glow40 scenesGLOW — one material, forty ways to spend it. The material under study:Open and play →iridescence-glass10 scenesIRIDESCENCE-GLASS — ten glass compositions, ten grounds. Real transmission (transmission=1, dispersion, iridescence, per-slab attenuation tints) over a floor whose caustic is PAINTED, because three.js sends no light through a transmissive mesh.Open and play →iridescence5 scenesIRIDESCENCE — can a stack of thin-film glass throw a RAINBOW CAUSTIC on the floor, and which part of the engine has to do it?Open and play →materials7 scenesMaterials — every surface the promo DSL can put on an element, in one reel.Open and play →
Morphs
29 rigsall-morphs1 sceneAll morphs — every `morph=` mode (24) and the concept knobs (6), close up, one at a time, in ONE scene with a camera that never stops.Open and play →bloom1 scenemorph="bloom" — flower bloom (match-morph-bloom.ts).Open and play →butterflies1 scenemorph="butterflies" — paper butterflies (match-morph-butterflies.ts).Open and play →clockwork1 scenemorph="clockwork" — the face opens onto a brass movement (match-morph-clockwork.ts).Open and play →concepts-modes1 sceneMorph concepts — the ten NEW modes side by side, ONE scene (shaders/morph-concepts/*.jpg are the before · mid · end references; each mode also has its own reel, promos/primitives/morphs/<mode>.promo).Open and play →concepts1 sceneMorph concepts — the ten concept morphs that need no new mode, ONE scene (shaders/morph-concepts/*.jpg are the before · mid · end references).Open and play →coral1 scenemorph="coral" — bioluminescent coral overgrows the element and recedes off its partner (match-morph-coral.ts). ONE scene, in-scene `morph-to` links, no cuts.Open and play →dissolve3 scenesmorph="dissolve" — turbulence and a burning edge (match-morph-dissolve.ts).Open and play →extrude3 scenesmorph="extrude" — solid point tween (match-morph-extrude.ts).Open and play →ferrofluid1 scenemorph="ferrofluid" — the picture turns into magnetic fluid (match-morph-ferrofluid.ts).Open and play →fold3 scenesmorph="fold" — origami hand-off (match-morph-fold.ts).Open and play →geode1 scenemorph="geode" — petrify, crack, break open on amethyst (match-morph-geode.ts).Open and play →index-single-scene1 sceneMorph index — every mode, ONE scene, no cuts (engine/scene-morph.ts).Open and play →index10 scenesMorph index — every morph mode side by side (match-morph-modes.ts, plus the particle swarm in match-morph-particles.ts).Open and play →inflate3 scenesmorph="inflate" — balloon hand-off (match-morph-inflate.ts).Open and play →ink1 scenemorph="ink" — ink into water (match-morph-ink.ts).Open and play →knit1 scenemorph="knit" — knitted yarn (match-morph-knit.ts).Open and play →liquid3 scenesmorph="liquid" — distance-field melt (match-morph-liquid.ts).Open and play →liquid3d4 scenesmorph="liquid3d" — the melt, from the element's REAL surface (match-morph-liquid.ts).Open and play →outline3 scenesmorph="outline" — stroke hand-off with clip wipes (match-morph-outline.ts).Open and play →popup1 scenemorph="popup" — pop-up book (match-morph-popup.ts).Open and play →shatter3 scenesmorph="shatter" — fracture, hang, reassemble (match-morph-shatter.ts).Open and play →shatter3d3 scenesmorph="shatter3d" — shards cut from the element's REAL surface (match-morph-shatter.ts).Open and play →slices3 scenesmorph="slices" — split-flap slats (match-morph-slices.ts).Open and play →slices3d4 scenesmorph="slices3d" — split-flap slats cut from the REAL object (match-morph-slices.ts).Open and play →station-handoff1 sceneSTATION HAND-OFF — one object carried from device to device in a room reel.Open and play →voxels3 scenesmorph="voxels" — pixelate and rebuild (match-morph-voxels.ts).Open and play →voxels3d3 scenesmorph="voxels3d" — cubes from the element's REAL surface (match-morph-voxels.ts).Open and play →wrap1 scenemorph="wrap" — peel off like a sticker, wrap a glossy solid (match-morph-wrap.ts).Open and play →
Motion
1 rigTagsmacbook
Nodes edges
1 rigTagsedge
Particles
1 rigPhysics
1 rigPostprocessing
4 rigspostprocessing18 scenesPOSTPROCESSING — what the end of the post chain does to every kind of text, UI and model. Eighteen static scenes of ONE identical set; only the renderer line and the postprocessing chain change from scene to scene. Each title says the chain; BROKEN scenes are the mistakes, kept oOpen and play →pp-lab.next4 scenesPost-processing lab — FIRST-CLASS STEPS. pp-lab.promo's three shots, rebuilt with the engine-ordered post steps (docs/plans/postprocess.plan.md), plus a fourth shot that only the new grammar can author.Open and play →pp-lab3 scenesPost-processing lab — LEGACY grammar. The same three shots are rebuilt with the first-class post steps in pp-lab.next.promo (and scrambled in pp-lab.shuffled.promo); this file was the baseline the post-step engine change reproduced bit-for-bit (docs/plans/postprocess.plan.md). SiOpen and play →pp-lab.shuffled4 scenesPost-processing lab — SHUFFLED. pp-lab.next.promo, identical in every element, with every postprocessing block written in scrambled order. The engine decides the chain order (lib/postprocessing/post-steps.ts), so this must render pixel-identical to pp-lab.next.promo.Open and play →
Scenes
63 rigsabstract-area-light7 scenesABSTRACT · AREA LIGHT — seven premium (amber-noir) rooms built on the one idea of promos/primitives/lights/rect-area-light.promo: a RECTANGLE of light you can see in the shot (`helper=true` draws the panel at colour × intensity), read three ways at once — as the panel, as a specuOpen and play →abstract-camera11 scenesABSTRACT · CAMERA SUITE — shots 17-27 of the RICH-SCENES reel, and the largest of its parts. Eleven shots in which nothing in the set does anything interesting and the CAMERA is the subject.Open and play →abstract-coda3 scenesABSTRACT · LOCKUP + PHYSICS CODA — shots 28-30 of the RICH-SCENES reel, and the part that closes it. The lockup lands, and two SOLVED shots close on the same phone.Open and play →abstract-glass5 scenesABSTRACT · MATERIAL SUITE — shots 06-10 of the RICH-SCENES reel. Five shots that take s05 GLASS apart and re-point it five ways.Open and play →abstract-insertions1 sceneABSTRACT · INSERTIONS — five rooms on one street, one camera.Open and play →abstract-kit5 scenesABSTRACT · KIT — shots 01-05 of the RICH-SCENES reel, and the part that declares everything the other seven parts spend.Open and play →abstract-looks-16 scenesABSTRACT · LOOKS 1 — the first six of eighteen 4-second look studies. This is the SECOND reel that lived in abstract.promo, and it is a different kind of thing from RICH-SCENES: not one continuous argument across thirty shots but eighteen independent rooms, each one a single claiOpen and play →abstract-looks-26 scenesABSTRACT · LOOKS 2 — the middle six of eighteen 4-second look studies, and the heaviest of the three parts: 07, 08 and 10 are the file's three big procedural builds.Open and play →abstract-looks-3-best6 scenesABSTRACT · LOOKS 3 — the last six of eighteen 4-second look studies, and the flattest, quietest end of the set. Five of the six get their whole picture from ONE decision — a material, a lens, a light — rather than from a build.Open and play →abstract-tunnel-best6 scenesABSTRACT · REPETITION SUITE — shots 11-16 of the RICH-SCENES reel. Shot 11 is the second of the two shots that carry the port; 12-16 are it taken apart and re-pointed, five ways.Open and play →abstract50 scenesRICH-SCENES — the KIT REEL, ported and then extended twice. Seven shapes, six materials, THIRTY shots, and in every shot a real device carrying the reel's own HUD.Open and play →closeups12 scenesCloseups, PREMIUM — the twelve ULTRA CLOSEUPS of promos/primitives/closeups/closeups.promo, same devices, same UIs, same framed camera and the same tight dof_range on every held element, moved into the abstract folder and dressed in the library's own look (amber-noir). Nothing abOpen and play →folded-shell3 scenesFOLDED SHELL — one storyboard row (new-scenes/images/rows/h2a_r2.png), built from MOBILES ONLY: nine iphones, no quads, no tablets, no laptops.Open and play →echo-compression1 sceneECHO COMPRESSION — new-scenes shot 21 (Act IV · time as physical material), built off images/rows/h3a_r2.png: a row of glass-and-amber exposures on steel rods receding down a dark hall · the row packing together · one amber ring fused behind the phone as its halo.Open and play →electrostatic-contour1 sceneELECTROSTATIC CONTOUR — new-scenes shot 25 (Act V · space and environmental fields), built off images/rows/h5a_r0.png: a loose field of gold dust in dim haze · the dust drawn onto a phone's construction, feature by feature · the real device exposed in a burst as the polarity flipOpen and play →gimbal-room1 sceneGIMBAL ROOM — scene 27 of the NEW-SCENES plan, built off new-scenes/images/rows/h5a_r2.png (sheet 5, third storyboard row).Open and play →h3a-ring-exit1 sceneABSTRACT · NEW-SCENES · H3A — THE RING LEAVES. One shot, 8 s, built off images/rows/h3a_r0.png: a circular black podium in a dark panelled room, twelve laptops standing in a ring around a thirteenth in the centre. A shaft of light finds the centre one; the ring lifts away in pairOpen and play →light-guide1 sceneLIGHT GUIDE — new-scenes shot 06 (Act I · light and perception), built off images/rows/s4_5.png: a thick clear filament snaking across a dark table, one amber pulse lit at its near end · the pulse deep in the bends, visible where the glass turns · the filament plugged into a phonOpen and play →0-abstract-hero-scenes-very-cool5 scenesABSTRACT · HERO SCENES — five ways to look at the device and nothing else, in the abstract reel's grammar. A hero scene is 5.5–6 s of one slow move around one real device at true size, lit by a rig that is the shot's whole argument. No headline: the only copy is the wordmark on tOpen and play →0-abstract-proof-very-cool5 scenesABSTRACT · PROOF — five ways to show evidence, in the abstract reel's grammar. A proof scene is 3–3.5 s and its number is never just typed: the stars FILL, the metrics COUNT, the ring CLOSES, the wall LIGHTS, the bar OVERTAKES. Every count is a run of text layers swapped by opaciOpen and play →abstract-call-to-action5 scenesABSTRACT · CALL TO ACTION — five ways to ask, in the abstract reel's grammar. A CTA is 4.5–5 s: one line, one press or one threshold, the URL, and then a HELD frame. Every scene here has exactly one thing that gets pressed or crossed, and it happens once, on a beat the viewer canOpen and play →abstract-features5 scenesABSTRACT · FEATURES — five demonstrations, each ONE thing the product does, performed on the device's own glass with the camera tight enough to read it, in the abstract reel's grammar. A feature scene is 3.5 s: the action lands at 0.8–1.2 s, the result is complete by 2.4, and theOpen and play →abstract-hook5 scenesABSTRACT · HOOK — five ways to take the first three seconds, in the abstract reel's grammar. A hook is 2.5–3 s, one beat, and it is over before the viewer has decided anything: a word slams, a phone whips in, a question types itself, a number runs up, a switch flips. Nothing hereOpen and play →abstract-intros5 scenesABSTRACT · INTROS — five ways to open on the reel's phone. Each one is a single 5.5–6.5 s claim in the abstract reel's grammar: a near-black stage, one amber accent, one cool accent, three matched haze lobes, a real device at true size, and a wordmark that arrives LAST. They are Open and play →abstract-journey-benefit5 scenesABSTRACT · JOURNEY + BENEFIT — five shots that take something from a start to a finish, in the abstract reel's grammar. A journey scene is 3.5–4 s and has a LEFT and a RIGHT (or a before and an after): the thing that travels is emissive, the stations are the reel's primitives andOpen and play →abstract-montage10 scenesABSTRACT · MONTAGE — five pacing sections, in the abstract reel's grammar. A montage is where the film changes tempo: cells swap on a beat, six close-ups hard-cut, a burst settles into a row, a column scrolls past and stops, screens sweep in from alternating sides. Nothing here iOpen and play →abstract-no-device-intros5 scenesABSTRACT · NO-DEVICE INTROS — five openers with NO device in them: the wordmark is the subject, and the kit's primitives (capsules, rings, the knot, chamfered cubes, a disc) are the set it arrives in. Same grammar as abstract-intros: a near-black stage, one amber accent, one coolOpen and play →abstract-outros5 scenesABSTRACT · OUTROS — five ways to land the reel's phone. Each is a 6.5–7 s shot in the abstract reel's grammar that ARRIVES at a lockup — wordmark, strap, the CTA on the glass — and then HOLDS, so a fade or an end card has a still frame to cut from. The five are the five things a Open and play →abstract-problems5 scenesABSTRACT · PROBLEMS — five ways to say something is wrong, in the abstract reel's grammar. The PROBLEM slot of a film is the 3–7 s where the world the product will fix is shown broken, and the rule here is the same as the reel's: nothing is illustrated, it is CAUSED. A pile is thOpen and play →abstract-reveal5 scenesABSTRACT · REVEAL — five ways the product appears, in the abstract reel's grammar, and two of them are the grammar's OWN reveals: a fly-through (transition=through) and an emerge (transition=emerge through=<next>). A reveal is 3–4 s and it is one motion: a turn, a drop, a crossinOpen and play →abstract-transitions7 scenesABSTRACT · TRANSITIONS — six short rooms for the same phone, and the five handoffs between them are the subject. Each scene is 2.5 s of a set the reel already knows (a kit row, a ring corridor, a capsule field, a cube grid, a halo, an eclipse); the gaps are five DIFFERENT transitOpen and play →abstract-value-propositions4 scenesABSTRACT · VALUE PROPOSITIONS — four claims, each with the thing that proves it in the same frame, in the abstract reel's grammar. A value scene is 5.5–6 s: the line is on screen by 1.2 s and stays, and the picture spends the rest of the shot DOING what the line says. The reel's Open and play →rain.colorful10 scenesRAIN · COLORFUL / PLAYFUL — color/material restyle of rain.promo. Peach room, candy field: yellow capsules, lavender secondaries, coral emissives, mint fill. Soft clearcoat, bubbly HUD on cream.Open and play →rain.corporate10 scenesRAIN · CORPORATE / PROFESSIONAL — color/material restyle of rain.promo. Navy volume, charcoal hardware, white HUD. Muted steel accents, matte surfaces, conservative bloom. Boardroom, not nightclub.Open and play →rain10 scenesRAIN — ten shots of the look that shot was named for, without the weather.Open and play →staircase1 sceneABSTRACT · ROOMS · 02 STAIRCASE — the camera climbs.Open and play →studio1 sceneABSTRACT · ROOMS · 03 STUDIO — one bench, three soft-boxes.Open and play →turntable1 sceneABSTRACT · ROOMS · 01 TURNTABLE — the camera holds, the room delivers.Open and play →airship-skyvault7 scenesREFERENCE — a complete 39 s outdoor promo built from generated props: the open deck of an airship over a sea of clouds, iphone and laptop on the deck, light from a low sun (read it in parts). Copied from promos/new/airship-skyvault; its models, media and voice-over live with the Open and play →alpine-ridgeline7 scenesREFERENCE — a complete 35 s outdoor promo: a summit ridge at sunrise above a sea of clouds, layered heightfield ranges, generated rocks and props, one iphone throughout (read it in parts). Copied from promos/new/alpine-ridgeline; its models, media and voice-over live with the oriOpen and play →rain.dark10 scenesRAIN · DARK / HIGH-CONTRAST — color/material restyle of rain.promo. Void black, one lime. Matte charcoal field, neon-yellow emissives and HUD ink. No second colour — contrast is the whole look.Open and play →rain.flat10 scenesRAIN · FLAT DESIGN — color/material restyle of rain.promo. Lambert slabs. Teal room, yellow accent, charcoal hardware. No specular, no iridescence, bloom almost off — colour blocks, not light.Open and play →rain.futuristic10 scenesRAIN · FUTURISTIC / SCI-FI — color/material restyle of rain.promo. Obsidian room, neon cyan and magenta. Iridescent purple-blue film on the field, glowing edges, prism flare. Cyber, not amber/teal.Open and play →rain.glassmorphism10 scenesRAIN · GLASSMORPHISM — color/material restyle of rain.promo. Frosted field over a purple-blue volume. Pale physical coats (transmission is disabled reel-wide, so frost is roughness + clearcoat), white ink, thin luminous edges.Open and play →rain.luxury10 scenesRAIN · LUXURY / BLACK & GOLD — color/material restyle of rain.promo. Black lacquer and metallic gold. The field is brass, the hardware is void, the HUD is gold on black. High gloss, dramatic key.Open and play →rain.material10 scenesRAIN · MATERIAL DESIGN — color/material restyle of rain.promo. Google-blue volume. White HUD cards, dark-gray hardware, royal-blue capsules as the elevated surfaces. The room is the primary colour.Open and play →rain.minimalist10 scenesRAIN · MINIMALIST — color/material restyle of rain.promo. Matte white clay, silver hardware, black ink on a white HUD. No film, no glow, almost no bloom — the room is a gallery, not a stage.Open and play →rain.modern10 scenesRAIN · MODERN / CLEAN — color/material restyle of rain.promo. Off-white room, royal-blue accent, silver hardware with a soft clearcoat. Friendly depth — not a dark reel with the lights up.Open and play →complex-models10 scenesSCENES — big environment GLBs (rooms, streets, kits, hero props) loaded as `asset(asset="model:…")` and re-lit / re-skinned with `material_overrides`. Ten scenes, one recipe each; every one is a faithful port or a kit-bash of a CC0 / permissively-licensed model, downloaded into aOpen and play →flying-uis2 scenes═══════════════════════════════════════════════════════════════════════════Open and play →generated-models2 scenesGENERATED MODELS — TRELLIS.2 props (fal.ai `fal-ai/trellis-2`, image → 3D) loaded as `asset(asset="model:…")` and dressed into a set at real size.Open and play →interstellar6 scenesGITHUB · INTERSTELLAR — "Every giant leap started the same way." 61.6 s, six scenes, after Interstellar. Every scene opens dark and is lit by what happens on a screen: a commit wakes a farmhouse, green checks throw floodlights on, a merge docks the Endurance and brings the sun upOpen and play →mise-still1 sceneMISE STILL — a static frame of the Mise kitchen (promos/new/mise) framed like refs/target.png, an ultra-real image made from one of its frames. The baseline for realism work: change the light, materials and post here, render it, and compare with the target, without touching the pOpen and play →openreel7 scenesREFERENCE — a complete 60 s modeled-3D promo, the quality bar for a promo built from generated props (read it in parts). Its models, media and voice-over live with the original promo, not here: this copy is for reading how it is built, never for pasting.Open and play →outros6 scenesmulti-style — ONE metal iPhone MATCH-MOVES through four differently-styled animated key-art scenes (fullscreen 1920x1080, ~31s; textures render natively at 1920x1080 — the original portrait layout sits uniform-scaled x0.75 as a centered 810px column that overlays the old portraitOpen and play →pastelink5 scenesREFERENCE — a complete 31.5 s multi-device promo: a website that comes apart and rebuilds as the set, with laptop, iphone, ipad and a browser screen on one desk (read it in parts). Copied from promos/new/pastelink; its models, media and voice-over live with the original promo, noOpen and play →picked-market10 scenesREFERENCE — a complete 60 s modeled-3D promo set OUTDOORS, the exterior counterpart to openreel: ground, horizon and sky from a grounded HDR dome, the sun as the key, real-world scale past the set. Read it in parts. Its models, media and voice-over live with the original promo, nOpen and play →podium4 scenesPODIUM — four brand stages on one podium (ports of the three.js stage kit: astra / nexora / lumen / verde). Scale: 1 kit unit = 100 mm. Podium top r=205 mm at y=54; camera 1200 mm back, eye 210, look_at (0 235 0), fov 42 (verde: 740 back, eye 155, look_at (0 180 0), fov 34). MousOpen and play →posters10 scenesPOSTERS — ten static portrait key-art frames, primitives only.Open and play →realism.abstract1 sceneRealism · ABSTRACT — the realism.promo premium shot (the device family and the house sphere standing on a mirror floor, framed shot by shot) restaged in the abstract reel's grammar. SAME CONTENT: the same lineup, the same live screens and copy, the same frame(smooth) shot programOpen and play →realism1 sceneRealism — a premium product shot built from authoring alone: a mirror floor at y=0 with a device family (imac, laptop, ipad, iphone) and the house gradient-glass sphere standing on it, every realism lever ON.Open and play →realism2.abstract21 scenesRealism 2 · ABSTRACT — the twenty-one realism2.promo studies restaged in the abstract reel's grammar. SAME CONTENT, scene for scene: the same flow containers (row · column · isle · stack · wheel · grid · word-cloud), the same devices and flex screens, the same copy, the same cameOpen and play →realism222 scenesRealism 2 — twenty more realism studies on the realism.promo kit (the scene list lives in scene-ideas.md; every idea from that file, in order). Same levers as realism.promo scene 1: renderer(shadow_map) + authored shadow cameras, mirror reflector-ground, HDR environments with steOpen and play →
Sfx
1 rigShapes
3 rigsicons7 scenesICONS — "Name the outline." Seven scenes on one attribute: <icon extrude="…">. The companion to shapes.pug: that reel authors its silhouettes by hand as <path d="…">, this one NAMES them out of the 5093 vendored Tabler icons and gets the same kind of mesh. One shield carries the Open and play →paths18 scenesPath primitives — every way to write `<path d="…">`, then every way to MOVE one. Three matched haze lobes (hz0..hz2) ride every scene so `transition=match-move` carries the backdrop across each cut.Open and play →shapes7 scenesPRIMITIVES — "Author the outline." Seven scenes on one tag: <path d="…">. One shield carries the whole reel.Open and play →
Tagspath3d
Static
1 rigTerrain
2 rigsterrain-bands3 scenesPRIMITIVES — "One ground, three worlds." Three scenes on one tag: <heightfield>. A seeded-fBm plane is terrain, mountains and sea depending on two numbers — amplitude and ridged — and on the material you hang on it.Open and play →terrain3 scenesPRIMITIVES — "One ground, three worlds." Three scenes on one tag: <heightfield>. A seeded-fBm plane is terrain, mountains and sea depending on two numbers — amplitude and ridged — and on the material you hang on it.Open and play →
Tagscolors
Text3d
1 rigTonemapping
1 rigUis
28 rigsapp-tour9 scenesAPP-TOUR primitives — how a promo POINTS AT one thing on a screen.Open and play →charts7 scenesCHARTS — primitive showcase. Every chart element in the kit, five scenes, five layouts, every native content animation.Open and play →amazon3 scenesAMAZON — a real app-store ad screenshot, rebuilt, then given the one move the screenshot was always implying.Open and play →expand-input13 scenesEXPAND-INPUT primitives — thirteen scenes on the one thing an input does that no still can fake: it RECEIVES something, and then it changes size.Open and play →deepseek-flex1 sceneOpen and play →flex-vs-abs3 scenesflex-vs-abs — A/B harness for the habits-2 "One portable canvas" card. Both sides paint the SAME composition; only the way it is authored differs. Left: absolute pixels — every x/y/w/h baked from the flex result at THAT container size. Right: the flex grammar (layout/gap/padding/Open and play →glass-ui-atlas20 scenesOpen and play →html-devices10 scenesHTML on devices — ten product shots, every screen a REAL HTML page.Open and play →html-engraved10 scenesHTML UIs ENGRAVED into device glass — the html-devices reel, re-lit.Open and play →html-fly10 scenesHTML flying out of devices — ten html3d choreographies.Open and play →html-maps30 scenesHTML → every material map. Thirty scenes, one map (or one combo) each, always the SAME dashboard page so the maps compare like for like.Open and play →html-relief5 scenesHTML as relief — the page becomes a HEIGHT MAP.Open and play →html10 scenesHTML primitives — REAL HTML + CSS as a promo stage, one trial per scene.Open and play →screen-corners4 scenesUIS · SCREEN CORNERS — how a ui3d(overlay=screen) card meets each device's rounded glass. The overlay is a flat plane the engine does NOT mask to the glass, so a square full-screen card shows its corners past the bezel. Every full-screen card on a screen (the root and any full-blOpen and play →scrolling10 scenesScrolling primitives — every way content MOVES INSIDE A VIEWPORT, one scenario per scene. The subject is the `scroll` / `carousel-scroll` track and the overflow mask that makes it read: a container whose subtree scrolls becomes a clip box (CSS `overflow: hidden`), so content tallOpen and play →transparent-ui7 scenesTransparent UI primitives — a floating chat bubble with NOTHING behind it.Open and play →ui-devices10 scenesUI on devices — ten product shots, every screen a REAL ui stage.Open and play →ui-engraved10 scenesUI ENGRAVED into device glass — the ui-devices reel, re-lit.Open and play →ui-fly10 scenesUI flying out of devices — ten ui3d overlay choreographies.Open and play →ui-maps30 scenesUI → every material map. Thirty scenes, one map (or one combo) each, always the SAME dashboard so the maps compare like for like.Open and play →ui-relay15 scenesOpen and play →ui-relief5 scenesUI as relief — the stage becomes a HEIGHT MAP.Open and play →ui10 scenesUI primitives — the ui component vocabulary as a promo stage, one trial per scene. The twin of html.promo: the same ten beats, built from ui components instead of markup.Open and play →ui-ui3d23 scenesui vs ui3d — the SAME surface twice, side by side, in millimetres.Open and play →ui3d20 scenesui3d primitives — the UI as REAL geometry. The companion to uis.promo: that file is about how a ui surface gets BUILT; this one is about where a ui3d surface LIVES. Two idioms, one grammar:Open and play →uis12 scenesUI primitives — every way a ui()/ui3d() surface gets BUILT, one scene each. The subject is the entrance choreography itself: each scene assembles one UI from a different family of moves, so this file doubles as the animation vocabulary for smart UIs.Open and play →videos9 scenesVideo primitives — `video` as a UI item, one idea per scene.Open and play →youtube-devices1 sceneYouTube on four screens — paused, then played, one device at a time.Open and play →