remotion-to-hyperframes
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.
Before you install
- Last update
- Files in folder
- 76
- Scripts
- Contains scripts. Review them before running.
- SKILL.md size
- 4.9 KB (about 1,255 tokens of context each time it loads)
- License
- Apache-2.0
- Source on GitHub
- heygen-com/hyperframes
Skills are plain text instructions the agent follows, sometimes with scripts. Check the source, prefer repositories with many installs and stars, and read any script it ships.
Install
npx skills add heygen-com/hyperframes@remotion-to-hyperframesRuns in a terminal with Node.js 18 or newer. Add -y to skip the prompts and -g to install for every project instead of this one.
Install for your agent
npx skills add heygen-com/hyperframes@remotion-to-hyperframes --agent claude-code -y- Project install writes to
.claude/skills/remotion-to-hyperframes- Global install writes to
~/.claude/skills/remotion-to-hyperframes
Start a new session afterwards so the agent picks the skill up. In Claude Code you can also call it directly with /remotion-to-hyperframes.
What it does
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. Level For How Editable in Studio afterwards --- --- --- --- Native code that can become HTML + GSAP: most Remotion, HTML/CSS/GSAP animation, simple Motion Canvas translate it, then verify frame by frame every element; variables,…
Excerpt from the skill's own SKILL.md. Read the full file on GitHub before installing: skills run with your agent's permissions.
Categories
Related skills
- hyperframes-cli
heygen-com/hyperframes
The HyperFrames CLI by job - scaffold, check, look at frames, edit the timeline, preview, render locally or in the cloud, publish, project history - plus reading its JSON and recovering from build or render failures.
- hyperframes
heygen-com/hyperframes
Read first to make, edit, animate or render any video with HyperFrames (HTML rendered to video), including launch films, explainers, music videos, charts, maps, vertical clips, title cards, captions and overlays. Holds the render contract, the work loop and what each kind of video needs.
- media-use
heygen-com/hyperframes
Get or make any media for a HyperFrames video - music, sound effects, images, icons, logos, voiceover, avatar and generated video, transcripts, cutouts, colour grades and looks - with HeyGen or free local tools, and mix placed audio. Also for footage that looks dark, flat or dull, or should be stylized or hidden.
1.2M installs 77K scripts - hyperframes-registry
heygen-com/hyperframes
About 450 ready-made HyperFrames blocks and components installed as editable source - transitions, overlays, titles, kinetic type, captions, charts, map overlays, 3D, camera moves. Use it before hand-building any named visual (CRT scanlines, glitch, film grain, a chart); also for hyperframes add and catalog.
- slideshow
heygen-com/hyperframes
Build a HyperFrames slideshow to present live - slides, fragment reveals, branching hotspots and presenter mode with speaker notes, served by `hyperframes present` - or turn an existing page into one. Use when the person wants a deck or presentation rather than a rendered video.
- figma
heygen-com/hyperframes
Bring Figma into a HyperFrames video - rendered assets, brand tokens, components, storyboard frames as reconstructed motion (frames read as states, not slides), shaders and connector-assisted motion. Use when the person pastes a figma.com link or asks to use a Figma design, frame, logo or brand.