Animators properties

The text-animator family: each animator's property value tracks - transform deltas, paint lerps, layout shifts, blur, the typography members and the Unicode substitution pair - plus every selector's kind-coherent scalar members, addressed by animator and selector id. Every pattern here reads, keyframes AND drives: a script sweeping a selector's start, end, offset or amount moves the animator's influence across the glyphs per frame, which is the classic scripted text reveal.

Every pattern below is readable from scripts through prop() and layer.prop(); ids in a pattern (like <effect_id>) stand for the entity's real id. Every pattern here is in the drive set: scripts may WRITE each one with set() or a single-output return, per frame.

Worked examples#

Animator members are addressed through their owning layer: animators.<animator_id>.<member> for the animator's property values, and animators.<animator_id>.selectors.<selector_id>.<member> for a selector's scalars. A fresh animator carries the default full-range selector selector_1, and driving any of its scalars (start, end, offset, amount) slides the animator's influence across the glyphs per frame - the classic scripted reveal below drives start.

Worked example: March a reveal across the glyphs#

The scene. A shaped headline reading NUBU MOTION carrying one text animator named Reveal that hides and drops every glyph, waiting for a script to march the selector across the line.

• The comp Marquee: 640 by 360 at 25 fps, 100 frames (4 seconds).
• Headline: a text layer, at [306, 240], filled #e8e6e3, reading "NUBU MOTION".
  • The text animator Reveal (animators.animator_1 in scripts): transform.opacity 0, transform.position [0, 24], with its default full-range selector selector_1.

The script. Add a project script named March and paste:

export const outputs = ["layer_1:animators.animator_1.selectors.selector_1.start"];

export function frame({ frame: now }) {
  return linear(now, 10, 60, 0, 100);
}

Line by line:

• Line 1: The output addresses the Reveal animator's default selector on the Headline layer: animators.animator_1.selectors.selector_1.start, a percent across the line's characters.
• Lines 3-4: The animator hides its covered glyphs (opacity 0, dropped 24 pixels); the selector covers start to end, and end rests at 100. Driving start from 0 to 100 between frames 10 and 60 shrinks the covered range from the left, so the glyphs pop up and fade in one after another, left to right - linear() clamps outside the ramp, holding the line hidden before frame 10 and fully shown after 60.

What you see. The headline starts invisible, then the letters of NUBU MOTION rise into place one after another, left to right, the reveal marching across the line between frames 10 and 60.