Concept:
For this project, I viewed a lot of generative artwork created using P5.JS but the idea for my particular design did not click until I was watching a 3Blue1Brown, a math youtuber’s video on Dirichlet’s theorem. The theorem tries to explain how prime numbers create certain spirals, and the randomness of primes means you cannot accurately predict the pattern. Thus the idea of working with random spiral shapes was born. I decided to create a 6×6 grid of spirals, each generating a gradient of color for unique spiral shapes. I wanted to add a level of interactivity which I did by making the spirals spin when the mouse hovers over them (mimicking an electron’s spin and change of behavior when ‘observed’). Furthermore I made it so that any mouse click on a particular spiral, changed the direction of the spin.
Code I am particularly proud of:
A part of the code I am particularly proud of is the draw_ background() function that created a smooth gradient for the background. In plain white the sketch looked dull and uninteresting but I believe the new gradient background has allowed each spiral color to ‘pop’.
//this function draws the background gradient going from dark blue to pink function draw_background() { let c1 = color(60, 120, 200); // navy blue shade let c2 = color(255, 182, 193); // light pink shade //loop through each pixel row to create the gradient for (let y = 0; y <= height; y++) { let gradient_color = lerpColor(c1, c2, y / height); //finds an in-between color for each pixel depending on height in the sketch stroke(gradient_color); // color for the current row line(0, y, width, y); // draws a line of that color } }
Final Sketch:
Reflections:
I am happy with the results of this assignment. It is visually interesting, pleasing to look at and interactive but I do believe there is room for improvement. Another level of interactivity I hope to add is the spirals changing colors when hovered over or maybe when clicked upon. Another idea I had was the spirals morphing into different shapes based on user movement across the canvas. Overall I believe this assignment sets up a good basis for further development of this seemingly simple idea.