ContentVideo · Podcast

Vid Motion Graphics

Generates motion graphics videos (MP4) from a content brief.

by Varnan Tech·MIT·263 on GitHub·updated 2026-05-14
npx skills add Varnan-Tech/opendirectory

Description

Generates motion graphics videos (MP4) from a content brief. Multi-scene HTML/CSS animations rendered frame-by-frame in headless Chromium via Playwright, assembled with FFmpeg. 1080×1080 default, 16:9 (1920×1080) and 9:16 (1080×1920) supported. 5 style presets. Trigger when user says "create a video", "motion graphic", "animated video", "make a reel", "create an explainer", "animated infographi...

What this skill does

  1. 1Takes a content brief and derives a scene structure of up to 6 scenes — hook, supporting points, and CTA — with one key idea per scene.
  2. 2Assigns a scene type from a library (title card, stat reveal, bullet list, split screen, quote card, CTA card) and loads style tokens from 5 presets.
  3. 3Generates a self-contained HTML file using a pure JS renderFrame function for deterministic frame-by-frame Playwright capture, with no CSS keyframe transitions.
  4. 4Renders the HTML to MP4 via headless Chromium and FFmpeg at configurable fps and aspect ratio (1:1, 16:9, 9:16), with optional background music.

When to use

  • You need a short motion graphics video from a data point or content brief without a video editor.
  • You want a LinkedIn or Instagram reel showing key metrics or a framework in under 10 seconds.
  • You are creating an animated infographic and need an MP4 output from text content alone.
  • You want a reusable video format for recurring report summaries or product updates.

Tools used

LinkedIn· SocialInstagram· SocialYouTube· Social

Best for

Marketing Manager

Format

Generator

Frequently asked questions

What is Vid Motion Graphics?

Vid Motion Graphics is a Claude Code skill for content by Varnan Tech. Generates motion graphics videos (MP4) from a content brief.

When should I use Vid Motion Graphics?

You need a short motion graphics video from a data point or content brief without a video editor. You want a LinkedIn or Instagram reel showing key metrics or a framework in under 10 seconds.

How do I install Vid Motion Graphics?

Run the install command (npx skills add Varnan-Tech/opendirectory). Once the skill is in place, Claude Code loads it automatically whenever a task matches what it does.

Is Vid Motion Graphics free to use?

Yes. Vid Motion Graphics is open source under the MIT license, published in the Varnan-Tech/opendirectory repository on GitHub.

Source repository

More from Varnan-Tech/opendirectory

Other skills that might interest you