I'm really good at animation in packages like houdini, maya, toonboom, etc. I can arrange shapes however I want. I also know enough about code to animate stuff, but I much prefer being able to draw and then interact with stuff, and only *then* add some code if necessary.

I've somehow managed to totally avoid webdev, but now I want to make webpages with animations. I know I could just do a webgl canvas or three.js, but what are my options for SVG animation with just html5, CSS, and JS?

For example, let's say I made a character like this out of SVGs and wanted to animate some loop of her making a gesture or walking or dancing or something. What's the best toolset for this task?

I'm kinda imagining it might be just illustrator to make the SVGs + manually writing a bunch of js for the animations, but I feel like there's gotta be something better.