CtrlK
BlogDocsLog inGet started
Tessl Logo

remotion-to-hyperframes

Port an existing Remotion (React) composition to HyperFrames HTML. Use ONLY when the user explicitly asks to port/convert/migrate/translate a Remotion source. Do NOT use: (a) authoring a new HyperFrames composition; (b) Remotion mentioned in passing; (c) Remotion code shared as reference only; (d) "same video as my Remotion one" without explicit migrate request — treat as fresh build. Doubt → `/general-video`. One-way, Remotion-only: no reverse export (HyperFrames→Remotion or any framework), no non-Remotion source (After Effects, Framer Motion, plain React/CSS) → out of scope, re-create via `/general-video`. Flags unsupported patterns (useState, useEffect, async calculateMetadata, third-party React libs, `@remotion/lambda`) and recommends runtime interop over lossy translation. Unsure whether to port vs. build fresh, or only a passing Remotion mention? → /hyperframes.

77

Quality

96%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Low

Low-risk findings worth noting

SKILL.md
Quality
Evals
Security

Quality

Content

92%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A high-quality instruction/code skill body: executable workflow with validation gates and feedback loops, copy-paste commands with exact thresholds, and well-signaled one-level-deep references backed by real bundle files. The only minor drag is some overlap between the body's scoping prose and the frontmatter description.

Suggestions

Trim the repeated scope/route guidance in the body ('When to use', 'NOT SUPPORTED', 'Read /hyperframes first') since the frontmatter description already covers it; keep one canonical 'When to use' block and link out.

Consider collapsing the 'What this skill explicitly does NOT do' section into the existing 'When to use' / lint-step blockers, since the useState/useEffect rationale is already stated in Step 1.

DimensionReasoningScore

Conciseness

Mostly lean and action-oriented with no padding of concepts Claude already knows, but the 'When to use'/'Do NOT use'/'NOT SUPPORTED' material partially duplicates the frontmatter description and the overview's caveat block, adding some repetition that could be tightened.

4 / 5

Actionability

Fully executable guidance — concrete lint categories with specific APIs, a copy-paste render/diff bash block, exact threshold values (~0.02 below p05), and a pixel-format fix (Config.setVideoImageFormat('png') + bt709) covering the common cases.

5 / 5

Workflow Clarity

Five-step sequence (lint → plan → generate → validate → document) with an explicit validation checkpoint ('If any blocker fires, stop'), a feedback loop on diff failure (frame_strip → re-read reference), and a destructive-operation cap satisfied by the lint-gate before translation.

5 / 5

Progressive Disclosure

Body is a concise overview that signals one-level-deep references via a load-decision table (api-map, parameters, sequencing, timing, media, transitions, lottie, fonts, eval, limitations, escape-hatch), each verified as a real file; nothing is deeply nested and navigation is explicit.

5 / 5

Total

19

/

20

Passed

Description

100%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

An exceptionally well-specified description: concrete actions, exhaustive natural trigger terms, explicit what/when guidance, and tight boundary scoping that sharply limits conflict with sibling skills. Written in correct third person throughout. No improvement needed.

DimensionReasoningScore

Specificity

Lists multiple concrete actions — 'Port an existing Remotion (React) composition to HyperFrames HTML', 'Flags unsupported patterns (useState, useEffect, async calculateMetadata, third-party React libs, @remotion/lambda)', 'recommends runtime interop over lossy translation' — giving comprehensive coverage of what the skill does.

5 / 5

Completeness

Explicitly answers both what (port Remotion→HyperFrames) and when ('Use ONLY when the user explicitly asks to port/convert/migrate/translate a Remotion source') with concrete trigger phrases and an enumerated 'Do NOT use' list, hitting the top anchor.

5 / 5

Trigger Term Quality

Comprehensive natural trigger coverage — 'port/convert/migrate/translate a Remotion source' — plus synonyms and concrete exclusions (After Effects, Framer Motion, plain React/CSS, .aep, @remotion/lambda), matching the anchor for full keyword coverage including synonyms and file extensions.

5 / 5

Distinctiveness Conflict Risk

Clear niche — one-way Remotion-only with an explicit out-of-scope list (no reverse export, no non-Remotion source) and doubt-routing to /general-video and /hyperframes — minimizing conflict with adjacent authoring skills.

5 / 5

Total

20

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
calesthio/OpenMontage
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.