skills.rest
ehadziabdic
ehadziabdicCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

hyperframes-cli

Orchestrates the HyperFrames CLI loop for authoring, checking, previewing, and rendering video compositions.

Updated Sep 23, 2026
Search Tags:#cli#animation#ffmpeg#video rendering#compositions#hyperframes#cloud render
One-click install
npx skills add https://github.com/ehadziabdic/WAgents --skill hyperframes-cli-ehadziabdic
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: hyperframes-cli
Source: https://github.com/ehadziabdic/WAgents/tree/main/opencode/skills/hyperframes-cli
Command: npx skills add https://github.com/ehadziabdic/WAgents --skill hyperframes-cli-ehadziabdic

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Authoring programmatic videos with HyperFrames involves many CLI commands across scaffolding, linting, checking, previewing, and rendering, and running them in the wrong order or without the right gates produces broken renders and wasted iterations. This Skill encodes the correct development loop and command contracts so agents and users get verified, approved video output every time. ## Core Features & Use Cases - Full development loop: scaffold with init or capture, search the motion catalog, lint while editing, run the check browser gate, preview in Studio, and render only after approval. - Multi-target rendering: render locally with quality tiers (draft, looks, delivery), in Docker, on HeyGen-hosted cloud, or self-managed on AWS Lambda and Google Cloud Run with JSONL batch support. - Diagnostics and feedback: use doctor, snapshot, timeline --json, and Studio selection context to diagnose build or render failures, then submit structured feedback reports. - Use Case: A user asks an agent to turn a captured website into a rendered MP4; the Skill guides the agent through capture, catalog search, lint, check with snapshots, Studio preview approval, and a verified final render. ## Quick Start Ask the agent to scaffold a new HyperFrames video project and run the lint, check, preview, and render loop to produce a verified MP4.

Frequently Asked Questions about hyperframes-cli

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

FAQPage Schema
How do I render a HyperFrames composition to MP4?▼

Run npx hyperframes check first, open the Studio preview with npx hyperframes preview --background for approval, then run npx hyperframes render --quality looks --output out.mp4. Verify the output exists, is non-empty, and matches the composition duration with ffprobe.

How do I check a HyperFrames project for errors before rendering?▼

Run npx hyperframes lint for fast static feedback while editing, then npx hyperframes check as the final gate. Check reruns lint and audits runtime errors, layout, motion sidecar assertions, and WCAG contrast in one browser session.

Can HyperFrames render videos in the cloud without local Chrome or FFmpeg?▼

Yes, npx hyperframes cloud render uploads the project to HeyGen-hosted infrastructure and downloads the finished video after a one-time auth login. For self-managed infrastructure, use lambda render on AWS or cloudrun render on Google Cloud.

Why does my HyperFrames render fail with a Chrome or FFmpeg error?▼

Run npx hyperframes doctor first; it checks Node.js version, FFmpeg, Chrome, memory, and environment. Missing bundled Chrome is fixed with npx hyperframes browser ensure, and sandboxed hosts that block Chrome require render --docker or cloud rendering.

What is the difference between hyperframes lint and check?▼

Lint is a fast static iteration aid that catches structural issues like missing composition IDs and track overlaps. Check is the required final gate that reruns lint plus runtime, layout, motion, and contrast audits in a browser session, so do not run a redundant lint right before it.

How do I render personalized video batches with HyperFrames?▼

Declare variables in the composition with data-composition-variables, then run npx hyperframes render --batch rows.json with an output template like renders/{name}.mp4. For high-volume batches, lambda render-batch and cloudrun render-batch accept JSONL files with per-row variables.

Related Skills

Explore More Design & Creative Skills→
riipandiriipandi
1

hyperframes-cli

Renders HTML compositions into MP4 videos using HyperFrames CLI and iOS-native frame capture.

Community
Advanced
reason-machinesreason-machines
10

pennydinh-marketing-pipeline-automation

Automates content research, AI scriptwriting, Remotion video rendering, and multi-platform publishing.

Official
Advanced
CodeWithSallyCodeWithSally
13

hyperframes-keyframes

Author seek-safe 2D and 3D keyframe animations for HyperFrames video compositions.

Official
Advanced
gaoqiongxiegaoqiongxie
1

remotion-video

Generate animated MP4 and WebM videos using React and Remotion.

Community
Intermediate