Skip to content
Write a review
UdemyVideo Editing & AnimationPaid courseAll LevelsCertificate

Learn Web Animation the Easy Way: An Intro to SVG and GSAP (Udemy.com)

Create an animated eCard with just JavaScript and SVG in record time

4.4
622 reviews

Created by: Siggy Works

Last updated December 2020

icon
What you will learn

  • Understand SVG and the benefits of using it today
  • Embed SVG on a web page and organize SVG elements for web animation
  • Gain hands-on experience with the GreenSock Animation Platform and how to animate anything with it
  • Master how to easily breakdown an SVG project into scenes and timelines in GreenSock
  • Create a complex, fully animated greeting card, step-by-step and ready to share with friends

How it compares

Against the other 293 rated Udemy courses in Video Editing & Animation on CourseDuck:

  • Rating4.4 out of 5higher than 40% of them
  • Reviews622#59 of 294 by number of reviews
  • Length3.2 hoursshorter than 58% of them
  • Last updatedDecember 2020earlier than 69% of them

icon
Course Description

If you're a front-end developer, UI/UX designer or just a general web animation enthusiast you'll benefit from the techniques taught in this course. We use a project-based approach to introduce you to the SVG graphics format and GreenSock Animation Platform--possibly the most powerful and performant javascript animation library available today.
While building a complex animated greeting card, you'll learn: Why SVG is a hot commodity today The benefits of using SVG About SVG shapes and custom tags How to include SVG on a web page How to organize SVG elements for web animation What the GreenSock Animation Platform is Make sense of GreenSock's different bundles and which to use The GreenSock API and its six basic tweening functions All about timelines and how they work in GreenSock How to break down the SVG project into scenes How to create catchy, impressive animations piece-by-piece How to use timelines to organize your entire animation sequences And much more...
All project files with full source code will be made available to you at each step of the animation process. Learn valuable skills that will benefit you through out your career or open up a whole new world of creative expression if you're a hobbyist or enthusiast.
Who this course is for:
Some experience with HTML/CSS/Javascript is neededNo SVG knowledge is needed or expectedAnyone with an interest in web development and animation will benefit from the skills taught in this course
Read More All Levels All Levels product length iconTime: 3.2h

icon
Udemy Discount

The discount is applied through our link. Open the course from here and Udemy's current promotional price is applied at checkout on most courses, no code to type.

Get the Udemy discount

Some courses are excluded from Udemy's promotions. If the price does not drop, clear your browser cookies and use the button again.

icon
Instructor Details

Siggy Works

Short Version

Siggy, as friends and enemies call him, is a FullStack JavaScript Developer with over 15 years of web development experience. At work he also happens to be the developer who can also draw, so inevitably always gets handed the dry-erase marker during design sessions.



The Whole Nine

Siggy was born many moons ago as an artist, got in trouble for drawing cartoons in class, compensated by taking way too many math classes, then somehow managed to shoe-horn a computer science degree in between marathon sessions of black-jack. Then he discovered Flash, fell in love with Flash, made lots of noise and cash with Flash (apparently ad agencies love[d] it), got bored, read Bruce Mau's Incomplete Manifesto, wandered the earth like Kane for a few years while attempting to grow a beard. Shaved. Mourned the death of his dearly beloved Flash. Learned who the hell Douglas Crockford was and marveled at his kung-fu. Contemplated deeply. Very deeply. Swallowed his pride and embraced the long-scorned web maiden that is JavaScript! ...but kept his sketchbook close by.

Read More

icon
More Video Editing & Animation courses

$12.99

$74.99

$11.99

$19.99

$59.99

$10.99

All Video Editing & Animation courses

icon
Reviews

4.4

622 ratings on Udemy

Select a bar to show only those reviews.Select the bar again to show every rating.

Write a review

By Joo Pedro Pereira on 10/19/2020

Very insightful, very fun decent sized project and very fun to learn. Kudos.

By Igor tek on 10/17/2020

Little boring but goood :D

By David Aragon on 10/15/2020

This is really out dated and nothing you cant find on the GreenSock website or in YouTube videos

By Ralph von Pawelsz on 9/26/2020

Obwohl der Code auf lteren Versionen basiert habe ich mit diesem Kurs einen super praktischen Einstieg in gsap und Animationen erhalten.

By ec-ccs on 9/26/2020

Very good and easy to follow. GSAP is still a big topic and this course is short, so it should be complemented with other courses and projects to really get a full idea of the API.
More importantly: for the final project you will have the opportunity to see a professional animator at work, seeing Siggy (the mentor) using the tool to create something.

By Geordie Howell on 9/17/2020

Really clear, concise, detailed delivery of main project. Fantastic example to learn from - felt like it covered everything I needed to know. SVG section was a bit to "baby-steps" for me (nearly lost me)
Section two needs to be updated for the new version of GSAP:
//OLD
TweenMax.to("#logo1", { //do something; });
//NEW
gsap.to("#logo1", { //do something; });
Thanks heaps Siggy

By Isidoro Trevino on 9/2/2020

Great course! I only missed a lesson about adding effects on scroll but anyway it was good enough!

By Torrey Meade on 8/26/2020

Learning a lot of great tools in this course. I'm up for a job using DCO's and banner ads that relies heavily on GSAP. This course is just what I needed. The GSAP site seems a little updated so I'm not sure if I am using deprecated syntax, but everything so far seems to work fine. Thank you

By Robert Clark on 8/23/2020

Great stuff!

By Catherine Simpson on 8/18/2020

course was ok, but non of the resources would open up properly. this has left me overall disappointed with this course

By Aid Thompson on 8/4/2020

Very useful stuff. Never knew anything about SVGs and what a Tween actually was before this. Nice clear tutorial, simple, measured pace. Have recommended to friends.

By Ardak Koishybayev on 7/15/2020

It is great Intro course to web animation. Honestly, this course was enough for me to animate some features of the my future website, like menu button, menu dropdown, social icons and etc. Thank you for the course.

Showing 12 of 84 reviews

icon
Quality Score

No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.

Content Quality
/
Video Quality
/
Qualified Instructor
/
Course Pace
/
Course Depth & Coverage
/

Overall Score : 88 / 100

Learn Web Animation the Easy Way: An Intro to SVG and GSAP
Visit course on Udemy Write a review
  • Video Duration: icon 3.2h
  • Price: $39.99
  • Provider: icon Udemy
  • Updated: icon December 2020
  • Level: All Levels All Levels
  • Language: icon English
  • Certificate: icon Yes
30-day money-back guarantee on most paid courses

Udemy Coupon Price Tracker

Udemy price history

For any issues or feature requests please email CourseDuck's Co-Founder at mkuhlman12@gmail.com