Day 005: Adding Some Motion

I wanted to add some motion to my site. That makes it feel like a living breathing, uh, collection of 1s and 0s

React Motion

I would love to build everything from scratch. But if I did that, I'd still be mining the materials to make my laptop, so I need to decide when to cut corners. An animation library is the perfect place to do that. I like animations so much that they were one of the key reasons I learned to code. I also hate them. That's because I'm a visual person who likes to see it and adjust, but changing animation code is like cutting your own hair in a mirror looking into another mirror while riding on a carousel. In other words, it's super frustrating. A library makes things massively easier, so I'm starting with Motion.

The Robot Strikes Again

In the old days, I'd find a video of an animation (or a similar example on a blog or something), then work to adapt that to have it do what I needed to do. Or, I would animate in a design program, and adapt the code it would export to fit my setting. Now, I was able to just tell my buddy Perplexity what I want, and the starting code was printed out for me. Then it was just adjusting to how it suits my eys.

Not For Accessibility

I made sure to account for anyone using a browser where they've asked for no motion. I once spoke to someone who had a condition that caused them to get physically ill when looking at movement like this (even when minimal), and I never want to cause that issue for someone. So, please please don't skip that step!

I'm Hooked

Now that animation is becoming this easy, you can bet I'll be trying a lot more of it!