02Geek HTML5 and JavaScript, TypeScript, React, Flash, ActionScript online School
CoursesArchiveBooks
Get Free Access

Animating Numbers with TweenLite

By the end of this chapter you will know how to animate things. We will talk about the importance of timing, eases and explore the most common methods of TweenLite.

Duration:

56:02

Created with

Ben Fhala

Ben Fhala

Ben Fhala is the creative force and founder behind 02geek, a pioneering platform dedicated to making web development accessible to everyone. With over 18 years of experience in the industry, Ben has a deep passion for teaching and a knack for breaking down complex concepts into easy-to-understand lessons.

Animating Numbers with TweenLite Overview

What you'll learn

The backbone and the most simple animation Library element of GSAP is the TweenLite object. The TweenLite object is the based object that enables animation in this library. It's a stripped-down court object that enables you to animate is in control numeric values. All further objects that we'll discover in future chapters are more advanced interpretations of the functionality be explored in this chapter.

By the end of this chapter you will know how to animate things. We will talk about the importance of timing, eases and explore the most common methods of TweenLite.

Intro

In this chapter we'll reintroduce ourselves to animation and explore the core features of the GSAP tween Library.

00:42

Setting up our source files

In this lecture we will set up our first source files starter file. In the process will see how to integrate external source files, at our own script, in an external script that is ours.

04:58

Choosing how to import GSAP

The GSAP animation library contains many source files and this lecture we will make sense out of them. By the end of this lesson you will be familiar with the file structure of the GSAP animation Libr

05:15

Animating from here to there

getting introduced to the three most important functions in the GSAP library: TweenLite.to,TweenLite.from and TweenLite.fromTo.

08:15

Creating a typewriter effect

In this lecture we create our first reusable animation. By the end of this lesson we will have a typewriting effect.

13:49

Reusing the typewriter effect

Coding is about creating reusable elements. Recording isn't about solving a specific problem as much as it's about creating solutions that could be reused.

04:19

Delaying animations

Delays enable us to sequencer animations and control our animations to create animations that make sense.

09:28

The easy way to give animations personality

If you don't change the default ease your animations are bound to have the same taste.

09:17
Download Source Files