# Create Motion Graphics

Use whenever the agent needs to add, create, hand-author, patch, or place Motion...

- Repository: https://github.com/0xsline/OpenChatCut (2832 stars)
- Category: AI and agents
- License: AGPL-3.0
- Last updated: 2026-10-21
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add 0xsline/OpenChatCut --skill create-motion-graphics -g -a claude-code -y`
Codex: `npx skills add 0xsline/OpenChatCut --skill create-motion-graphics -g -a codex -y`
Cursor: `npx skills add 0xsline/OpenChatCut --skill create-motion-graphics -g -a cursor -y`
Gemini CLI: `npx skills add 0xsline/OpenChatCut --skill create-motion-graphics -g -a gemini-cli -y`

## Description

Use whenever the agent needs to add, create, hand-author, patch, or place Motion Graphic JSX assets in a OpenChatCut project. This is the direct-authoring path: use create_motion_graphic_from_code / edit_asset / edit_item, not motion-graphic-gen or submit_motion_graphic. Covers project/timeline intake, project visual language, editable properties, asset binding, inline JSX authoring, existing asset updates, timeline placement, and verification.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Create Motion Graphics

Use this skill when a OpenChatCut task requires a Motion Graphic asset that the agent will author or patch as inline JSX.

This skill is for direct authoring. Do not translate the request into a Gemini prompt or generation brief, and do not call `submit_motion_graphic`, when this workflow is active.

Even though `submit_motion_graphic` exists in the tool list, treat it as the generation route, not this one. Ignore that path for MG work; use `create_motion_graphic_from_code` for new JSX assets and `edit_asset` for existing MG JSX. If the direct-authoring tools are missing, stop and report that the OpenChatCut tool surface is out of date.

Pass source inline through the asset code tools. Do not stage Motion Graphic code in the OpenChatCut repository, `ai-working/`, `/tmp`, a local HTTP server, generated code files, or guessed backend workspace paths.

## Core Principles

- Inspect project state when canvas size, fps, existing visual language, placement, or timeline conflicts are not already known.
- Identify the required inputs in **Before You Code** before authoring JSX.
- Create or update Motion Graphic assets through the available inline-code asset workflow; use current tool schemas for exact payload shapes.
- Place or move assets through the timeline editing workflow when the edit requires timeline placement.
- Re-read project state and verify the visible frame after structural or visual changes.

## Before You Code

Before writing JSX, identify only the information needed for this edit:

The rest: https://github.com/0xsline/OpenChatCut/blob/HEAD/src/agent/skills/create-motion-graphics/SKILL.md