Lesson 2.1

Variables (and program flow)

Watch Variables in p5.js

Video for 2.1:

Example 2.1.1: The ellipse follows the mouse around the canvas.

Example 2.1.1

Example 2.1.2: In this new example the ellipse again follows the mouse around the canvas, but since the background is called only once the ellipses overlap.

Example 2.1.2

Example 2.1.3: By adding noStroke() it acts like a simple drawing program.

Example 2.1.3

Example 2.1.4: We can clear the drawing by having mousePressed() call background().

Example 2.1.4