MCPInstall

tesseract-motion

Create editable motion graphics locally in Tesseract, including full-frame animated scenes, typography, diagrams, lower thirds, and overlays on supplied footage. Use for focused motion-design work; use tesseract-video for assembling or revising a complete footage edit.

Installs
3K
Last 24h
+26
Trending rank
#4826
Security
Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/mirage-hq/tesseract --skill tesseract-motion
  1. 01

    Install

    Run the command in your project. The CLI asks which agents to install for.

  2. 02

    Describe the task

    Ask your agent for something this skill covers. It loads tesseract-motion automatically when relevant.

  3. 03

    Review the result

    The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Design motion with Tesseract

For converting files to or from other editing tools, such as Premiere Pro or After Effects, read conversion. When opening shared or older .tsrct files, updating tools, or investigating load/render differences, read versions and compatibility.

The CLI may send basic usage telemetry for some commands. You can provide optional attribution via TESSERACT_SKILL=tesseract-motion and the other attribution variables. Respect the CLI's telemetry opt-out setting; never enable telemetry on the user's behalf.

Create a moving composition with a clear visual idea. Establish what the motion communicates, its rhythm, the destination canvas, and whether this is a full scene or an overlay that must leave footage visible.

When designing an ad opening, read ad hooks: develop a clear visual idea tied to the actual product/message, align its key arrival to confirmed opening music cues when available, and preview it together with the next scene. Sound and transitions strengthen the idea; they are not a required effects stack.

  1. Resolve this skill's root from the directory containing this SKILL.md. Read CLI installation and check the required Tesseract version once per session. Use the resolved executable path throughout the task. Read local operation and native authoring.
  2. Read motion design. Use the supplied brand/style references. For an overlay, inspect the actual footage at the intended placement and timing; design around the subject, text, and action.
  3. Choose a useful mechanism—typography, paths, masks, precomps, a diagram, or a media treatment. Use native layers and a coordinated AnimationGraph. Existing footage and graphic assets are welcome; a single prerendered image of the design defeats editable motion.
  4. Retrieve the specific definitions needed from tsrct project schema or tsrct project schema --document. FX authoring and motion show working wire shapes and local rendering, not mandatory designs. For subject occlusion use actual person mattes when supported, not an approximate hand-drawn silhouette.
  5. When supplied or previously generated music sets the rhythm, read waveform editing: open a music waveform, listen to confirm accents and phrase changes, and map animation arrivals/reveals to the selected music events before authoring timing. Preserve the chosen track; do not mistake every peak for a beat or sync every movement mechanically. Read sound design when the graphic is part of an audible video. Add a local accent or transition sound when it strengthens the movement; leave it quiet when speech or the existing mix already carries the moment. Keep sound in separate Audio layers, and use audio and timing for importing files, placement, and envelopes. A silent-overlay request stays silent.
  6. Use filmstrip review to inspect and correct the saved animation during construction. Finish with review and delivery, including playback in context.

Output an editable composition in a portable .tsrct document and a rendered preview. Composite overlays over the supplied footage as native layers. For a transparent overlay, use export --format prores --fx-solo compositionId:layerId --output overlay.mov and verify the alpha channel. Solo export covers the target’s active window without audio; full-project MOV export preserves the project mix.

Prefer supported effects and native text/shape animation. For an unusual visual treatment use custom WGSL only after reading the custom shader contract. Never invent API fields, keyframe formats, or a capability such as arbitrary 3D mesh import that this runtime does not provide.

FAQ

What does the tesseract-motion skill do?

Create editable motion graphics locally in Tesseract, including full-frame animated scenes, typography, diagrams, lower thirds, and overlays on supplied footage. Use for focused motion-design work; use tesseract-video for assembling or revising a complete footage edit.

How do I install tesseract-motion?

Run npx skills add https://github.com/mirage-hq/tesseract --skill tesseract-motion in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/tesseract-motion/ (personal) or .claude/skills/tesseract-motion/ (project).

Which AI agents can use tesseract-motion?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is tesseract-motion safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains tesseract-motion?

It is published by mirage-hq in mirage-hq/tesseract. It has 3,020 recorded installs.

More from mirage-hq/tesseract

View all →

tesseract-video

mirage-hq/tesseract

Edit existing footage into finished videos locally with Tesseract. Make cuts, preserve dialogue, add purposeful sound design, mix audio, and decide where native motion-graphics scenes or overlays improve the story. Use for video editing and revising Tesseract projects, not avatar or video generation.

Media & Creative3K installs

tesseract-design

mirage-hq/tesseract

Create and revise static visual designs as editable Tesseract compositions and rendered PNGs, including posters, social graphics, slide layouts, diagrams, and web/UI mockups. Use when the requested deliverable is a design image.

Frontend & Design1.4K installs

tesseract-editor

mirage-hq/tesseract

Build or modify a custom browser editor for Tesseract .tsrct files. Use for editor controls, previews, and saving projects; use the motion or video skill for direct project authoring.

Media & Creative1.3K installs

Popular frontend & design skills

View category →

setup-matt-pocock-skills

mattpocock/skills

Configure this repo for the engineering skills: set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.

Frontend & Design1.1M installs

frontend-design

anthropics/skills

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.

OfficialFrontend & Design1M installs

hyperframes-animation

heygen-com/hyperframes

All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.

prototype

mattpocock/skills

Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.

Frontend & Design999.2K installs

hyperframes-core

heygen-com/hyperframes

The HyperFrames composition contract — build one renderable project. Use for composition structure, the data- timing attributes, class="clip", tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.

Frontend & Design930.5K installs

vercel-react-best-practices

vercel-labs/agent-skills

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

OfficialFrontend & Design843.1K installs