Circle Intersection with Perlin Noise in Processing (Interactive)

Simon built a beautiful interactive circle intersection program in Processing, in which the circles detect intersection and change colors (according to Perlin Noise) once it occurs. The player can control the number of circles by adding and removing them in two modes (mouth clicked and mouth dragged). Simon added a button to switch between the two modes. (Loosely based upon Daniel Shiffman’s tutorials on checking object intersection).



Perlin Noise Combined with Sine Wave Translation into Processing

Simon translated Daniel Shiffman’s Graphing 1D Perlin Noise tutorial into Processing (Java). The project involved combining perlin noise and sine wave:


He also attempted to translate Perlin Noise Flow Field into Processing:







Perlin Noise Flow Field Coding Challenge

I think this is probably the most beautiful coding challenge Simon has completed so far. It’s based on a Perlin noise coding challenge by Daniel Shiffman where you’re asked to create a two-dimensional flow field with the help of the p5.js library, using the z-axis to represent time. Instead of actually writing it in p5, however, Simon created the project on the website (he has recently discovered through GitHub) and saved it online, so the animation he made is available at at his permanent link:

Perlin noise is a type of gradient noise that is used in computer visual graphics to increase the appearance of realism. In this video, Simon talks about the project:

Perlin noise is most commonly implemented as a two-, three- or four-dimensional function, but can be defined for any number of dimensions. An implementation typically involves three steps: grid definition with random gradient vectors, computation of the dot product between the distance-gradient vectors and interpolation between these values. Here are some videos of how Simon completed the coding challenge step by step. The project relies heavily on vectors: