Course Recap: Animation Techniques0:08
Good on you for sticking throughout this entire course. We've covered a lot. We've started with CSS transitions and key frame animations. We've looked at how to animate SVGs to make a spinner animation or a line draw effect, and we've looked at JavaScript animations with request animation frame with the JavaScript web animation API, and then we took a few JS libraries for a spin. We've barely scratched the surface of what you can do
Exploring Canvas and WebGL0:29
and then we took a few JS libraries for a spin. We've barely scratched the surface of what you can do with these techniques or libraries, but hopefully this inspired you to dig a bit deeper. There's an entire world we haven't even looked at in this course. The canvas element and WebGL, which can let you turn your website into an interactive 2D or even 3D world, that is GPU accelerated. Think video games and immersive 3D experiences.
or even 3D world, that is GPU accelerated. Think video games and immersive 3D experiences. It's a crazy complex space, but some libraries like Pixie or three Gs help you leverage those superpowers to build amazing things. So if you feel like the DOM is not enough for your animation needs, go deep your toes into the canvas, HTML element and the world of WebGL. Alright, we'll wrap things up here for this course. I hope you had a blast learning about various motion
Performance and Best Practices1:25
Alright, we'll wrap things up here for this course. I hope you had a blast learning about various motion and animation techniques and your inspired to add some movements to your existing or new projects. Remember, whenever possible, use CSS animation for better performance and accessibility. Step it up to JavaScript when you need more control or interactivity. And don't forget the golden rule of animation. Less is more.
Final Wrap-Up1:43
control or interactivity. And don't forget the golden rule of animation. Less is more. And that's a wrap. See ya.
