Animation
Add more life to your web projects with animation! These episodes show what's possible with animations and how you can get started creating your own animated elements.
Fun, festive, interactive web animation
Many of the websites we love most are fun and interactive. In this episode, Cassie Evans will teach us how to add a little festive whimsy to our web projects with Greensock.
3D in React With Triplex, a Visual Editor for react-three-fiber
Triplex is a visual editor for react-three-fiber that uses code as the source of truth. Editing 3D components in React in a Figma-like UI?! Creator Michael Dougall will teach us how it works.
CSS-Only Scroll-Driven Animation and Other Impossible Things
Wait, you can’t do scroll-driven animation with just CSS, right? Bramus will show us that not only is it possible, but there’s even more that CSS can do these days.
Seamless Page Navigation With the View Transitions API
The View Transitions API is now stable in Chrome. That means we can make extremely cool nav animations in our web projects without extra JS overhead. Maxi Ferreira returns to teach us how it works!
Let's Learn Motion DevTools!
Build, inspect, edit, and export animations made with CSS and Motion One using this Chrome extension from the Motion team. Matt Perry will show us how it works.
Create Playful, Interactive Animations
Can we make our animations react to user input? We can! Cassie Evans will teach us how to use Greensock to create fun, interactive animations!
Animating a Smashburger SVG Using GSAP
In this solo stream, Jason tries to remember how GSAP works to animate a smashburger SVG.
Make Video With Code
Making slick, animated video using React might sound far-fetched, but Remotion makes it possible! Jonathan Burger will teach us how.
Animation With Svelte
Svelte is gaining a lot of popularity in the JavaScript community, and its robust animation capabilities probably have a lot to do with that. in this episode, Scott Tolinski will teach us how to animate in Svelte 🔥
Whimsical SVG Animations Using GSAP
One of the best ways to learn is to build things that make you smile. In this episode, Jhey Tompkins will teach us to build a playful SVG animation using Greensock.
Interactive SVG Animations Using Greensock
Animated SVGs add a touch of interactive whimsy and polish to our websites. In this episode, Cassie Evans will teach us how to use Greensock to create fun, engaging experiences!
Let's Learn D3.js!
Data visualizations add a ton of clarity and value to our apps, but getting started can be daunting. Shirley Wu teaches us how we can get started with D3.js to make charts, graphs, and more!
Make Animations Feel Pro
When it comes to animation, there are a few tips & tricks that take them from “neat” to “HOLY WOW” animation master Sarah Drasner teaches us how to take our animations to the next level!
Build a Realtime Twitch Game
What happens when Cassidy Williams joins Jason to build an interactive game? A whole lot of shenanigans, we hope! Join the fun as Cassidy & Jason build something fun together & try to make each other laugh
Let's Learn Framer Motion!
Animation in ReactJS using Framer Motion is powerful and flexible. In this episode, Framer Motion author Matt Perry teaches us about the magic that’s possible when using it!
Custom CSS Animations with Splitting.js
Make smooth, interactive CSS animations with CSS Variables! In this episode, Stephen Shaw (https://twitter.com/shshaw) teaches us how to create custom text animations and Twitch overlays using CSS, HTML and Splitting.js.
Fun With Custom Maps and Animation
Creating maps might seem intimidating, but Eli Fitch (https://twitter.com/elifitch) joins us in this episode to teach us how Mapbox can make creating custom, interactive maps a little more approachable and a whole lot more fun!
Generative Data Visualization Design and Planning
Shirley Wu creates art from data. In this episode, Shirley teaches us how to approach creating a beautiful data visualization and shares her process for making complex data into stunning, understandable designs.
Introduction to Three.js
3D rendering can be intimidating — but it doesn’t have to be! On this episode, Sarah Drasner joins to give us an intro to 3D rendering in three.js.
Animation and 3D in react-three-fiber
3D animation in the browser can be super intimidating. In this episode, Paul Henschel joins to teach us how to use react-three-fiber to create high-performance 3D animations and shapes in the browser.