ICM Week 4 - Loops

I had a lot of fun this week experimenting with loops! Since I'm still trying to wrap my head around using loops on top of conditional statements and booleans in the same sketch, I kept this week relatively simple and didn't add any interactive components because I was having a hard enough time getting the arrays patterns to do what I wanted them to. After tinkering for 2 days, I ended up with a Penrose triangle!

What Worked

After I figured out how to make the drawing "work" the way I wanted it to, everything fell into place pretty easily. It would be GREAT to have been able to do this another way, because the brute-force way almost killed me. Don't get me wrong, I enjoyed it the entire time, but I'm also a bit masochistic (who isn't?). My dad told me once that the best programmers are the lazy ones. I do like being lazy, but I currently don't know how to be lazy with p5.js. I look forward to that day. Ideally my code will look something like this in the future:

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220)
  
  print('my really cool,awesome idea');
}

a girl can dream.

What Didn't Work

I honestly didn't think this drawing would be as difficult as it turned out to be. I drew out the custom shapes by "hand", which means typing each vertex out. That took way more time than adding the animated loops. It's a bit embarrassing, but I literally used a ruler on my computer screen to figure out where my points needed to be after drawing a 24x24 grid on the canvas. While it worked out, I'm sure there must be a better way. Hopefully that way doesn't involve maths...who am I kidding it probably does.

The larger issue was trying to mask parts of the shapes off in order to have different shapes inside moving independently of the others. I tried to look at the mask() function, but it seemed to require an image input and I didn't want to go down the route of creating custom images if didn't end up working for whatever reason. So I ended up creating custom "mask" shapes - which again took FOREVER. I recognize that what I came up with isn't exactly what I was going for. But the end results are there, so I'm happy with it.

What I Learned

I feel more comfortable using loops to create arrays, and I'm getting better at predicting what the results are going to look like. I really enjoy using the random function and will continue to play with it in the future; seeing organized chaos is a thrilling moment for me. But I did end up experimenting with some other drawings well before this one. Below are some of the "rejects".

Above was the first thing I made. I originally wanted to make trees that grew and got darker from the bottom to the top of the canvas, but somehow this thing happened.

This was my second attempt but it ended up getting too busy, and honestly I didn't know where I could take it from here. But you can see the beginning of the idea to create these black "mask" shapes to hide parts of sketch. I like the idea of recreating some old tv test patterns, maybe I can work on that in future.

Something like this maybe.