Nature of code — Vectors, Forces, Attractors and a little bit of Repulsion

When I hear the words fractals, attractors (strange ones, in particular), recursion, Lorenz, etc., my heart truly skips a beat and then starts to beat faster. I touched upon these concepts in my P.h.D. thesis, applying them mostly to the new screen media field. It would be really great to create something meaningful, related both to media, and creative coding, based on cool things mentioned above (* note to myself, mostly).

So, when I saw this in the Assignment instructions:

… I didn’t hesitate for a second. Laws of Attraction is an absolute masterpiece.

Besides, this week's reading made me feel that I am getting closer to the main goal of this semester, which is basically to start actually getting the math behind the screen. To be more precise, that was the best possible picture to help my brain to get the key idea of Vectors:

©from the book “Nature of Code” by Dan Shiffman

Anyways, my plan for this week was to study a few really cool examples and to practice something simple on my own, and to work with my previous sketches where I used createVector() function without really understanding it — which I did (and, to be honest, which I am still doing but we have to submit the homework before tomorrow, so this post will be hopefully updated).

Inspiration and research

So, the first beautiful example that I tried to read and work with is Lorenz attractor made in p5.js. This code deals with 3D and uses p5.Vector class.

The original version is even fancier.

The second example, where I spent most of my time this week, is the sketch, where particles are attracted and repulsed by the click of the mouse.

The rectangle in Draw() function that hides all the particles’ trails. Without it, the picture gets quite scary.

My sketches

1. I was thinking about the power of vectors basically after the final for ICM and Physical computing, where we used createVector() for the purpose of following the joints that Kinect gets from the detected body, and making the image of the bone to follow the joint accurately and ROTATE, creating the illusion of Xray. This week felt like the right time to look back at the code.

We also used vectors for debugging purposes. The whole idea of using vectors to help us to get the needed rotation belonged to my ICM professor Lisa Jamhoury.

2. I also tried to re-write the code for one of my favourite examples from last semester, using createVector() function.

This work is in progress for now. I didn’t get to the point where particles actually fall, for now they just stick to the this.position.

Since my sketches are in progress now, I provide the links to the p5 web editor, not Github, where I would love to publish ready repositories for them.