Learn Animation

Make your website pop with eye-catching animations. Read these free animation tutorials to master CSS and JavaScript techniques for creating successful animations.
Read moreRead less
All content
Courses
Tutorials

All Animation tutorials:

  1. TimelineMax: An Introduction to Tweening

    TimelineMax: An Introduction to Tweening

    Tutorial • Intermediate

    In the olden days of animation tweening was a term used to describe a frame by frame sequence, or what’s sometimes referred to as “in-betweens.” It’s that...

  2. TimelineMax: A Primer

    TimelineMax: A Primer

    Tutorial • Intermediate

    What is TimelineMax? What makes it different from other Green Sock Animation Platform (GSAP) libraries? Why would I need TimelineMax over TimelineLite? How...

  3. Create an Animated SVG Loader Using GreenSock’s DrawSVG

    Create an Animated SVG Loader Using GreenSock’s DrawSVG

    Tutorial • Intermediate

    Today’s tutorial is one that will leave you feeling impressed that you’ve written so little code to achieve such a delightful animation. DrawSVG by the...

  4. How to Demo an iOS Prototype in Keynote

    How to Demo an iOS Prototype in Keynote

    Tutorial • Intermediate

    Modeling an up-and-coming app can be a very difficult task if you’re unfamiliar with professional animation software and techniques. Fortunately, Keynote...

  5. How to Use “animateTransform” for Inline SVG Animation

    How to Use “animateTransform” for Inline SVG Animation

    Tutorial • Beginner

    Today we’ll be stepping you through the basics of using “animateTransform” to generate inline animations with SVG (scalable vector graphics).

  6. How to Create CSS Animations Visually With Stylie

    How to Create CSS Animations Visually With Stylie

    Tutorial • Beginner

    Animating on the web can be easy and fun. This tutorial will show you how to use a tool called Stylie to create beautiful animations with just your mouse.

  7. How to Manipulate and Animate SVG With Snap.svg

    How to Manipulate and Animate SVG With Snap.svg

    Tutorial • Beginner

    In this tutorial we're going to introduce Snap.svg, a JavaScript library which assists in animating and manipulating SVG content. To demonstrate some of the...

  8. How to Use After Effects for Web Animation Prototypes

    How to Use After Effects for Web Animation Prototypes

    Tutorial • Beginner

    In this screencast tutorial we're going to prototype an app UI animation. We'll take a Photoshop layout, then bring it to life using Adobe After Effects.

  9. A Beginner’s Introduction to CSS Animation

    A Beginner’s Introduction to CSS Animation

    Tutorial • Beginner

    In this tutorial I am going to introduce you to CSS animations; a highly performant way of animating on the web which is becoming more and more popular as...

  10. Create a Colorful Spinning Wheel in Flash With AS3

    Create a Colorful Spinning Wheel in Flash With AS3

    Tutorial • Beginner

    In this tutorial you'll learn how to create a spinning wheel using Flash and AS3, with an interface that's suitable for both mouse- and touch-based devices.

  11. Animate a Cartoon Explosion With Flash Professional - Basix

    Animate a Cartoon Explosion With Flash Professional - Basix

    Tutorial • Beginner

    In this tutorial we'll show you how to animate an awesome explosion in Flash, which you could use for an cartoony action game. We take you from conception to...

Related Categories

CSS
HTML/CSS
UI Design
Sketch
Unlimited Downloads
From $16.50/month
Get access to over one million creative assets on Envato.
Over 9 Million Digital Assets
Everything you need for your next creative project.
Create Beautiful Logos, Designs
& Mockups in Seconds
Design like a professional without Photoshop.
Join the Community
Share ideas. Host meetups. Lead discussions. Collaborate.