01 3D → image plane Explanatory geometry · custom WebGL
Gold vertex → projection plane → camera
Glass shown as a geometry proxy in this view
Glass shown as a geometry proxy in this view
3D motion becomes 2D keys.
A turning cube, a circle that becomes an ellipse, a textured receiver, and a glass ball. Different parts need different kinds of authored data.
02 The exported animation Official Rive WebGL2 runtime · ordinary Rive 7
Vector keys + image mesh + 240 sampled glass appearances · 60 fps
03 Inspect the authored tracks
Dots are authored keys. Click either chart to scrub; the gold vertex is the same one in both views.
Match colored guides to real file data. Click a curve to scrub.
Different drawings, different keys.
Loading the ordinary Rive animation…
Original vector-only cube · 175 KBCurrent visibility is saved. Disabled images stay packaged; toggling is not size optimization.
04 · THE APPEARANCE BUDGET
Compute the glass. Or store its history.
The same projected sphere makes the tradeoff visible. Change its refractive index live; open the baked file as a stack of actual image poses. The original Rive export above stays exactly what it claims to be.
LIVE Refraction is a function Browser WebGL study · suitable for a retained shader pipeline
Ray–sphere entry / exit · Fresnel · RGB dispersion
GPU Canvas can evaluate this kind of shading inside a signed .riv; RIVX can retain it with the host scene. This panel runs WebGL in the page, not inside the ordinary .riv above. n₁ sin θ₁ = n₂ sin θ₂ · τ = Σ nᵢ ℓᵢ / c
The 73 displayed photon paths refract through the live spheres, with optical length n × distance inside glass. They are a geometry/time diagnostic, not a converged medium renderer. The floor caustic remains the original fixed bake.
BAKED Refraction becomes a time volume Actual .riv images + optional live layers · every fourth pose shown
Drag to orbit the stack · gold plane = authored image time
Shared live clock: every image pose displays the same optical gate.
Gold = selected pose. The orbit range selects stored poses; the optical window above gates transport within each pose. With Sweep pulse through history, each pose gets its own optical gate relative to the selected pose. This is an explicit inspection-time mapping, not flight time stored in the image bake. IOR, grid and second-body edits update the live response overlay and rays on both sides. The stored pixels remain unchanged. The complete file has 240 images at 60 fps; this inspection stack shows 60 reduced thumbnails in a shared fixed crop. The original cube and vector-only styles remain separate downloads.
Ordinary Rive needs no shader to play this fixed appearance history. Camera, material and lighting are already baked. The volume is a browser inspection tool made from the file’s embedded pixels. Optional response and ray overlays are computed separately and share the live controls; they are not newly baked frames. Its depth axis is authored orbit time, not optical flight time; it is not retained 3D hidden in the .riv. This connects the space–time study to a concrete export budget.
Geometry becomes ordinary tracks.
The four-second orbit has 60 fps keys and a matching loop endpoint. A 3D circle’s 48 contour points are projected independently: the outline really moves and changes shape. Rive interpolates their ordinary 2D vertex properties. The receiver is an image on a 6 × 6 keyed mesh, which approximates perspective texture mapping.
Choose a layer’s tracks above. Cube and circle marker positions are read back from the actual Rive nodes; the other charts show the values authored into the file. The sticker’s color cycle is an artistic foil effect, not a diffraction simulation. Schematic edges stay visible through the surfaces.
Appearance needs a different budget.
The glass uses 240 cropped, embedded image poses, one per frame on the 60 fps timeline. They were rendered for this exact cube, camera and receiver using ray–sphere intersection, refraction, a reflected branch and mild RGB dispersion. This is 60 fps sampled appearance; it cannot relight or respond to an arbitrary camera. Higher internal reflections are omitted.
The floor caustic is a fixed, filtered photon bake through the sphere. Hiding the sphere does not undo that bake. All playback at right is owned by the official Rive runtime; no live 3D shading runs inside the downloaded file. Compare the separate 600-angle native scene export for a larger authored orbit.
Back to Rive. Then change the drawing.
The projection has become editable 2D geometry. Engraved contours use a keyed ellipse group and curved hatch strokes; Cut-paper tones use nested flat fills. The receiver becomes keyed paths and a graphic caustic accent. These are ordinary Rive shapes and paints, not an image filter or a GPU Canvas shader.
Both vector files retain the same four-second orbit and layer controls, contain zero images and zero scripts, and download as ordinary .riv animations. The sphere’s contour still moves and changes shape, while its ink or paper drawing replaces the baked refraction. This is a new visual language for the projected scene; it does not recover lighting or hidden geometry from the bake.