animation-editing

name: animation-editing description: Apply entrance, exit, and combo animations to any clip using named presets or fully custom keyframes. Supports clip-level keyframe animations and text/caption stagger animations (letter-by-letter, word-by-word).

animation-editing

Overview

This skill documents how to apply animations to clips using the clip.update command with an animations array. There are two animation types:

Multiple animations can be stacked on a single clip — they composite additively (transforms accumulate, opacities multiply).

How to apply

Use clip.update and replace the entire animations array. The array is always replaced (not merged), so include all animations you want active.

{
  "type": "command",
  "description": "Apply fade + scale + slight rotate entrance to clip",
  "command": {
    "type": "clip.update",
    "payload": {
      "id": "<clipId>",
      "updates": {
        "animations": [
          {
            "type": "keyframes",
            "options": {
              "duration": 800000,
              "delay": 0,
              "easing": "easeOutCubic",
              "iterCount": 1
            },
            "params": {
              "0%": { "opacity": 0, "scale": 0.85, "angle": -6 },
              "100%": { "opacity": 1, "scale": 1, "angle": 0 }
            }
          }
        ]
      }
    }
  }
}

To clear all animations from a clip, set "animations": [].

Section 1 — AnimationOptions reference

Available easings

Section 2 — AnimationProps reference (keyframe properties)

These are the properties you can set in any keyframe stop. All timing is handled by options, not here.

Multiplicative defaults: for scale, opacity, brightness — the default at any unspecified stop is 1 (not 0). An omitted property means "no change from base value." Additive defaults: for x, y, angle, blur, motionBlur — the default is 0 (no offset).

Section 3 — Custom keyframe authoring

The agent MUST be able to compose params from scratch. Do not only pick from presets — build custom animations when the user describes a specific look.

Entrance animation (starts at 0%, ends at 100%)

"params": {
  "0%": { "opacity": 0, "scale": 0.85, "angle": -6 },
  "100%": { "opacity": 1, "scale": 1, "angle": 0 }
}

Exit animation (starts at 100%, ends at 0%)

Set delay = clip_duration_us - animation_duration_us so it fires at the end.

"options": { "duration": 600000, "delay": 4400000 },
"params": {
  "0%": { "opacity": 1, "scale": 1 },
  "100%": { "opacity": 0, "scale": 0.85 }
}

Multi-stop with overshoot (bounce effect)

"params": {
  "0%": { "scale": 0, "opacity": 0 },
  "60%": { "scale": 1.15, "opacity": 1 },
  "80%": { "scale": 0.95 },
  "100%": { "scale": 1 }
}

Per-segment easing override

Each keyframe stop can have its own easing key that overrides the global easing for that segment:

"params": {
  "0%": { "x": -400, "opacity": 0 },
  "70%": { "x": 20, "opacity": 1, "easing": "easeOutBack" },
  "100%": { "x": 0 }
}

Common custom recipes

Section 4 — Named Preset Catalog

Use a preset by setting "type": "keyframes" and copying the params directly. Alternatively, reference the preset name as a shorthand when the user's intent clearly matches.

Entrance presets (set delay: 0)

Exit presets (set delay = clip_duration - animation_duration)

Combo presets (full clip duration, set mirror: 1 in all keyframes)

Combo animations fill the entire clip duration. Always set duration = clip_duration_us.

Caption-specific keyframe presets (for Caption clips only)

Section 5 — Stagger animations (Text and Caption only)

Stagger animations use GSAP to animate individual characters or words within a Text or Caption clip.

⚠️ Only valid for Text and Caption clip types. Do NOT use on Video, Image, or Audio.

Use "type": "stagger" and provide params with type, from, to, and stagger:

{
  "type": "stagger",
  "options": {
    "duration": 1200000,
    "delay": 0,
    "easing": "power2.out",
    "iterCount": 1
  },
  "params": {
    "type": "word",
    "from": { "alpha": 0, "y": "+=40" },
    "to": { "alpha": 1, "y": "-=40" },
    "stagger": 0.08
  }
}

Stagger params fields

GSAP stagger property reference

Named stagger presets (by character)

Named stagger presets (by word)

Section 6 — Applying to multiple clips (batch)

Use the array form of clip.update to apply animations to multiple clips at once:

{
  "type": "command",
  "description": "Apply alternating slide-in directions to all image clips",
  "command": {
    "type": "clip.update",
    "payload": [
      {
        "id": "clip_img_1",
        "updates": {
          "animations": [
            {
              "type": "keyframes",
              "options": {
                "duration": 700000,
                "delay": 0,
                "easing": "easeOutCubic",
                "iterCount": 1
              },
              "params": { "0%": { "x": -400, "opacity": 0 }, "100%": { "x": 0, "opacity": 1 } }
            }
          ]
        }
      },
      {
        "id": "clip_img_2",
        "updates": {
          "animations": [
            {
              "type": "keyframes",
              "options": {
                "duration": 700000,
                "delay": 0,
                "easing": "easeOutCubic",
                "iterCount": 1
              },
              "params": { "0%": { "x": 400, "opacity": 0 }, "100%": { "x": 0, "opacity": 1 } }
            }
          ]
        }
      }
    ]
  }
}

Section 7 — Stacking multiple animations

Multiple animations can coexist on one clip. They accumulate additively. This is useful for combining a clip-level entrance with a sustained motion:

"animations": [
  {
    "type": "keyframes",
    "options": { "duration": 800000, "delay": 0, "easing": "easeOutCubic", "iterCount": 1 },
    "params": { "0%": { "opacity": 0, "scale": 0.85 }, "100%": { "opacity": 1, "scale": 1 } }
  },
  {
    "type": "keyframes",
    "options": { "duration": 5000000, "delay": 0, "easing": "linear", "iterCount": 1 },
    "params": { "0%": { "scale": 1 }, "100%": { "scale": 1.08 } }
  }
]

The above applies a fade-in entrance AND a slow Ken Burns zoom over the full clip duration simultaneously.

Section 8 — Timing reference

Microseconds conversion:

• 0.4 s = 400000
• 0.5 s = 500000
• 0.6 s = 600000
• 0.8 s = 800000
• 1.0 s = 1000000
• 1.5 s = 1500000
• 2.0 s = 2000000

Section 9 — Clip type compatibility matrix

When to use

• User says "animate all images sliding in from alternating sides" → batch clip.update with alternating x direction
• User says "fade in, scale and slight rotate" → custom keyframes: { "0%": { opacity: 0, scale: 0.85, angle: -6 }, "100%": { opacity: 1, scale: 1, angle: 0 } }
• User says "letter by letter fade in" → stagger with type: "character", charFadeIn preset
• User says "word by word slide up" → stagger with type: "word", slideFadeByWord or custom word stagger
• User says "typewriter effect" → charTypewriter stagger preset
• User says "combo zoom" or "Ken Burns" → comboZoom1 or custom full-duration scale keyframes
• User says "entrance animation" → keyframes with delay 0, duration ~800000, easeOutCubic
• User says "exit animation" or "outro" → keyframes with delay = clip_duration - animation_duration
• User says "remove animations" → clip.update with animations: []