This week in animation we're learning some amazing approaches to keeping complex animations smooth, exploring tips from expert animators and checking out some approaches to beautiful 3D transitions!

♥️ Donovan at CSSAnimation.rocks

Articles

Layout projection: A method for animating browser layouts at 60fps — mattperry.is

Some genuinely eye-opening techniques for bringing smooth animation to complex web layouts

10 Ways to Create Delightful and User-Friendly Web Animation — www.shopify.com

Web animation tips from five experts (and me!) so you can incorporate motion into your designs, increase user engagement, and improve your client’s UI

Beautiful CSS 3D Transform Perspective Examples in 2020 — polypane.app

Beautiful CSS 3D transform examples using a single div that you can copy with one click

Featured

CSS Animation - Free CSS tutorials and guides — cssanimation.rocks

Learn CSS Animation with awesome tutorials, video courses and a (this!) weekly CSS Animation newsletter

Inspiration

The Caretaker - A pure CSS Horror / Puzzle game

I have no clue how this was made. A genuine, playable, quality adventure game created in CSS

Ghost Card

Amazing flame effect on this ghostly card

"No div" washing machine💥💥

A washing machine is made using just the body tag, body:before and body:after elements

Among Us

Ejection animation from Among Us in pure CSS....

Candy Cornfetti

Realistic-looking confetti pieces!