Animate Vector Graphics for the Web

Alex Trost, Frontend Developer and Designer

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
14 Lessons (1h 16m)
    • 1. Introduction

      1:15
    • 2. SVG Shapes

      6:59
    • 3. Grouping and Styling SVGs

      3:30
    • 4. Intro to Greensock

      10:43
    • 5. Prepare the Scene

      7:00
    • 6. Beach Ball Sliding

      6:23
    • 7. Beach Ball Rolling

      5:15
    • 8. Sun Flare

      6:22
    • 9. Sliding the Fence

      4:19
    • 10. Sliding Landscape

      7:40
    • 11. Rolling Waves

      5:06
    • 12. Sliding Surfboards

      4:32
    • 13. Flying Bird

      6:29
    • 14. Final Thoughts

      0:45
91 students are watching this class

About This Class

Let’s create eye-popping vector animations! We’ll use a powerful tool called GreenSock to animate a beach scene in a bunch of different ways.

You’ll love this fun and engaging course with Alex Trost, a Frontend Developer, Designer, and co-host of The Overlap, a podcast about design and development. 

The course will cover the basics of SVG, then get into an awesome project where we’ll animate a full beach scene. You’ll walk away with an awesome animation that can go on any website!

You’ll do best if you know a bit about HTML and CSS, but it’s not required. We’ll be using JavaScript, but don’t worry if you don’t know how to code. GreenSock makes everything easy to use, and the course goes step by step.

You don’t need any special software, and we’ll be doing all our coding in the browser. It’s easier than ever to create super impressive work!

This class is perfect for:

  • Illustrators and Graphic Designers who want to animate their work on the web.
  • Web Designers and Developers who want to add awesome animations to their projects.
  • Anyone who wants to create fun and engaging things on the web!