This week we learned how to use the createVector() function in p5.js, and also a bit about velocity and acceleration. I've used vectors in p5.js for my previous sketch to help direct the cubes for my 3D walker, as well as a few sketches I made during ICM, however I didn't really fully understand vectors in general until watching the lessons for this week.
I was inspired by visual representations of atomic orbitals and wanted to make a sketch that had some elements orbit another object in a controlled way. You can see what I came up with above. I made a version that incorporated color as well, which you can see below. I like how the black and white sketch creates a sketch that appears to pulse, which gives the movement more dimensionality - which I liked since this sketch is entirely in 2D. I had a hard enough time getting the orbit to work properly, so adding a third dimension would have complicated things beyond my current understanding.
It took some time adapting the sketch we worked on during the example in the coding train videos to make the loop around a central axis that I wanted. Once I got one loop working correctly, it wasn't hard to add other objects to the scene rotating in opposing directions. I also added a slider to control the magnitude of the acceleration so that you could have some interaction with the sketch. I might go back and add more sliders to control more variables, but I wanted to keep it simple this week.
What Didn't Work:
This sketch came together quite easily with no major issues. I spent most of my time playing around in the same sketch playing around with the values and variables. I didn't want to be too ambitious this week, mostly because I just wanted to get a handle on how these variables were effecting the movement. Since these concepts are going to impact the rest of the course, I thought I should focus on nailing the basics. I think have a better understanding of how vectors in p5.js can be used to make some really intricate and complex movement.
The only thing I struggled a little bit with was how I would use a vector to alter the color in a meaningful way. While I landed on something that I liked, I think I would need to use the map() function to have more control of how the colors change. I also don't know how I would handle negative values when it comes to working with HSB color. That's something I'll have to look into more.
What I learned:
Wow did I learn a lot this week, it's all so fascinating! I just hope I can keep up as the concepts begin to get more complex. I'm glad to have a better understanding of what vectors are in mathematics/physics, and also how they are used in p5.js versus some other programming languages. I'm looking forward to next week!