Seamless Loops

Sun, 28 Oct 2018 00:00:00 +0000

Using this tutorial in processing, and Golan Levin’s sketch in processing, started to understand how to make seamlessly looping animations. I took Golan’s awesome demo and ported it to p5.js (live demo). This gif made the technique click for me.

The basic idea is think of the random values as locations on a clock face. This gives 1D noise over time (shown in the image above). For 2D you can use 3D noise space and think about a line sweeping through.

Math on anotherjesse.com

Seamless Loops