An interactive primer

How a picture gets made

Rendering is the journey from numbers to pixels — and at almost every step, a small choice decides whether the result looks right or subtly wrong. This is a set of short, hands-on lessons for seeing those choices.

You don't need any background. Each lesson is a live picture with a few knobs. The fastest way to understand a concept here is to break it — flip a switch the wrong way and watch the artifact appear, then flip it back and watch it heal. That contrast is the whole point.

  1. Play with every control. Nothing here can be broken for real.
  2. Look for the "wrong" setting. Most lessons have one — find the ugly version first, then the fix.
  3. Read the caption after, not before. Trust your eyes, then let the words name what you saw.

Lesson 01

Gamma encoding

Screens don't treat brightness the way math does. Halfway between black and white isn't the number you'd expect — and if you blend colors without accounting for that, the middle goes muddy.

Try this: the strip fades one color into another. Switch the blend space from linear to encoded and watch the middle of the fade turn dull and dark. Then turn on the gray proof to see why.

Lesson 02

Texture sampling

A picture pinned to a surface almost never lines up one dot to one pixel, and the fix is two separate jobs with two separate knobs. The magnification filter handles up close, where one dot of the picture is spread across many pixels (blocky vs. blurry). The minification filter handles far away, where a whole crowd of dots has to collapse into a single pixel (clean vs. a shimmering mess).

Try this: the floor runs off to the horizon. Set Minification to Trilinear — the distance is calm. Switch it to Bilinear, no mips and watch the far floor crawl and sparkle (the far squares fighting over one pixel); notice Magnification does nothing to that. Now flip to the 2D flat view, zoom in, and work the Magnification knob instead: Nearest gives hard blocky squares, Linear smears them into a blur.