Chapter 00 - Lesson 03

How to Study a Graphics Sketch

Use a repeatable method for reading visual code.

Open full demo View source

Concept explanation

A graphics sketch is easier to understand when you isolate inputs, state, drawing commands, and output. Change one variable at a time and connect the visible change to a code line.

Try it

Use a repeatable method for reading visual code.

Code fragment

for each frame:
  read inputs
  update state
  draw scene

What to observe

  • Controls are inputs.
  • The canvas is output.
  • The code fragment names the rule being studied.

Small challenge

Change one slider in an inline visualizer and write down which code variable it represents.