Bones, weights and reach, in plain words.
Rig a 2D drawing in your browser, nothing uploaded: bones, binding and weights, meshes, constraints such as IK, trim paths and clipping, in plain words.
By Suraj Kumar8 min read
Rigging sounds like a job for a studio. It is a handful of ideas: bones, what follows them and by how much, and a few rules between parts. Here they are in plain words, each with the place to try it in KeepSimp's Animation maker, which runs in your browser with nothing uploaded.
A rig is a skeleton and its rules.
A rig is what makes a drawing move like one thing rather than a pile of shapes. It has a skeleton of bones, the parts of the drawing bound to them, and rules that tie parts together: this hand reaches for that cup, this eye stays inside its head.
Once a drawing is rigged, you animate the rig, setting keys on a few bones and targets, and the drawing follows. The 2D skeletal animation page opens on a character that is rigged already.
Bones.
A bone is a line with a joint at its start, joined to the bone before it in a chain. Turn a bone and every bone after it turns too. The Bone tool draws a chain: each click adds a bone.
A part put inside a bone moves with it as a whole, without bending, which suits a head, a hat or a hand drawn as one shape.
Binding and weights.
A part that bends, such as an arm or a tail, is bound to bones instead. Each of its points then follows up to four bones, and a weight says how much each one moves it. A point at the wrist may follow the forearm alone; a point at the elbow, the upper arm and the forearm half each, so the bend is smooth instead of folded.
The Animation maker makes the weights when you bind. Where a bend looks wrong, paint a bone's weight more or less on the points around it.
Meshes, for pictures that bend.
A picture has no points to follow a bone, so it is given a mesh: a net of triangles made from its outline. The picture is drawn stretched over the net, and when the net's points move, it bends.
A mesh's points can follow bones, by weights as a path's do, or be moved by keys of their own, for a flag that waves or a face that squashes.
Constraints: rules between parts.
Reach, known as inverse kinematics or IK, turns the bones of a chain so that its end touches a target. Two bones, an upper arm and a forearm, are solved exactly, bending either way. Longer chains, up to four bones, bend each joint in turn towards the target, the way Rive's runtime solves them, so a .riv file moves exactly as the editor shows it.
Distance keeps a part at most, at least or exactly so far from another. Copy takes another part's position, turn or size, in the world or in its own space, with an offset and limits. Follow a path moves a part along a path's outline.
Each constraint has a strength from none to full that can be keyed, so a hand can hold a cup for a while and then let it go.
Trim paths and clipping.
A trim draws only part of an outline, from a start to an end along it. Key the end from nothing to all of it, and a line draws itself, as a signature or a route on a map does.
Clipping shows a part only inside another shape, such as eyes that stay inside a head when they look about, or only outside it, to cut a hole.
Which files keep a rig.
A .riv keeps bones, bindings, meshes, constraints, trims and clipping as Rive's runtime plays them, and says what it cannot hold. Rive's own runtime reads it back before it is offered.
A Lottie, an animated SVG, a video or a GIF has no bones: the rig's movement is written into it frame by frame, and the result says so. A picture bent by a mesh cannot bend in a Lottie, so it stays whole there, which is said as well.
Further reading
- Rive: Bones (opens in a new tab)
- Rive: Meshes (opens in a new tab)
- Rive: Constraints overview (opens in a new tab)
- Rive: IK constraint (opens in a new tab)
- Rive: Distance constraint (opens in a new tab)
- Rive: Trim path (opens in a new tab)
- Rive: Clipping (opens in a new tab)
- Wikipedia: Skeletal animation (opens in a new tab)
- Wikipedia: Inverse kinematics (opens in a new tab)
Topics: 2d rigging · what is rigging · bone weights · ik constraint · mesh deformation · trim path animation · clipping mask animation
A little less theory. A little more doing.
Try it on your own terms, with a free browser tool.
Try the tool