Free
All prices in USD
Learn the basics of GreenSock API and web animations in 60 minutes!
Are you ready to start learning the basics of GreenSock and web animations?
This free online course will walk you through the GreenSock API and most of its components in a series of fast paced GreenSock tutorials.
| GreenSock Tutorials – Table Of Content | |
| Lesson 1 – 5:22 | Selecting html elements using jQuery and JavaScript |
| Lesson 2 – 5:35 | TweenLite – .to, .from, .fromTo, .set |
| Lesson 3 – 4:37 | Easing – Default Easing, EasePack Plugin |
| Lesson 4 – 3:38 | Simple Callback Functions |
| Lesson 5 – 5:40 | Animating Multiple Objects |
| Lesson 6 – 3:45 | Adding Tweens To A Timeline |
| Lesson 7 – 7:47 | Controlling A Timeline Playback |
| Lesson 8 – 5:11 | Staggering Animations |
| Lesson 9 – 7:26 | Repeating Timelines – TimelineMax vs TimelineLite |
| Lesson 10 – 7:16 | Repeating Timelines – Part 2 |
| Lesson 11 – 11:21 | TweenMax – The King Of Web Animations |
Additional Information
- Total class duration: 1h 7min
- Free online course, with lifetime access.
- Video files not available for download.
- Learn at your own pace.
What’s covered?
- GreenSock TweenLite, TimelineLite, TimelineLite and TweenMax.
- No need to have GSAP membership to enjoy this workshop.
Intended Audience
- designers and developers with a working knowledge of HTML and CSS
- designers and developers with little or no jQuery/JavaScript experience
- curious front-end developers trying to learn what's hot and boost their skill set
- designers who would love to build their own animations
- anyone looking for a simple introduction to GreenSock API
- anyone who wants to learn GreenSock but is not sure where to start
Objectives
- Explain GSAP API in a quick simple demos.
- Learn how to create a basic web animations.
- Fast paced introduction of GreenSock API.
Prerequisites
- Basic JavaScript or jQuery knowledge is welcome, but not necessary.
- All working files are available for download.
- Working knowledge of HTML5 and CSS3.
- Positive attitude towards learning new techniques.
- A genuine interest in GreenSock and JavaScript animations.
- Tomato lovers more than welcome!
This is a course that literally takes you from the basics of animating HTML elements using the popular GreenSock library and logically progresses to more complex examples.
Petr is an outstanding teacher – his videos are clear and easy to follow and the quality is excellent.
If you love animation on the web and you’re looking for a place to start, don’t miss this course.
Strongly recommended.
really enjoyed learning this course, especially its totally precise and succinct style with… nice pacing. just an hour but packed with tons of great information. not too basic at all. bravo!
I’ve been searching how to use greensock and this course has all the answers and really takes your animation skills to the next level. Highly recommended!
A little fast for me and I think it might be easier for me and beginners if the demo files were less sophisticated: they have a lot in them which doesn’t seem to relate to the task at hand – they are more like files you might publish. I am just questioning whether this degree of setup is necessary to teach what you are teaching.
I don’t want to sound negative though, I have got a lot from your tutorials and tips, so thanks very much!
Dave Clark
This class is a great overview of Greensock. It was easy to follow and I learned a lot.
I have been interested in learning GreenSock animation for a little time now. This is a great introductory course to GreenSock animation. It’s very easy to follow along for those who already have a familiarity with jQuery and JavaScript, like myself, or those new to it altogether.
It’s pretty amazing the complex animations GreenSock can handle with just a few lines of code. I look forward to learning GreenSock more in depth and using it as my primary source for web animation, when CSS3 doesn’t do the trick.
I highly recommend this course to those new to web animation or those who are experienced in animation looking to broaden his or her horizons with GreenSock.
Thanks, Petr Tichy, the lessons are really helpful. I had been searching everywhere to get start in GSAP and found this one is top of everything else. Looking forward much more like this from you.
Thanks, Petr Tichy, really enjoyed learning this course, the lessons are really helpful.
I’ve learn new things, thanks a lot. Good Tutorial, very useful
I tried GSAP a long ago but I’ve forgotten almost everything. I think this course is definitely good not only for beginners but also for those who needs a quick remind of what GSAP is able to do.
A friend of mine recommended GreenSock for an animation I was trying to do using jQuery, I’m glad he did.
The introductory videos were great, they did help a lot when I started, I didn’t use the downloadable documents, I started experimenting with my own.
The course was a wonderful introduction to Greensock. I would recommend this course to anyone who is interested in learning the basics.
Petr always does a great job with his tutorials and he explains everything so well you can actually start building your own awesome animations.
Fantastic!!! Level and amount of material per session was perfect for me. I will definitely be taking more classes from Petr. I am also starting to dislike tomatos, maybe just a little.
I worked hard to learn jQuery and was quite disappointed when I tried scrollMagic, which asked to use another language I never heard of. I was about to quit my project when I saw those videos. Thank you Petr, you gave me hope again : GS is not hard to understand and apply ! Now let’s combine it with ScrollMagic !
Another great point for you : you speak english a way I can easily understand (I’m French…) 😉
If I may complain about anything, you should give more details about the differences between Lite, Max, and CssScript : a video like “Which one should you chose for your project”, considering the technical possibilities, weights of files, etc.
Hum by the way, I’m really interested in the part you quickly mentioned in Unit 10 : how can I make a real loading screen connected with the actual content of my project, which would disappear once my site fully loaded and fully operationnal ? (I don’t use HD Images, just multiple requests and scripts…)
Great content, as always. the teaching skills from this guy are awesome, is just what you need if want to start to learn GSAP.
I have recommended this course to my entire team. Clear and succinct, your courses are time well spent for any front end developer.
Awesome course, I really like GSAP, would like to implement it with scrollmagic.
Thanks for great tutorial.
Very useful . Thanks alot
Awesome, really like GSAP, Thanks a lot.
This course is interesting and easy . It is recommended for those who first started. Petr Tichy Thank you.
This is an excellent introduction to GreenSock. One hour well-spent, after which I feel much more confident using this library. Thank you!
I feel really lucky to find this course. it is really useful and helpful.
I have recommended this course to all my team member as well.
Easy understanding without any problem although I am not a native English speaker. 🙂
This is really an excellent introduction to GreenSock and TweenMax.
Very informative, and well organized with respect to the quantity of information and order of introduction.
Thank you for making this excellent course. Having previously fiddled with plain JavaScript animations of SVG, I had no previous experience with animation specific JavaScript API’s such as greensock and this course has taught me a lot. Now there is no going back! Next I would like to learn more about path based animations.
Cheers!
Concise and easy to follow. Very thankful for this course!
Thanks so much, you’re an asset to the internet mate
This is a great way to start! Nice and straight forward.
More than awesome !!!!!!!!!!!!!
You’ve made learning greensock easier to learn than tying my shoelaces!
I really enjoyed this tutorial. GreenSock is an amazing program. Not hard to to learn. Beginners as well as experienced programmers will find this video helpful. After the excellent guidance with Petr, it’s only a matter of time and imagination to create professional looking programs. Great program.
This is a great way of getting started with Greensock – concise and easy to follow. Recommended!
Nice lesson, learned a lot. First started on Lynda.com, your course added a lot more to my animation skills. Looking forward to seeing your additional courses.
This is a fantastic introduction to Greensock! Peter has a knack for breaking things down when you need it and his explanations are very easy to understand. I highly recommend this course!
Your tutorials are very easy to follow, and you’re so funny too. Very Recommended. Thanks
I was scared and bored to learn javascript especially animation,
Now with what I learned from you I can finally make my future portfolio interactive.
THANK YOU SO MUCH and I hate tomatoes too by the way hahaha but I love learn from your website 😉
My english is not very perfect, but you so clear explain! Thanks alot for your efforts !!! this course gave me all what i wanted to know! the GreenSoc is not GreenSoc without you))))) Thanks again !
Great work! That’s a lot!
Am an intermediate web designer but semi beginner/intermediate greensock-er, using the classes to improve my understanding of greensock can only say its direct and easy for anyone to understand. A*
Great tutorial, like whole ihatetomatoes. Petr is a very good teacher and can explain web animation problems in easy way. I’m a big fan !
Well done Petr! I love your courses, I did GSAP 101 and ScrollMagic and I’m already usiging these scripts on my websites!! I really recommend these courses!
This was really helpful.
It’s good to get the basics right!
Thanks
Great tutorial Petr! Following your youtube channel for almost 2 years already and really appreciate what you do. Thanks again!
Easy to follow even for a beginner.
Classy examples. Nice to see that you make mistakes too.
Great course. I’m a total newbie in this area, but from this videos i learned the basics, now i can animate things, i can build a timeline, i know all the things necessary to build my first scroll based website.
Excellent Petr! Helped me a great deal to understand greensock and animating SVGs. The tutorial is well structured and a breeze to cover. It removed all the confusions in me about those animations on the web. Feels good to know that you can get creative and make things now!!
It’s a pretty course you’ve created here, I never try Greensocks before, and now, I think I can do lots of stuff ! 😀
Thank you !
Summary: Great tutorial, and fast paced. Does not cater (nor should it) to newbies.
Petr is a great instructor! I needed to get used to his accent, but that only took a minute or so. The best part is that the tutorial goes at the right speed: fast! Most developers are sick of tutorials that cater for the slowest denominator, and go way too slow explaining the basics to people who shouldn’t really be doing the courses till they’ve built up enough knowledge. But this tutorial goes quickly, and includes only the most useful information. It assumes you know the basics, but that enables it to go much faster and more efficiently. Thanks again Petr.
I love this course Thank you ^_^
THANK YOU VERY MUCH PETR!!!
great work, enjoyed a lot, learned a lot!!!
I never used ScrollMagic, nor have I ever heard of it until I found Ihatetomatoes on Youtube. These videos are direct, clear, and well instructed. I can’t wait to complete this workshop and implement ScrollMagic in my projects!!
so much fun for me !, I love It!!
This is an excellent course! I went from nothing to being able to easily incorporate very polished UI animations on my daily work in no time.
This is a testament to both GSAP and to Petr’s ability as a teacher! I’ve recommended his courses to my peers at work and they were equally blown away!
I really enjoy your style of instruction… straight to the point… many other video courses I would lose interest halfway through because of the slow pace… but yours is perfect.
As for the content… really great. I will definitely be using greenshock in my next project!
Thank you
Excellent class! Each topic is thoroughly explained.
I particularly enjoyed your demo on positioning. This is clearly important to know, but tough to learn. Your demo’s help tremendously visualizing how to position objects.
Can’t wait to get started with your other classes 🙂
Thanks!!!
Very good course.
Hope to have see more!
Thanks alot.