MOBI Byte Workshop 03-18-2024

A motion postcard for your friends! This is paired with a MOBI Byte Workshop.

Where's all the animation code?

It's inside src/js/your_code.js and src/styles/your_animations.css.

Also, any liquid components (think of it as HTML) are in src/_includes/components.

Starting Locally

npm install
npm run start

Slides

Figma slides

Useful Resources

Most of these are from the MDN, Mozilla Developer's Network.

• CSS Transitions
• CSS Animations
• Web Animations API
• requestAnimationFrame

Repo

Github

How is this built and composed?

I used 11ty, the static site generator.

License

MIT