Splattie Widget Makes Gaussian Splats Track the Cursor With One HTML Tag

Andres Romero's splattie-widget drops a rigged Gaussian splat into a web page with a single custom element, <splattie-widget src="asset.splattie"> plus a script tag from unpkg, and makes it react to the visitor. Heads track the cursor with their eyes, blink on a randomized timer, and emote on hover and click. Bodies turn their head and torso toward the pointer and pose through two-bone arm IK. Arbitrary objects follow the cursor through sparse linear blend skinning on a custom skeleton. Everything runs client-side at 60fps over WebGL 2.

The widget reads a new .splattie container, a ZIP bundle with a required manifest.json that declares every asset and pins the file's formatVersion to the widget version. Inside sits standard splat data as PLY or SPZ, alongside optional rig files. Heads use a five bone FLAME skeleton (root, neck, jaw, left eye, right eye) with per-splat bone weights and an expression_basis.bin holding FLAME blendshape displacements; bodies carry a 55-joint SMPL-X skeleton with sparse top-K per-Gaussian weights; objects ship an arbitrary joint hierarchy with binary uint16 indices and float16 weights. A states.json defines idle, hover, and click states across five interpolated dimensions with configurable easing per transition.

Splattie is built on Spark 2.0, the MIT licensed World Labs renderer, and leans on a stack of single-image reconstruction work to generate the rigged assets for heads and bodies, and Microsoft's TRELLIS plus Snap Research's Puppeteer for objects and their auto rigged skeletons. The hosted pipeline at splattie.app turns a photo into a bundled asset, and a local visual editor exposes sliders for every state dimension, on-canvas IK drag handles, and a download button.

Learn more on GitHub or through the live demo at afromero.co.