skills.rest
Sma1lboy
Sma1lboyCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

motion-graphics

Orchestrate asset sourcing, layout planning, and GSAP-based animation for short motion graphics.

94|7|Updated May 9, 2026
Search Tags:#automation#animation#video-production#motion-graphics#kinetic-typography#data-viz
One-click install
npx skills add https://github.com/Sma1lboy/kobe --skill motion-graphics-sma1lboy
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: motion-graphics
Source: https://github.com/Sma1lboy/kobe/tree/main/.claude/skills/motion-graphics
Command: npx skills add https://github.com/Sma1lboy/kobe --skill motion-graphics-sma1lboy

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires node, ffmpeg, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill solves the friction of creating high-quality, short-form motion graphics by automating the orchestration of assets, layout, and animation, allowing you to produce professional-grade visual content without manual keyframing.

Core Features & Use Cases

  • Asset-First Composition: Automatically sources and fuses real-world assets into design-led motion templates.
  • Multi-Category Support: Handles diverse formats including kinetic typography, data visualizations, logo reveals, and social media overlays.
  • Use Case: Quickly generate a punchy, branded data-viz video for a social media update by providing a link to a news article or webpage, which the skill then captures, analyzes, and animates into a 10-second motion graphic.

Quick Start

Use the motion-graphics skill to create a kinetic typography video for the quote 'Motion is the message' with a punchy, energetic style.

Frequently Asked Questions about motion-graphics

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

FAQPage Schema
How do I automate motion graphics production without manual keyframing?▼

You can automate motion graphics production by orchestrating asset sourcing, layout planning, and GSAP-based animation to render professional video output without manual keyframing. It coordinates subagent-driven design workflows deterministically.

Do I need Node.js and FFmpeg to render automated kinetic typography videos?▼

Yes, you need a local environment with Node.js and FFmpeg installed to execute the deterministic rendering pipelines and coordinate the subagent-driven design workflows required for kinetic typography video output.

Can I generate a data visualization video directly from a webpage link?▼

Yes, you can generate a data visualization video by providing a link to a news article or webpage. The tool captures and analyzes the web content, then animates it into a short, design-led motion graphic.

What is the best way to create short-form social media overlays withGSAP?▼

The best way to create short-form social media overlays with GSAP is to use an asset-first composition workflow that automatically sources real-world assets and fuses them into design-led motion templates for professional video output.

What types of motion graphics categories can I produce using automated layout planning?▼

You can produce diverse short-form motion graphics categories including kinetic typography, data visualizations, logo reveals, and web-capture overlays by integrating asset sourcing with automated layout planning.

Related Skills

Explore More Design & Creative Skills→
aayushsoamaayushsoam
1

hyperframes

Creates animated videos from HTML compositions using GSAP and FFmpeg.

Community
Advanced
sunnypatneedisunnypatneedi
11

ugc-content-creator

Generate short-form video scripts with hooks, storytelling, and CTAs.

Community
Basic
chmonitorchmonitor
255

motion-graphics

Create short design-led motion graphics with transparent alpha overlay exports.

Official
Advanced
ag47-ptag47-pt
1

motion-design

Plan motion design workflows from concepts to animated video experiences.

Community
Advanced