The Nature of Games

The Game Loop and the Canvas

An animated sketch updates its state and draws a new frame repeatedly. For this book, p5.js calls a draw() function while the sketch runs. We will use it to clear a canvas, update a dot's position, and draw the dot again. The loop is a useful model for a small game, though larger games may organize updates and rendering into separate systems.

An excerpt from the working manuscript. Read the illustrated pages or download the complete sample chapter.