Labs

One idea per lab, with the controls to it.

Everything here runs live in your browser on real WebGL. Drag inside any canvas to orbit the camera.

The Model Matrix

Open →

Move, turn and stretch an object by dragging the numbers that do it, and watch the matrix fill in as you go.

  • translate
  • rotate
  • scale
  • composition order
  • basis vectors

Projection & the Frustum

Open →

See the camera’s frustum as an object in the world, and the picture it produces, side by side.

  • perspective
  • orthographic
  • near / far
  • clip space
  • field of view

Coordinate Spaces

Open →

Follow one vertex from model space to the pixel it lands on, one stage at a time.

  • model space
  • view space
  • clip space
  • NDC
  • viewport

Light & Normals

Open →

Move a light around a surface and watch the shading model respond, term by term.

  • normals
  • lambert
  • specular
  • inverse-transpose