Glass Product Render 玻璃质感产品

Aura — Hear the Light·32s·Lemo-Opuscarby Lemomo

Launch-film product rendering in transparent and frosted glass: a dark-field studio, strip-light sweeps, dispersion, caustics, light travelling inside the object, slow exploded views that snap shut on a downbeat.

The demo: Unboxing and close-ups of Aura, fictional glass earbuds, in strip-light sweeps and caustics.

Product launchesConsumer techBeauty
Style prompt · STYLE.md

Launch-film product rendering in transparent and frosted glass: a dark-field studio, strip-light sweeps, dispersion, caustics, light travelling inside the object, slow exploded views that snap shut on a downbeat. References (grammar only): premium launch films (a sweep drawing a contour in the dark, slow orbits, macro rack focus, cuts on the beat, ultra-thin wide type); transparent-hardware adverts (internals as ornament, exploded views, black and white plus one accent); dark-field glass photography. Copy none of their silhouettes, typefaces, sounds or colour templates, and never name them in the film.

1. Essence, and what it is not

A single hero object of glass, metal and light floating in an infinite black studio. Long strips behind and beside it turn clear glass into a thin white outline with rainbow edges; the internals show through as in a display case. Everything moves slowly and precisely; every cut, sweep and pulse lands on the beat.

The object is always fictional. Never reproduce a real product silhouette (a famous phone or headphone outline), a real brand name, logo, typeface or UI.

Not a white-cyclorama catalogue shot, not a wireframe HUD, not a keynote slide: material and light are the subject.

2. Materials & rendering

  • Studio = a strip-light scene, not an HDRI. Photo-studio HDRIs contain windows and clutter that print as messy streaks on glass. Build a tiny black scene of emissive planes and bake it to PMREM every frame (pmrem.fromScene(env, 0, 1, 1000), dispose the previous RT): tall side strips behind (silhouette), a wide far strip (horizon rim), a soft top box (volume for frosted glass and metal), a weak front card (off when concave glass faces camera), a top-front key only when parts must be read one by one, an accent card driven by the pulses, and the sweep: a tall strip on an arc behind the camera (azimuth = camera + π). Being real geometry, its highlight, refraction and dispersion move physically; never paint a 2D highlight.
  • Clear glass: MeshPhysicalMaterial, transmission 1, roughness ≈ 0.015, IOR ≈ 1.5, thickness sets lensing (thicker = stronger), dispersion on (three r163+), near-neutral attenuation, side: DoubleSide so other glass sees its back faces.
  • Frosted glass: transmission ~0.85, roughness ~0.4, milky tint, thick. On black it reads as dark grey plastic unless something bright is behind or inside it: an opaque emissive shape inside (blurred into a soft internal glow) and/or a bright gradient behind.
  • Metals make transparency worth looking at: satin bands, chrome (roughness ≥ ~0.14), brushed surfaces via a roughness map, boards with gold traces. Anything inside transmissive glass must be opaque (only opaque objects reach the transmission buffer).
  • Light guides: dark polished opaque acrylic, clearcoat, emissive comet pulses along a UV axis via onBeforeCompile (Gaussian head, exponential tail, white-hot core, hue drifting with age). Idle emission ≈ 0.
  • Background: black with an optional dark-grey radial sweep that separates glass edges; the floor fades into it, no horizon line. Floor: black gloss, blurred mirror, radial fade, procedural caustics (lens ring with R/G/B radii offset, warped Voronoi filaments, rings spreading from events).
  • Post: 2× supersampling; physical DoF (shallow macro, deep exploded views); bloom only above ~1.1; Neutral tone mapping (AgX washes accents to white); grain 0. Model in mm, near plane 1.

3. Colour logic

  • The world is neutral: black, greys, the white of strip reflections, the metals' own tints.
  • One accent colour family, reserved for light (emission, caustic rings, the dispersion line on UI), optionally drifting between two neighbouring hues with age or energy. Examples: ice blue → soft violet; amber → rose; green → cyan. Pick it from what the product does, never from a brand.
  • Emitters that only illuminate (inside frosted glass) stay cool-white and dim.
  • Dispersion rainbows are allowed only at thick glass edges and in the caustic, never as a gradient on surfaces or type.

4. Type & subtitles

  • Subtitles are a slab of frosted glass: a centred rounded bar filled with the live frame blurred (filter: blur() brightness() on the WebGL canvas, preserveDrawingBuffer: true), a little cool white, a thin highlight stroke and an accent line on top. A licence-free grotesk (e.g. Inter Tight), light weight, ~36–44 px, near-white. Hold ≥ max(1.8 s, speech + 0.6 s).
  • Titles: the same grotesk at an ultra-thin weight (200), very large (100–140 px) with very wide tracking, centred in the upper third; a diagonal glint sweeps across the letters in sync with the sweep light on the object. Small tracked caps (18–20 px) for kickers and credits.
  • The product name and slogan are title cards, not subtitle lines.

5. Motion quality

  • Everything moves on ones (24 fps), eased: ease-in-out for camera orbits, ease-out for parts decelerating into a float, ease-in for a snap back.
  • The camera always drifts: slow orbits or push-ins; never a locked-off frame, never handheld, except a couple of frames of micro-shake on an impact.
  • Exploded view: parts spread along the axis (~2× product size), each with a small deterministic tilt and a spin proportional to its offset; long ease-out apart → short drifting hover → very short ease-in snap on a downbeat.
  • Objects lift out of cradles tilted toward camera and settle upright; lids hinge at the back and stand behind the object as a backlit halo.
  • Light pulses and sweeps are events on the beat grid, not free animation.

6. Camera grammar

A vocabulary, not a route. Opening and ending come from the topic.

Move Expresses Can serve
Sweep over a dark object, slow push Contour before content an unknown thing; a before-state
Slow high 3/4 orbit The whole object in one move a mechanism opening; variants
Macro, rack focus surface → part inside Nothing to hide an ingredient; a sensor
Side macro orbit Material contrast layers; a seam
Exploded view, axis ~40° to view, orbit Technical beauty, suspension architecture; a pause before a turn
Straight-on front, slight push Declaration a single number; a name
Top-down macro A pattern at full size channels; a circuit
Top-down on the floor The effect leaving the object range; spreading energy
Low orbit under the object Monument, weight durability; a flagship
Slow pull-back into negative space Room for type a claim; a question

Framing: one hero, centred or on a strong diagonal, never cropped by the frame edge in a wide. Cut only on beats (bar lines where possible). Product films need no spatial continuity between shots: each shot is its own presentation stage, so hide or move anything that doesn't serve it. Transitions are cuts on the beat or a sweep passing through black; never dissolves or wipes.

7. Sound palette

  • Minimal electronic, never piano-and-strings. Timbres, as options: bowed-glass or wet-finger tones, granular crystal clouds, glass bells and FM glass plucks, a filtered tick grid for precision, a warm pad, sub drone, soft short kicks and claps, 808 bass (sine with pitch envelope, soft saturation, slides), noise and saw risers, a high glass ding. Minor and modal colours suit the dark studio.
  • Lock every pulse, sweep and snap to the score: write the cue map first and share one hit list between the score and the renderer; light pulses may follow a syncopated bass pattern exactly.
  • Silence as a tool: a short stretch of total silence (reverb tails cut too) before a release, at most a reverse whoosh inside it.
  • Foley follows the material: glass shimmer for sweeps (band-passed noise + inharmonic partials, panned with the strip); glass-metal friction for moving covers; magnetic clicks (sub-2 ms transient + 3–5 kHz metal resonances + low thump); air puffs for moving parts; a snap = a cluster of clicks ms apart + an inharmonic glass chord (partials ×2.76, ×5.4); glass-on-glass ticks.
  • Voice: restrained, low, launch-like, very few very short lines. Never a product name alone (ASR and viewers mishear it): give it a verb.
  • Mix: duck music ~12 dB and foley ~6 dB under the voice; limit the biggest bass peaks ~3 dB so loudnorm stays linear; −14 LUFS; grain 0.

8. Native moves

A menu: use the ones your story needs. Adapting any topic: find the invisible thing the product does and make it visible as light inside glass.

  • Transparency. The inside is the hero; rack focus from the shell to the part within. Fits content like: a juicer's blades; a watch movement; a supplement capsule's layers.
  • Lensing. A thick glass dome magnifies and bends what is behind it; macro through it feels like looking into a jewel. Fits content like: a camera module; a magnifying tool; a water filter.
  • Dispersion. A sweep crossing a thick edge becomes a moving spectrum. Fits content like: a prism lamp; a display's colour range; a skincare bottle.
  • Light that travels inside. Energy (charge, data, heat, sound) runs as light through channels. Fits content like: a battery filling; a router's data threads; a kettle heating.
  • Caustics. An internal pulse becomes a ring spreading over the floor. Fits content like: a speaker's range; a perfume's trail; a wireless charger's field.
  • Exploded view and snap. Parts float apart and snap back on a downbeat. Fits content like: a modular backpack; a pen's refill system; a repairable phone.
  • Frost to clear. A frosted shell clears (roughness and tint animate to zero) and the inside appears. Fits content like: a privacy feature; a fridge's contents; an honest price breakdown.

9. Pitfalls of the medium

  • A manually updated mirror uses last frame's camera → call scene.updateMatrixWorld(); camera.updateMatrixWorld() first; the transmission pre-pass re-renders it → no-op its onBeforeRender, update once per frame.
  • A coloured emitter inside frosted glass tints the whole object; idle glow under a lens dome becomes a pale blob; AgX turns accents white; frosted glass on black is black; mirror chrome becomes a white disc → the rules in §2–§3.
  • An exploded view seen perpendicular to its axis is edge-on lines → axis ~40° to camera.
  • Pure profiles read as simple shapes (mushrooms, pot lids) → 3/4 views, lids upright behind.
  • Bass peaks without headroom push loudnorm into dynamic mode → limit them in the mix.
  • Concave glass facing camera prints the front card as a grey rectangle → card off.

10. Engine

In demo/: studio.js (strip env baked per frame, sweep, background, floor mirror + caustics + rings), product.js (glass / frosted / metal / guide materials, comet-pulse shader, explode()), main.js (staging, cameras, frosted subtitle bar, title glint), story.js (beat-grid timeline shared with the score), music/score.py, mix.py (foley + voice + ducking). New object: replace the geometry in product.js (e.g. a glass cylinder with a coiled light guide), keep materials and studio.js.

11. Variation space

You decide the object (always fictional), internals, accent, structure, opening, ending, camera path, pacing and music. All far from our demo:

  • Structures: a line-up (three variants compared by what glows inside); a day in light (one object through morning, noon and night, the strip kit rotating around it); material stack (one layer removed per beat until the core stands alone).
  • Openings: inside first (one internal part; the shell forms around it); caustic first (light on the floor, followed up to the object); silhouettes (several dark outlines; one begins to glow).
  • Endings: floor only (the object leaves, its caustic keeps pulsing); cool down (emission fades to bare strip outlines); held macro (no pull-back; one detail, the name small).

How our demo was made (story, shots, score, end card, build): DEMO.md. Read it after your treatment exists.

Director's notes for the demo film

One example among many. Don't reuse its story, arc, shots, props or timings.

Demo: Aura — Hear the Light (32 s) · glass-product.mp4 · source in demo/

Story & structure

A fictional pair of stemless, lens-shaped glass earbuds in a pebble-shaped glass case. In the dark they only reflect other people's light; taken apart and snapped back together on the bass drop, they light up from inside: sound becomes light running inside the glass. Theme: transparency = nothing to hide; sound = light.

The invisible thing made visible: sound as light pulses in the light guide. (The same move for other products: a battery → charge fills a glass cell; a watch → time as a light ring; a router → data as light threads; a perfume → scent as caustics.)

Arc (30–40 s): lit from outside in the dark (mystery) → opened (curiosity) → seen through (intimacy, macro) → taken apart (suspension, total silence) → snaps together on the drop and lights up from inside (release) → confident rhythm → returns home (settle, echo). One object, one goal (to emit its own light), one turn (reassembly).

Bookend: it opens with a light sweep revealing the dark object and ends with the same sweep over the object that now glows by itself; the two earbuds drop back into their cradles (magnetic click) and the frosted base of the case glows as if charging.

In the old guide the demo's rule was "use at least four of the six native powers"; the demo spent all six (transparency, lensing, dispersion, light inside, caustics, exploded view).

Shots

Beat Camera Why
Open (0–4 s) Low 3/4 side, very slow push, ambient near zero; two sweeps Only contours, no content: curiosity. Grab within 3 s.
Reveal structure High 3/4, slow 40° orbit while the lid opens Explain the object in one move
Macro 25–45 mm away, rack focus from the glass surface to the part inside; a short sweep on every beat Pulls the viewer into the glass
Profile Side macro orbit Material contrasts: clear / metal band / frosted / soft tip
Exploded view 3/4, axis at ~40° to the view so parts form a diagonal with depth (near big, far small), spanning ~80 % of frame, slow orbit for parallax Technical beauty; parallax sells the depth
Hero front Straight on, slight push Declaration: the light ring complete
Pattern macro Top-down macro on the light channels The concept at maximum size
Pair Medium two-shot, second earbud flies in on a downbeat Stereo = left/right alternation
Caustics High top-down on the floor The most memorable shot: sound spreading over the ground
Hero end Low 3/4, centred under the title, slow pull-back that makes room for credits Name + slogan + product

The exploded shot was extended to 17.0 s so the parts rush back, snap at 16.0 and the light pattern first lights up in the same frame, cause and effect in one camera position, before the cut to the front. Magnetic click back into the cradle at 28.0.

Motion numbers used: camera orbits 0.2–0.4 rad per shot; exploded-part tilts sin(i·1.7)·0.32, cos(i·2.3)·0.28; timing 3 s ease-out apart → 0.75 s hover (drifting +3 %) → 0.25 s ease-in snap exactly on the downbeat of the drop; camera pushes in ~40 % during the 0.9 s after the snap; two frames of micro-shake on the snap. Magnetic lift 1.2–1.4 s (eio). Earbuds hover turned 3/4 toward camera so the lens face and light ring are visible; the lid stands at ~100° behind the case as a backlit halo.

Score structure

Original numpy score (demo/music/score.py), 120 BPM, minor key. Sub drone + glass shimmer for the dark open; FM glass-pluck arpeggio with a low-pass opening over the build; soft short kicks on every beat under the macro sweeps; noise + saw risers over the exploded view; half a bar of total silence (reverb tails cut too) before the drop, with a long reverse whoosh inside it; 808 drop with a syncopated pattern ([0, .75, 1, 1.5] per bar) that the light pulses follow exactly; clap on 2 & 4; a four-note glass-bell motif; a minor-9 pad for the reveal; a high glass ding on the final settle. One kick list shared between the score and the renderer (story.js, cues.json).

Foley as used: shimmer per sweep, lid friction, magnetic clicks, an air puff per exploded part, and on the snap a cluster of six clicks 15 ms apart + the inharmonic glass chord.

Voice: Kokoro am_michael, speed 0.86–0.88, 3–4 very short lines. "Aura." alone was misheard as Laura / Dora, so the line became "Meet Aura." Music ducked −12 dB and foley −6 dB under the voice. The 808 peaks left no headroom and loudnorm fell back to dynamic mode (−13.7 LUFS); limiting the drop peaks ~3 dB in the mix fixed it. Grain 0 in mux.

Palette & props

  • Accent: ice blue #62DCFF → soft violet #A98BFF; everything else neutral.
  • Strip kit (sizes in mm, intensity): left & right tall strips 22×170, ×3.2; horizon strip 260×14, ×1.4; top box 160×70, ×1.1; low front card ×0.18 (0 when the concave case faces camera); top-front key 150×60, ×2.5 for exploded views only; sweep strip 26×240 on an arc ±1.35 rad behind the camera; accent card tinted by the guide colour, driven by the pulses.
  • Clear glass: roughness 0.015, IOR 1.52, thickness 3–4.5, dispersion 5, attenuation #f3f8fb at 160 mm. Frosted glass: transmission 0.82–0.9, roughness 0.4, tint #eef2f5, thickness 7–14, an opaque emissive disc inside.
  • Metals: satin titanium band (rough 0.16), mirror-chrome magnet (0.14; 0.05 blew out to a white disc), brushed steel and a champagne diaphragm with a concentric-brush roughness map, graphite PCB with gold traces.
  • Light guide: polished acrylic #15181b, clearcoat 1; comet pulse head σ = w/2, tail length 4w at 55 %, white-hot core head³ × 0.35, hue blue → violet with age.
  • Background sweep #34383d → #16181b → #000 at 0–1.1; floor Reflector with a 12-tap blur, ×0.32, radial fade.
  • Post: DoF aperture 700–900 for macro, 70 for the exploded view, 160–300 for wides; bloom strength 0.16–0.3 above 1.1; Neutral tone mapping, exposure 1.1. Macro distances 25–45 mm.
  • Subtitle bar: 76 px tall, radius 38, blur(18px) brightness(1.25) + 10 % cool white, 1.2 px gradient stroke, blue → violet top line; Inter Tight 300, 40 px, tracking 1 px; held ≥ 1.9 s and ≥ speech + 0.7 s.
  • Titles: Inter Tight 200, 112–132 px, tracking 56–64 px; kickers 18–20 px, tracking 8–10 ("A GLASS PRODUCT FILM", "MEET").

End card

The title stays; credits (style name, LemoLab × Claude Opus 5.5) fade in at the bottom over a soft dark gradient while the camera pulls back to make room; fade to black in the last 0.6 s. The "LemoLab × Claude Opus 5.5" sign-off belongs to this library's demo only; a user's film carries no LemoLab credit and no copy of this card.

Rights

Product, name and shape are all original. No stemmed earbud, no dot-matrix type, no red accent, no recognisable silhouette or pattern from the reference ads; no fonts, sounds, melodies or colour templates from any launch film. Fonts in demo/fonts, credits in demo/CREDITS.

Build notes

styles/glass-product/demo/
  product.js   earbud + case geometry, glass/metal/guide materials, comet-pulse shader, explode()
  studio.js    strip-light env (PMREM per frame), sweep strip, background sweep, floor mirror + caustics + beat rings
  story.js     120 BPM timeline: shots, kicks, sweeps, VO, SFX events
  main.js      per-shot staging & cameras, light/pulse logic, frosted-glass subtitles, titles, end card
  music/score.py  original numpy score (stems + score.json self-check)
  mix.py       foley synthesis + voice + ducking → mix.wav
  lines.json · subs.py · check_mix.py · build.sh
  1. Write the cue map and story.js first (BPM grid, kick list shared by score and renderer).
  2. node core/render/still.mjs styles/glass-product/demo 9.3 14.6 26.8 [--q nosub=1]: iterate stills; --range 0.5:31.5:1 + sheet.py for overview passes.
  3. .venv/bin/python core/tts/tts.py demo/lines.json demo/voices → core/tts/asr_check.py until all OK.
  4. python demo/music/score.py → node core/render/events.mjs demo → python demo/mix.py.
  5. node core/render/video.mjs demo --fps 24 --workers 3 (768 frames with 2× SSAA, transmission, per-frame PMREM and mirror ≈ 30–45 s on an M-series Mac).
  6. sh core/render/mux.sh out/video24.mp4 mix.wav glass-product.mp4 24 0, then python demo/check_mix.py glass-product.mp4.
  7. Or simply sh styles/glass-product/demo/build.sh.

Pitfalls tied to this demo's props:

  • The cyan light strip first placed inside the frosted case base smeared a teal cast over the whole case; it became a cool-white dim disc.
  • The idle glow of the light ring was magnified by the lens dome into a pale-blue blob.
  • Hovering earbuds seen straight-on read as mushrooms; the lid lying flat behind the case read as a pot lid.
  • The second earbud first rose "from below" through the visible floor; it now flies in from the side.
  • "Aura." alone was misheard by ASR.