Skip to content
mcp/skillhub

Agent Skill

Remotion To Hyperframes skill

remotion-to-hyperframesheygen-com/hyperframesskills/remotion-to-hyperframes/SKILL.md

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.

69kApache-2.0

always on

78 tokname + description

once used

1,101 tokSKILL.md body

bundled files

7613 scripts

installs

485kskills.sh

Install the Remotion To Hyperframes skill

Skills CLI (Claude Code, Codex, Cursor and others)

npx skills add https://github.com/heygen-com/hyperframes --skill remotion-to-hyperframes

Claude Code, by hand (all projects)

git clone --depth 1 https://github.com/heygen-com/hyperframes.git /tmp/hyperframes
mkdir -p ~/.claude/skills
cp -R /tmp/hyperframes/skills/remotion-to-hyperframes ~/.claude/skills/remotion-to-hyperframes

For one project only, copy the folder into .claude/skills/ in that project instead. The agent picks it up when a task matches its description.

What it costs your context

Agent Skills load in three steps. Tokens counted with the o200k tokenizer; your model's count will differ a little.

WhenWhat loadsCost
Every sessionName and description78 tok
When the agent uses itThe SKILL.md instructions1,101 tok
Only if opened76 bundled files (166 KB)varies

Until it is used, remotion-to-hyperframes costs about 17× less than the median MCP server we measured (1,362 tokens on every turn). Installing all 26 skills from heygen-com/hyperframes would load 2,615 tokens of descriptions. Skills vs MCP study

Checks

  • Ships scripts the agent can run. Read them before installing.

Checked 2026-10-22 · method

What's inside

The headings of its SKILL.md. Read the full file on GitHub.

  • Import into HyperFrames
  • Native: translate, then verify
  • Hosted
  • Media

More skills from heygen-com/hyperframes

All skills in this repo
  1. hyperframes-cliheygen-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.

    1.2M49 tok idle · 1,806 in use
  2. hyperframesheygen-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.

    1.1M664 tok idle · 1,686 in use
  3. media-useheygen-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.0M6975 tok idle · 1,192 in use
  4. hyperframes-registryheygen-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.

    945k72 tok idle · 942 in use
  5. slideshowheygen-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.

    397k57 tok idle · 1,102 in use
  6. figmaheygen-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.

    311k166 tok idle · 1,386 in use
  7. motion-doctrineheygen-com/hyperframes

    GATEWAY — load FIRST before composing any HyperFrames animation or video. The high-level motion law that makes a multi-scene video feel like ONE continuous camera move instead of a stack of independently-animated slides. Covers the vector law (how you exit determines how you enter, incl. the Z scale-sign rule), the film's current, carrier elements, causal motion, the Seam Gate (build-gate enforcement), the ban on idle wobble (motion must PERFORM, not breathe), stillness-before-climax, and the sustained-motion routes. Routes to the low-level technique skills (cut-the-curve — the full catalog incl. waterfall entry + nudge curve, oversized-cursor, seam-craft). These rules SUPERSEDE generic / upstream motion guidance. [continuity, direction, vector, momentum, seam, transition, ease, performance, idle-motion, narrative-motion, film-grammar]

    60k2187 tok idle · 2,191 in use
  8. captions-overlayheygen-com/hyperframes

    Overlay doctrine for captions in HyperFrames videos — the caption MODEL (drop / rail / embed) and the rule that captions are an OVERLAY composited on top of the film, never a reserved bottom band you shift content up to avoid. Load when adding captions/subtitles to a talking-head or launch video, when deciding whether a phrase should be dropped, ride the verbatim rail, or be promoted to a scarce embedded climax, when laying out a composition that will carry captions (do NOT reserve a keep-out band), or when centering a composition on the true frame center under captions. Applies ON TOP of the `/hyperframes` skill's references/captions.md.

    60k139 tok idle · 1,054 in use