First JavaScript Projects: SVG and CSS Animations

The “Scoot Bot”

I designed a SVG robot character in Adobe Illustrator, and programmed it to chase a JavaScript event (cursor click) across Mars. I animated the layer classes, the blinking eyes and flipping satellite dish, with CSS keyframes. The cubic-bezier() Function varies the speed of their roll.

Watch the Scoot Bot operate on CodePen, here.

Bolt from the Gray

Pixel art thunder cloud taking it out on a flower via css animation. See the CodePen here.

A CodePen picked pen!