Loopers

Examples
1

Click here to view this code in the p5 editor.

This is a companion discussion topic for the original entry at https://happycoding.io/examples/p5js/creating-classes/loopers
1 Like
2

Tangled color fun. What makes the tail fade away?

1 Like
3

Thanks! And good question. All of the magic happens in this line of code at the top of the draw() function:

background(32, 3);

The draw() function is called 60 times per second, and this line of code draws a dark gray (32 on a scale of 0-255) background on top of the previous frame. The trick is that the 3 is the opacity, so the background is mostly transparent. That means the previous frames show through the background, and only after a few frames does the gray add up enough to actually hide what was drawn in the previous frames.

I’m not explaining that very well, but to see what I mean, try removing that line altogether, or changing the 3 to a different number.

I use a line like that pretty often, because it’s one of the easiest ways to take a program like this to the next level. It looks really cool and like you’re doing complicated things, when in reality all you’re doing is slapping on a thin layer of paint.

1 Like
4

Oooh, love it! Thanks for explaining the magic.

1 Like