Self Portrait

‍

Tried a lot of things. The first one of those things almost worked but then I made an infinite loop which resulted in my browser crashing and my project lost. The silver lining is that I've now learned that I should hit cmd+s all the time.

I had this like really abstract vision of a heartbeat — my heartbeat. Something about moving to the other side of the world and starting school here is akin to being born again, in a way. Some days here I get so overwhelmed I think I really feel my heart beating out of my chest. Anyway, I wanted to draw a bunch of lines, all starting in the middle of the screen and reaching outwards at different angles, possibly with sort of a contraction-like animation.

I googled "how to measure my BPM" (BPM = beats per minute) and found out my BPM was 64. Which is almost athletic, according to Google!

‍

‍

Couldn't really figure out how to create an animation that would feel like a heartbeat, but tried anyway. I realized I should probably want something to happen every X time (X being every beat, which came to be 0.9357 seconds), so googled that. Found out about setInterval(), which received a function and a number (time in milliseconds) as its arguments, which was just what I needed!

To my dismay, the thing I started with the for loop might not have been the best choice for this. Everything worked as expected technically but it felt wrong. Eventually I settled on adjusting the frame rate for achieving that "heartbeat feel". I played around with a bunch of other things, like the amounts of lines, and colors, trying to use random numbers.

Ended up trying to redo it without the for loop:

‍

It's getting close to my vision but I'd really like to learn how to maybe animate the lines over time.

Thanks for reading!