Text animation node

This wiki shows how to use the Text-Animation node in Olive 0.2 and how to compose several Text-Animation nodes to create complex text animations.

NOTE: The contents of this page are applicable when PR 1974 is merged.

The following picture shows the Text-Animation node setup with default values. The output of the Text-Animation node can be plugged in a Text node to produce a default animation.

In order to let this setup produce the default animation, all we have to do is key-frame the "Progress" input from 0 to 1 over the desired time span.

With default values, the vertical offset of each letter is animated from 250 pixels to 0, with a timing overlap (more on this later). Each animator node animates one aspect (position, rotation, scale, ...) of a part of the text that is plugs into. Each letter is animated from with its own timing from the start value to zero. We will now analyze each input of this node to see its meaning and usage.

Animators

This input can be connected to the output of another Text-Animation node in order to create a composition of animations. You can cascade as many animations as you want; each one animates a different feature and/or a different subset of the text.

Feature

This is the aspect of the text that is animated. Supported features are:


Vertical position		Positive means "rightward", negative means "leftward"
Horizontal position		Positive means "downward", negative means "upward"
Rotation		Angle in degrees. Positive means clockwise
Spacing		Space between letters. This is similar to 'horizontal position' but, changing this value, the first character of each line keeps its position and the distance between adjacent characters grows within the line.
Horizontal stretch		Use 0 for no stretch. Values from 0 to -1 compress, while greater than 1 expand
Vertical stretch		Use 0 for no stretch. Values from 0 to -1 compress, while greater than 1 expand
Transparency		Use 0 for fully opaque and 255 for full transparency

First Index

This is the index of the first character that the animation is applied to. Use 0 to start from the begin of the text.

Last Index

This is the index of the last character that the animation is applied to. Special value -1 indicated the end of the text. If this value is lower than "First index", nothing is animated.

Last to First

This is a flag. When not set (default), the character at 'First Index' starts the animation as first. When set, the character at 'First Index' starts the animation as last.

In the following pictures, the one on the right has 'Left-To-Right' set as true.

last_to_first

Stride

When this value is 0, the animation is applied to all characters from first to last index. If greater than 0, this is the number of characters that are skipped (animation not applied) for every character to which animation is applied.

Value

This is the entity of the animation, such as the size of the displacement or the angle of the rotation. Value 0 means "feature not animated": position zero means no translation, rotation zero means no rotation but also stretch zero means no stretch (while it may be more intuitive to use 1 as if it was a scale factor). Transparency 0 means no transparency, or fully opaque.

Start timing / End Timing

These parameters are used to change the timing of the animation. Suppose we have a text with 5 letters with a feature animated from 1 to 0. In the default case, when both "Start timing" and "End timing" are equal to 1. This means that each letter (including white spaces) are animated in a dedicated time slot. Each letter starts its animation when the previous one ends. The graph below shows how the vale changes over time, (or, more correctly, over "Progress" changing from 0 to 1).

graph_1_1

In point A the animation is not started ("Progress" = 0); in point T the animation is over ("Progress" = 1).

Changing the value of "Start timing" to values lower than 1 has the effect to compress point B,C,D,E closer to point A, so that each letter starts its animation earlier. When "Start timing" is 0, points A to E collapse in a single point, so that all letters start their animation at the begin.

Changing the value of "End timing" to values lower than 1 has the effect to compress point P,Q,R,S closer to point T, so that each letter ends its animation later. When "End timing" is 0, points P to T collapse in a single point, so that all letters finish their animation at the end.

graph_0_1

graph_1_0

graph_05_05

There is also the trivial case when both "Start timing" and "End Timing" are zero: in this case all letters start at point A and finish at point T, so that the whole text moves as it would with the Transform node.

graph_0_0

This is more useful for rotation or stretching.

Curve

This is the shape of the curve used to animate a value. Below are the plots of supported curves. Each plot has an horizontal range from 0 to 1, that corresponds to the "Progress" input. When Progress is 0, the curve has always a value of 1, meaning that the feature being animated is at the highest value (equal to input "Value"). When progress is 1, the curve has always a value of 0, meaning that the animation is complete (each letter is in the definitive state).

Some curve can be modified by "Curve Modifier 1" and "Curve Modifier 2" (see below).

Supported curves are:


Step
Linear
Ease Out Sine
Ease Out Quad
Ease Out Back
Ease Out Elastic
Ease Out Bounce

(All samples have Start Timing and End Timing set to 0.5)

Curve Modifier 1

This is a coefficient that modifies the shape of the curve. Not all curves are affected by this coefficient. For all curves, value 1 is always a good default value.

The curves that are affected by this coefficient are:

Step: defines the threshold
Ease Out Back: affects the time to reach settling value
Ease Out Elastic: affects the elongation
Ease Out Bounce: affects the bounce height

Curve Modifier 2

This is a coefficient that modifies the shape of the curve. Not all curves are affected by this coefficient. For all curves, value 1 is always a good default value.

The curves that are affected by this coefficient are:

Ease Out Back: affects the elongation
Ease Out Elastic: affects the dumping factor

Progress

This value is in range 0 to 1 and must be key-framed in such range to let animation happen. When progress is 0, the animation is not yet started; when progress is 1, the animation is complete. There are cases when Progress can be animated from 1 to 0 to obtain a reversed effect.

Examples

This section holds a gallery of node setups that can be downloaded and pasted in an Olive project. The node setup is an XML format text file that can be pasted directly in Node editor.

The fonts I have used in these examples are the following: