Diwali Special40% off every SkillGild Pro plan

Claim 40%

Halloween Special40% off your first 3 months of SkillGild Pro

Code FESTIVE40Claim 40%

Festive Special40% off your first 3 months of SkillGild Pro

Code FESTIVE40Claim 40%
SkillGild
Sign inCreate account

Apex Reel

Turn your product's real screens into an insane Framer Motion promo reel: 3D device fly-ins, camera dives onto key features, exploded UI layers, screen corridors, floating feature chips, and particle bursts. Renders a frame-exact 1080x1920 MP4 with zero video model hallucination.

  • Included with SkillGild Pro
  • Runs locally in your agent
  • v1.0.0
  • SkillGild
skillgild install apex-reel
Works with
  • Claude Code
  • Codex
  • Cursor
  • Gemini CLI
  • Antigravity
and any MCP client

License: SkillGild · Created by SkillGild

SkillGild

SkillGild

What you get

  • A 1080x1920 vertical MP4 promo reel rendered frame-exact at 30 fps, powered by Framer Motion. No hallucinated AI video, no stock footage.
  • Headless Chrome screen ingestion capturing real high-DPI desktop and mobile viewports with fractional focus coordinates.
  • 12 procedural 3D motion stages: device fly-ins, camera dives, exploded UI layers, infinite screen corridors, feature orbits, and particle counters.
  • A deterministic, self-contained interactive HTML player (reel.html) and clean local render pipeline.
  • Storyboards in structured reel.json adhering to proven viral rhythm: hook (≤3s), product depth, architecture, social proof, and conversion CTA.
  • Full commercial ownership of every frame: pure code execution with zero external video generation models.

Is it a good fit?

Good for

  • Product launches, X / Twitter teasers, TikTok / Reels SaaS showcases, and Product Hunt demos.
  • Web apps, developer tools, AI platforms, and mobile apps with live URLs, local dev servers, or screenshots.
  • Teams who want high-energy 3D motion graphics without paying $5,000 to an agency or waiting weeks for After Effects animators.
  • Showcasing real UI workflows: keyboard shortcuts, dashboard features, integrations, and mobile responsiveness.
  • Automated video generation pipelines integrated into CI/CD or agentic release workflows.

Not for

  • Photorealistic live-action or talking-head video (this is a 3D UI motion-graphics skill).
  • Horizontal widescreen films (Apex Reel is built specifically for vertical 9:16 mobile reels; use Atelier Motion for 16:9 explainers).
  • Generic AI slop video with shifting, distorted elements — every frame here is pixel-exact from real code.

Requirements

  • Node.js 18+ and Python 3 on PATH.
  • Google Chrome, Edge, or Chromium installed (or set CHROME_PATH).
  • ffmpeg on PATH for video rendering (ffmpeg-static is bundled with the npm package).
  • No video API keys, no OpenAI/Anthropic video tokens, and no external rendering subscriptions required.

Install the Apex Reel skill

Choose your agent and run one command. SkillGild signs you in when needed and connects the skill for you.

Install the SkillGild CLI first. If you already have it, run skillgild update once.

  1. Install this skill for Claude Code.

    Terminal
    skillgild install apex-reel --agent claude-code

    On first use, approve the sign-in request in your browser. SkillGild connects Claude Code automatically. Restart or reload your agent, then ask it to use this skill.

Developer detailsAPI examples, server tools and input schemas

How it runs

  1. Your agent starts a session. SkillGild checks your access and allowance, counts one run, and sends the skill's instructions for this task.
  2. Your agent does the work with its own model and tools, in your project. SkillGild makes no AI model call.

Use it from code

Start a session, follow its guide, then end it. Create an API key under Account and pass it as a bearer token.

Terminal
# Prints the session ID, its tools and the instructions for your agent
skillgild session apex-reel
skillgild end <session-id>

Questions

How do I install the Apex Reel skill in Claude Code or other agents?

Install the SkillGild CLI, sign in with skillgild login, and run: skillgild install apex-reel --agent claude-code. Use --agent codex, cursor or gemini-cli for other environments. It installs as a skill directly into your agent.

Does Apex Reel use an AI video generator like Sora or Runway?

No. Your agent captures your real product interface, compiles a deterministic Framer Motion player, and renders it frame by frame in headless Chrome. Every element is sharp, faithful to your actual design, and 100% owned by you.

Can I use Apex Reel with a private repo or a local dev server?

Yes! Point Apex Reel to http://localhost:3000 (or any local port) while your dev server runs, or pass a folder of captured screenshots. It does not require a deployed public URL.

How are the 3D camera dives and exploded UI layers created?

Apex Reel's compiler computes 3D CSS perspective transforms, spring damping physics, and camera dolly-zoom paths onto fractional coordinates extracted from your real DOM elements.

What video formats and resolutions does it produce?

It renders an H.264 MP4 at vertical 1080x1920 (9:16) and 30 fps, optimized for social platforms (X, Instagram Reels, TikTok, YouTube Shorts, LinkedIn), plus an interactive, self-contained reel.html player.

Can I customize the colors, typography, and pacing?

Yes. reel.json exposes theme colors (bg, accent, accent2, hot, muted), scene durations, line text, and camera focus targets for full artistic control.

Related guides

Setup steps and worked examples for this kind of skill.

Reviews

No reviews yet

Used Apex Reel? Your rating helps the next person decide.

Be the first to rate Apex Reel
Tap a star
View all