# bleuje

Loops, creative coding.

# Replacement technique (Processing)

### 2020-11-28

This is about a perfect loop technique that’s probably the one I use the most. It’s abstract and general : the idea is to have queue of objects. During the time of one gif loop, each object will take the position or state of a next one. That’s why I call it the “replacement” technique.

Basically we have one function like this one :

And to draw all objects with a perfect loop we do :

K is the number of objects in the queue, I have often used this notation and I keep it in case you see the source code of my older gifs. Here we divide by K assuming p ranges from 0 to 1 in drawThing but that’s not necessary. This works because t starts at 0 and ends at 1, so you reach the next index with (i+t) at the end of the loop.

If drawThing has same state at p=0 and p=1 there is no problem, but if not you might just make objects out of sight at p=0 and p=1 to avoid objects that appear or disappear suddenly.

## An example for the replacement technique

The aim is to make an animation like this one : Here K=130 and the drawThing function draws a single pie.

Let’s choose a color palette from colorhunt.co :

To get the position at parameter p on the spiral one can use those equations :

The sqrt(p) gives us a good parametrization with constant speed.

The idea for the pie design is to use three random values with noise. The ratio between a value and the sum of all values gives us the share of angle of a part.

Here is some code to get random values that change with p :

It’s basically 1D noise. The pow function is there to sometimes have values that are much larger than the others.

Here is the code to draw a single pie at p :

Note that some rotation alpha of constant speed is added. The radius r of the pie varies so that pies appear and then disappear (p=0 and p=1).

The entire code is the following :

And here is a reminder of the result : I often use the replacement technique with object oriented programming, each object having its own queue and random parameters. By using it with a queue for each element of a 2D grid, you can achieve loops like this one : 