Skeletal animation & blending

Inspect the relationship#

Scrub an actual joint hierarchy, combine two clips, and inspect weighted mesh deformation.

INTERACTIVE ILLUSTRATIONSIMULATION / BROWSER

Two clips. One continuous pose. This illustration uses canvas. The explanation below describes the same process.

Change a control to inspect the result. Values describe the simulation, not native engine benchmarks. Open full lab ↗

Try these experiments#

Pause at normalized time 0.25. Change blend from zero to one and inspect arms and legs without a changing timeline.
Turn bones off. The weighted mesh still deforms because the pose drives its vertices.
Turn wireframe skin on to see the segment vertices and their blended deformation.
Play at different speeds, then use Step for a repeatable small timeline increment.

What the illustration calculates#

Two periodic planar clips produce local joint angles. The blend interpolates those local angles. Parent-before-child accumulation creates fifteen world-in-model joint poses. Skinning transforms each bind-space vertex relative to its influencing joints and blends the results with weights that sum to one. This is a two-dimensional rig to make the hierarchy readable. Native three-dimensional clips use translation/scale tracks and normalized quaternion interpolation, including hemisphere handling. The lab does not claim Euler-angle blending is a general replacement for that rotation math.

Connect it to the native animation pipeline#

SkeletonAsset owns parent relationships and inverse bind data. AnimationClip owns keyframes. AnimationSystem owns playback/state and evaluated poses. Renderer uploads the resulting bone palette into storage retained through GPU completion. The vertex shader uses joint indices and weights to deform the mesh before applying the entity world transform.

Skinning with row-vector matrices

text · REFERENCE EXCERPT

boneGlobal = boneLocal * parentGlobal
skinMatrix = inverseBind * boneGlobal
skinnedPosition = sum(weight[i] * position * skinMatrix[i])

A zero-weight vertex needs an importer fallback, and every joint index must be validated. Matrix storage and multiplication conventions must match across importer, CPU evaluation, and shader.

What to inspect when it is wrong#

Start with a known bind pose and a matching palette. Exploding geometry points to joint indices or inverse-bind/matrix conventions. Foot sliding points to phase/root motion. Incorrect bounds can hide moving limbs even when the skinning itself is correct. Events must follow time crossings rather than firing whenever the same frame is sampled. Read the full animation system for state machines, root motion, morph targets, IK, and C++/HLSL data flow.