An animation Winston and I made at the Recurse Center. Out of appreciation of the fabulous @beesandbombs, we internally called this project wasps and (gre)nades. :P
I learned a lot about easing functions and about how to plan and structure this kind of multi-step animation! Also, publishing this as a GIF on Twitter was a pain in the ass, we got the best result when exporting all frames individually, opening them as layers in GIMP, and then exporting them as a GIF. Even though, in the resulting tweet, every looks a bit blurry.
As for actually making the animation happen: we don’t store any state, but have formulas in place that give us the transformations we want. You can peek at the p5.js source code here, if you want.
Fun fact: we actually had another movement pattern in mind, but a bug produced this, so we decided to keep it!
Send a message to @email@example.com or drop me a mail at firstname.lastname@example.org. Also, you can support me on Patreon or subscribe to my newsletter!