YoVDO

Fun, Festive, Interactive Web Animation with GSAP - Learn with Jason

Offered By: Learn With Jason via YouTube

Tags

GSAP (GreenSock Animation Platform) Courses Javascript Courses Web Animation Courses SVG Animation Courses

Course Description

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Discover how to create fun, festive, and interactive web animations using Greensock in this engaging video tutorial. Learn from Cassie Evans as she demonstrates how to add whimsical elements to web projects, focusing on animating a snow globe. Explore GSAP's features, including making elements draggable, working with inertia and velocity, using the GSAP ticker, and creating controlled randomness for snowflake animations. Gain insights on performance optimization, code refactoring, and advanced animation techniques. Perfect for web developers looking to enhance their projects with captivating animations and interactivity.

Syllabus

Learn with Jason with Cassie Evans
Introducing Brody
Who is Cassie Evans?
What is GSAP?
What is new with GSAP?
Why choose GSAP over Framer Motion?c
Can you use GSAP with WordPress?
Do you recommend adding GSAP as a dependency or with a script tag?
Starting to animate a snow globe with GSAP
Making the snow globe draggable
How does inertia work in GSAP?
Figuring out numbers for velocity values
What is velocity in GSAP?
Adding GSAP's ticker
Using Clamp
Changing a transformer into a function
Creating snowflakes
Passing in an array with set values for controlled randomness
What's the most performant image to use for animations?
Animating the snow relative to the velocity
Doing a bit of bike shedding on our code
Making the snow flurry with GSAP tween controls
Where can I learn more about GSAP?


Taught by

Learn With Jason

Related Courses

Learn Javascript - 21 Essential Array Methods
Coursera Project Network via Coursera
3D Graphics for Web Developers
Pompeu Fabra University via FutureLearn
A Simple Scatter Plot using D3 js
Coursera Project Network via Coursera
Access WebView in an Android Studio Project
Coursera Project Network via Coursera
Deployment Pipelines using GitHub Actions
A Cloud Guru