Week 4
My original inspiration for this weeks prompt was Manfred Mohr’s work.
Started out with trying to decide how I would draw the lines that would allow a 3D effect. Went from testing line -> curve -> bezier -> vertex and landed on curveVertex.
Line test to see if I could make the effect with a single line first.
A for loop was used to create all the lines to fill the screen.
Then this is where I got really stuck. I was trying to mimic the 3D effect Mohr’s piece statically at first and then work on changing it with mouse interaction. After looking through the resources I saw that if I wanted to do 3D I would have to include WEBGL into my code. I learned that with WEBGL the origin point is changed to the center so one of my exampled below shows that without subtracting the variable by -width/2, the origin will stay at the center.
A static attempt while in WEBGL mode.
What showed up when I changed the second vertex’s Y with mouseY while being in WEBGL mode.
After multiple attempts and experimentation plugging in different numbers/lines I realized the lines reminded me of Joy Division’s Unknown Pleasures album cover.
I found this gem that was also made using p5.js and about Joy Division. My intention was to have a small animation while a song is playing in the background. The animation attempts ended up turning into some cool visuals but not what I intended.
This sketch below has orbit control capabilities so when you press the mouse it creates it allows you to move around the object BUT because it’s a bunch of lines and not a 3D shape it becomes chaotic.
The final product ended up being a rendition of all the ideas above. It starts off with a black background and will draw up lines curved by noise as you move the mouseY. If you press the mouse a Joy Division song will play. MouseY also controls the volume when the song is playing.
