Translate — move by a vector
The gentlest transform: pick a vector and add it to every point. The shape slides by exactly that vector's coordinates — no turning, no stretching, just a shift. (It's also the one move that nudges the origin off its spot.)
Drag the handle to set the move vector and watch the F slide to meet it.
Scale & flip — stretch each axis
Scaling multiplies coordinates — but the two axes are independent. Stretch x without touching y and the shape gets wide, not bigger; this is a stretch, not a zoom. And push a factor below zero and the axis flips: at exactly −1 you get a clean mirror, the F reversed with no distortion at all.
The faint outline is the original. Try a negative factor.
Rotate — turn about a pivot
Rotation swings every point around a fixed centre by the same angle. Distances to the pivot never change, so nothing stretches — the shape just turns. Here the pivot is the origin (marked); the faint F is where it started.
Sweep the angle and watch the F orbit and turn together.
Shear — slant the grid
The last move slides one axis along the other. A horizontal shear pushes points sideways in proportion to their height, so upright lines lean and squares become parallelograms — yet nothing is stretched, the area stays exactly the same. It's the move that tips an upright font into italics.
Slide the slant; flip between leaning sideways and leaning up.
The transform sandbox
Everything in one window. Stack all five moves on a single shape and watch them combine — the deformed grid shows the map, the matrix on the right is the live recipe (the columns are where î and ĵ end up), and the readout tracks the area scale. The moves apply in a fixed order: scale → shear → rotate → move. Reach for any slider and feel the whole recipe rewrite itself.