Time Flies & Other Visualisations
Koen van Gilst / March 8, 2024
3 min read • ––– views
Recently I've been having a lot of fun building visualizations in JavaScript using just the canvas and some HTML & CSS. Here's an overview of some of the things I made.
- Time Flies
- Particle Life
- Aarde
- Dancing Mosquitoes
- Pong Wars
- Purple Rain
- Voronoi Virus
- Rock Paper Scissors
Time Flies
Insects, time and how it always seems to fly by too fast. Original idea by Menno Anker
Particle Life
This weekend's coding session was dedicated to recreating Jeffery Ventrella's "Particle Life". I had a lot of fun with it. So strange that I've never encountered this algorithm before!
Aarde
Old school artificial life. Inspired by Tierra, in a much simplified form.
The programming language in which the life forms are written has 5 instructions:
- S - Program start
- E - Program end
- F - Find location to copy to
- C - Copy to location
- J - Jump to start of program
Every time a code is copied a mutation can occur. We start with the following simple life form:
SFCJE
The rest is evolution.
Dancing Mosquitoes
I created this on a dreary winter day. The rain and lack of sunlight got me thinking about hot summer evenings & the mesmerizing mosquito dance.
Pong Wars
It's the eternal battle between day and night, good and evil. I made this on a Friday afternoon as a short break from my other side project which started to feel a lot like work. After creating it I posted a video on Mastodon & Twitter and it became somewhat of an internet sensation. With currently more than 4 million views and 40.000 likes it's by far the most popular thing I ever did on the internet.
I first saw the idea for this here, but it appears to be older than that. There's more information on the history in the Hacknernews discussion. The colors are based on the Mindful Palette by Alex Cristache.
Purple Rain
With Valentine’s Day around the corner, I created Purple Rain. It's a simple visualization of raindrops falling down the screen. The palette is based on the Mindful Palette Nr. 38 by Alex Cristache.
Voronoi Virus
When I was a kid in high school, a friend and I would exchange floppy disks with demos on them. At that time I was happy to be able to draw a couple of circles on the screen so I was very impressed when he showed me his demo. It was similar to this and it even had movement. I couldn't believe he was able to do that (I still think he had help from his father!).
Rock Paper Scissors
Not sure where this is going, but I like the way it looks already. The demo simulates cellular growth, following the rules of rock, paper and scissors. To make it a bit more interesting I've made it possible for older cells to withstand a few attacks by enemies.
