HyperFrames v0.8.135
By Steven Van ·
The Three.js guide explains how to prevent objects appearing before camera cuts and keep unlit mesh surfaces from rendering black.
The Three.js adapter guidance in HyperFrames now explains how to coordinate camera cuts within one canvas and light meshes that would otherwise appear as black cutouts. The documentation update is included in v0.8.135.
Keep camera cuts and visibility in sync
The guidance recommends declaring each cut time once, then using that constant in both the camera’s shot selector and each object’s visibility window. Separate timing values can make the next shot’s objects appear before the camera switches, causing a brief pop-in that a single still from each shot can miss.
Check the last frame before each cut and the first frame after it. For a cut at 23 seconds in a 30 fps render, the guide gives the snapshot command npx hyperframes snapshot --at 22.9667,23 --no-end.
Add fill light to lit meshes
A MeshStandardMaterial illuminated by a single point or directional light can appear as a flat black cutout when the camera sees its unlit side. The guide recommends adding fill light, such as a HemisphereLight using the surrounding glow’s colors, to represent bounced light.
If the key light changes brightness over time, drive both lights from the same source at a fixed ratio, tuned by eye. Their intensity units differ, so the fill should not simply copy the key light’s intensity value.