hyperframes

Render MP4 videos from HTML compositions with GSAP timelines.

Updated May 11, 2026
One-click install
npx skills add https://github.com/jason660519/Project-Manager --skill hyperframes-jason660519
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: hyperframes
Source: https://github.com/jason660519/Project-Manager/tree/main/hermes-agent/optional-skills/creative/hyperframes
Command: npx skills add https://github.com/jason660519/Project-Manager --skill hyperframes-jason660519

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

HyperFrames enables rapid production of video content from HTML-based compositions, removing manual wiring between media, captions, and transitions.

Core Features & Use Cases

  • HTML-driven video: Use HTML and GSAP to author deterministic timelines for video rendering.
  • Captions & TTS: Auto-captioning and TTS narration integrated with per-scene timing.
  • Website-to-video: Convert websites into promotional videos or product tours with scripted flows.

Quick Start

Scaffold a new HyperFrames project and render a final MP4 from an HTML composition.

Frequently Asked Questions about hyperframes

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I render HTML compositions into MP4 videos using GSAP timelines?

To turn HTML into video, you scaffold a project using the HyperFrames CLI and render the HTML composition into a final MP4. This process relies on Node.js and FFmpeg to process GSAP-driven deterministic timelines for reproducible video output.

Can I add captions and TTS narration to website-to-video workflows?

Yes, website-to-video workflows support integrated auto-captioning and TTS narration with per-scene timing. Captions and TTS are synchronized directly within the HTML-driven video timeline, removing manual wiring between media and text tracks.

Do I need Node.js and FFmpeg to produce videos from HTML?

Node.js, FFmpeg, and the HyperFrames CLI are required dependencies to produce videos from HTML. These environment tools are strictly necessary for executing deterministic timelines and generating reproducible MP4 renders from your compositions.

What is the best way to create social promos with audio-reactive visuals and shader transitions?

The best way to create social promos is using HTML-driven video production with audio-reactive visuals and shader transitions. This approach uses GSAP timelines to manage per-scene timing, ensuring deterministic and reproducible renders for promotional content.

Are there limitations when converting websites into product tour videos?

Converting websites into product tour videos requires deterministic timelines, meaning all scripted flows must be explicitly defined within the HTML composition. Non-deterministic or dynamically loading website elements may not render correctly without strict GSAP timeline enforcement.