Example code I use to create my animations

Scroll down to find a code snippet for Motion Canvas, a tool for creating animations using TypeScript code. The code below is for this video.

Something I did correctly was not paying attention to coding conventions at all when creating these animations. I copied code everywhere, I accrued as much tech debt as necessary to just pump out the videos as quickly as possible. I literally have the same function/code blocks copied in like 5 different files, slightly adjusted in each file, each for a different video. I’d never do this in an actual software project, but I think here this was the correct choice, because I didn’t really know what I needed initially, and would’ve built the wrong abstractions in the first place. The absence of structure is better than the wrong structure.

If you’d like to get more coding tips and tricks, leave your email below.

If the signup form doesn't show up right here, please disable your ad blocker temporarily.

The CodePen is just for syntax highlighting, you can’t actually run it in there. You need to install Motion Canvas locally to try it.

See the Pen Motion Canvas Example Code by Philomatics (@Philomatics) on CodePen.