Skip to content

v0.0.2 — Remotion → HyperFrames

Choose a tag to compare

View all tags
@nebrass nebrass released this 04 Jun 11:05
v0.0.2
c6b42fe
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode.

Migrated the rendering engine from Remotion (React, server-rendered) to HyperFrames (HTML + GSAP + headless Chromium) across the whole 6-phase pipeline, then extended it with first-class video-clip capture and a new tutorial content mode. Shipped via #2.

▶️ Watch the demo: 60-second promo on YouTube — the skill produced its own launch video.

Changed

  • Rendering engine: Remotion → HyperFrames. All six workflows/phase-*.md rewritten. New scene authoring model (sub-compositions + data-composition-id + GSAP timelines on window.__timelines) replaces Remotion JSX compositions. Phase contracts updated end-to-end across SKILL.md, CLAUDE.md, and .github/copilot-instructions.md.
  • Phase 2 capture contract generalized from "screenshots" to capture artifacts (public/screenshots/ and/or public/clips/).
  • patterns/visual-patterns.md fully rewritten for GSAP — adds the tl.fromTo() stagger-trap rule, autoAlpha guidance, and tl.set for late-entry elements.
  • patterns/metallic-swoosh.md reworked as an inline root-timeline pattern.

Added

  • Tutorial / walkthrough content mode — a third mode beside promo and showcase: task-ordered chapters with a cold-open on the payoff, required baked captions, footage-time legibility punch-in for sub-24px UI text, a recap archetype, a "Step N of M" / chapter overlay, and a ~90s segment cap. Warns-and-degrades to stills when clips are absent.
  • Video-clip capability — real motion footage as a first-class, source-agnostic capture artifact: clip-scene archetype templates/scene-clip.html ("Wiring S") with footage-locked durations; Chrome DevTools screencast web capture (experimental, feature-detected) and a dependency-free terminal path for CLI (templates/scene-terminal.html, optional asciinema+agg); a footage quality gate.
  • 10 vendored brand design presets in design-systems/<slug>/DESIGN.md (Stripe, Linear, Apple, Notion, Vercel, Airbnb, GitHub, Cal, Arc, Bento) — original MIT-licensed prose — plus CONTRIBUTING.md.
  • New pattern files: patterns/INDEX.md, anti-slop.md, marker-highlight.md, transition-catalog.md.
  • example/ — a self-contained reference promo project built by the pipeline itself.
  • CLAUDE.md codebase guide and a top-level .gitignore.
  • Opt-in clip-own audio mixed under a ducked voiceover (sidechain) in Phase 5.
  • CLI inventory entries add and doctor; screencast_* + resize_page added to allowed-tools.

Fixed

  • scripts/generate_voiceover.py hardening: absolute-path ffmpeg concat, list-or-dict transcript parser, mktemp → mkstemp, non-zero exit on a failed TTS section, guards for null word timestamps and ffprobe N/A durations, a mid-loop tempfile leak, word-level timestamps for overlap detection, and voiceover-overrun warnings.
  • HyperFrames lint/inspect/validate/render gates take a project directory, not a file.
  • gsap.from() → tl.fromTo() (the stagger trap) across workflows, patterns, and templates.
  • Three rounds of Copilot review fixes plus a max-effort code-review pass.

Removed

  • The Remotion / React rendering path.
  • The committed example/out/final.mp4 binary (3.4 MB) — no longer tracked in git (regenerable build artifact; the demo lives on YouTube, rebuild via example/README.md).

📋 Full changelog: CHANGELOG.md · Compare: v0.0.1...v0.0.2

Assets 2
Loading