# Convert Remotion Projects to HyperFrames

Moving a supported Remotion composition to HyperFrames requires mapping React timing and scene logic to HTML and GSAP. This skill guides the migration, identifies unsupported patterns, and validates visual fidelity.

## Install

```bash
npx skillstore add heygen-com/remotion-to-hyperframes
```

## Metadata

- Status: approved
- Slug: heygen-com-remotion-to-hyperframes
- Skillstore revision: r2
- Version status: missing
- Tree hash: 276259eafa08675554d33c5deb96d0ce52fb1092d66bac11e60b329b2b562559
- Author: heygen-com
- GitHub username: heygen-com
- License: MIT
- Repository: https://github.com/heygen-com/hyperframes/tree/main/skills/remotion-to-hyperframes/
- Ref: 77d0e66fbadeb1f5d1e6a5aada7861240b8ed2d7
- Supported tools: Claude, Codex, Claude Code
- Audit status: complete
- Agent install advisory: confirmation\_required
- Manual install advisory: allowed
- Artifact signature: available
- Audit attestation: unavailable
- Human verification: not\_verified
- Risk factors: external\_commands, filesystem, network, env\_access, scripts
- Quality score: 38
- Quality tier: warning
- Public page: https://skillstore.pages.dev/skills/heygen-com-remotion-to-hyperframes
- Manifest: https://skillstore.pages.dev/api/skills/heygen-com-remotion-to-hyperframes/manifest

## Capabilities

- Classifies whether an explicit Remotion-to-HyperFrames migration request matches the skill.
- Lints Remotion source for state, effects, async metadata, and unsupported React libraries.
- Maps supported Remotion composition, sequencing, timing, media, transition, font, and Lottie patterns to HyperFrames guidance.
- Produces guidance for an HTML composition with a paused GSAP timeline and composition metadata.
- Explains how to compare Remotion and HyperFrames renders with SSIM and frame strips.

## Use Cases

- Migrate a marketing video: Convert a supported Remotion marketing composition into a seekable HyperFrames HTML animation.
- Assess migration readiness: Lint a Remotion codebase and identify blockers before committing to a migration.
- Validate a conversion: Compare baseline and translated renders to identify frames that need adjustment.

## Prompt Templates

### Start a migration

```
Convert this existing Remotion composition to HyperFrames. First identify any unsupported patterns.
```

### Check source compatibility

```
Run the Remotion compatibility review on this source directory and list blockers, warnings, and supported APIs.
```

### Translate scene timing

```
Translate this Remotion composition into HyperFrames HTML and GSAP. Preserve scene timing, dimensions, fps, and scalar props.
```

### Plan visual validation

```
Create a validation plan for this Remotion-to-HyperFrames migration. Include baseline rendering, SSIM comparison, frame-strip diagnosis, and translation notes.
```

## Limitations

- Only supports one-way migration from existing Remotion source to HyperFrames.
- Does not translate interactive React state machines or effects with non-empty dependencies.
- Some media behavior, custom presentations, and font choices can require approximation or manual work.
- Rendering and visual comparison require the local Remotion, HyperFrames, Node.js, and FFmpeg tooling.

## Best Practices

- Run the source lint before generating a translation.
- Validate with equivalent dimensions, fps, and pixel format before comparing renders.
- Write translation notes for every dropped, substituted, or approximated behavior.

## Anti Patterns

- Do not use this skill for a new video or a non-Remotion source.
- Do not translate state-driven or effect-driven compositions after the lint reports a blocker.
- Do not treat a visual preview as proof of frame-level fidelity.

## Security Audit

- Audited at: 2026-07-19T11:15:39.688\+00:00
- Summary: Most static alerts are false positives from Markdown backticks, JavaScript template literals, fixed repository-relative paths, and validation tooling. However, SKILL.md instructs agents to silently run an npx-based skill update before use, which can retrieve and replace content without user consent.

## Stats

- Views: 69
- Downloads: 11
- Favorites: 0
- Popularity score: 0