rigged

Open the live page · Source

One pair of rats per clip (walk, the two turns, run, idle, sniff, death). In each pair the rat on the green ground is baked: every pose is resampled into voxels on the CPU by bakePose and drawn as an instance of that posed model. The rat on the blue ground is posed on the GPU: one rest model, drawn as a single instance carrying its 26 bone matrices, and the renderer takes each world cell back through every bone's inverse into the rest model.

What it showsCopy Anchor Link

• makeCrowd with rigged: true next to the baked instance path, sharing one makeInstanceLayer: each crowd writes into a small adapter and the page commits both sets together.
• prepareRigged, done inside the crowd: bone ids beside the roles, and the rig's cover applied up front.
• That the two agree: the posed-on-the-GPU rat draws the cells baking writes, plus the joint weld. The baked rat also bridges diagonal gaps and fills joint cracks; look at the knees, the neck and the tail for the difference.

The interesting partCopy Anchor Link

const layer = makeInstanceLayer(renderer);
const collect = () => {
  const c = { ...layer, list: [] as readonly InstancePlacement[], setDynamic(l) { c.list = l; }, commit() {} };
  return c;
};
const leftLayer = collect(), rightLayer = collect();
const baked = makeCrowd({ instances: leftLayer, near: 1e9, freeze: 1e9 });
const posed = makeCrowd({ instances: rightLayer, rigged: true, near: 1e9, freeze: 1e9 });
// per frame:
baked.update(left, cam);
posed.update(right, cam);
layer.setDynamic([...leftLayer.list, ...rightLayer.list]);
layer.commit();

URL optionsCopy Anchor Link

Drag to orbit, wheel or pinch to zoom, right-drag to pan.

The technique follows published research; see Research and credits.