After going through a bit of history on using computers to make art, my second class on p5.js had us attempt to be inspired by geometric artwork and write code to make something cool.
In about an hour and a half of coding, I ended up with this — randomly generated triangles in all kinds of colors.
We were tasked to continue working on it until we were happy with it — play around with shape, size and color.
I spun some things around in my head during a long commute — I’m determined to get all these triangles to be all connected and not overlap. It was something we discussed before starting the project but we deemed it too difficult to do consider we’re only 3 hours into learning p5. We looked at a library that accomplished it, but I needed to come up with my own solution.
I have a difficult time drawing while I’m driving so as soon as I managed to stop I sketched this out:
What if, instead of Random coordinates to create the triangles, I could
- setup a grid on the canvas
- randomly place the points in that grid
- store the coordinates in an array
- then manage to systematically go through and start using those points to create the new triangles
In my head it seems like it could work — getting rid of the randomness of the triangle generation.
Let’s see how far I get into this code before I realize how dumb I was to think this would work.
Setting up the grid
Just so I can see what my brain is thinking, I’m physically putting the grid onto the canvas:Which ended up looking like this. I’m off to an okay start.
Which ended up looking like this. I’m off to an okay start.