2D & 3D Transformations

Homogeneous coordinate system math for scaling, translation, rotation, and shear matrices.

Homogeneous Coordinates

To combine translation (addition) with linear mappings like scaling and rotation (multiplication) into a single matrix, computer graphics uses homogeneous coordinates:

  • 2D vectors are represented as $[x, y, 1]^T$ using $3 \times 3$ matrices.
  • 3D vectors are represented as $[x, y, z, 1]^T$ using $4 \times 4$ matrices.

Composite Operations

Matrix multiplication is non-commutative ($A \cdot B \neq B \cdot A$), meaning the order of operations matters. In column-major order (standard OpenGL): $$P' = T \cdot R \cdot S \cdot P$$ Apply scaling ($S$) first, rotation ($R$) second, and translation ($T$) last.

Ready to Visualize Matrix Math?

Launch our interactive visualizer to step through calculations in real-time.

Launch Transformations Visualizer →