Skills

Remotion To HyperFrames

Ports Remotion and other animation code into HyperFrames, checked frame by frame.

Install

npx skills add heygen-com/hyperframes --skill remotion-to-hyperframes -g -a claude-code -y
Repository
heygen-com/hyperframes77.1k
Category
Media
Updated
3d ago
License
Apache-2.0
Context cost
Lightabout 1,162 tokens
Runs scripts
Yes, review before use

What it does

Bring existing video code or footage into HyperFrames and verify it frame by frame against the original - Remotion first, also Motion Canvas, Lottie, Three.js, p5.js, canvas or plain HTML/CSS animation, or renders from Manim, After Effects or Blender. Use to port, convert, migrate or reuse work made with another tool.

Plugin installs: Before setup or freshness commands, follow plugin execution rules when this skill is inside a HyperFrames plugin.

Import into HyperFrames

HyperFrames is the container: its tracks, sub-compositions and variables are editable in Studio whatever runs inside a clip. Bring each part in at the highest level it supports and record which level you used.

LevelForHowEditable in Studio afterwards
Nativecode that can become HTML + GSAP: most Remotion, HTML/CSS/GSAP animation, simple Motion Canvastranslate it, then verify frame by frameevery element; variables, catalog, presets apply
Hostedcode that can draw any requested frame in a browser: canvas, p5.js, Three.js, Lottie, WebGL, other JS animationkeep the code and drive it from HyperFrames timetiming, position, exposed parameters
Mediaanything that outputs video or frames: Manim, After Effects, Blender, PIL, moviepyrender to a file and use it as a clipcut, place, layer; not the pixels inside

Code that depends on wall-clock time, live physics or the network can only come in as media.

Native: translate, then verify

Read the whole SKILL.md on GitHub

More in Media