overlay

To add dynamic JSX overlays to video tracks, this skill reads editing prompts and transcripts to generate custom JSX components for hooks, lower-thirds, or logos, then integrates them into the project's overlay track. It applies style defaults and animation timing automatically.

Yes, you can generate animated lower-thirds and hooks from a video transcript. The skill analyzes the transcript content and editing prompts to determine appropriate overlays, writing custom JSX files with animation timing that matches the speech cadence.

You need a 1080×1920 canvas size for JSX video overlays in a vertical project. The skill enforces adherence to this specific canvas sizing when authoring JSX components and placing them in the project's overlay track.

To integrate custom JSX components into a video project's overlay track, the skill writes the JSX files using absolute paths and adds them to the correct overlay tracks in project.json. It respects canvas size, z-ordering, and render constraints during integration.

Yes, the overlay skill requires absolute file paths for video annotations. Along with access to the project's overlay track and 1080×1920 canvas sizing adherence, absolute paths are necessary to correctly render the JSX components in the video project.

The best way to automate adding stat cards and logos to a video is using an agent-driven skill that reads prompts to determine overlay types. It writes custom JSX files for each stat card or logo and adds them to the project's overlay tracks with correct z-ordering and animation timing.