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.
What Worked:
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!