A programmatic video production engine that transforms brand data into professional React-based motion graphics using Remotion.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install shellbot-video-generator
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install shellbot-video-generator using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Video Generator (Remotion)?
The Video Generator skill enables developers to architect high-fidelity motion graphics videos using the power of React and Remotion. Unlike basic automated slideshow tools, this Openclaw Skills integration focuses on high-impact programmatic animation to create polished commercials, product demos, and social media content. It strictly adheres to a professional AIDA (Attention, Interest, Desire, Action) narrative framework to ensure every video drives engagement and conversion.
By integrating Firecrawl, the skill automatically extracts brand identity data, including logos, color palettes, and headlines, directly from a provided URL. This ensures that the generated video assets are visually consistent with the target product. The workflow is designed for technical users who want to leverage code-driven video editing while maintaining the agility of AI-assisted content generation.
Video Generator (Remotion) Use Cases
- Automated creation of high-impact product demo videos for SaaS landing pages.
- Generating dynamic social media advertisements using real-time brand scraping.
- Producing programmatic animated explainers for complex technical features.
- Batch production of personalized marketing videos for targeted customer outreach.
- Rapid prototyping of motion graphics concepts using React-based reusable components.
How Video Generator (Remotion) Works
- The skill utilizes Firecrawl to scrape a target website, extracting essential brand data and downloading visual assets automatically.
- It initializes a local Remotion project from a optimized template specifically designed for Openclaw Skills workflows.
- The agent builds React-based scenes following the AIDA story structure, incorporating spring physics and advanced motion graphics principles.
- A local Remotion Studio development server is launched to provide a real-time editing and playback environment.
- A Cloudflare tunnel is established to provide a public URL for instant browser-based previewing and iterative refinement.
- Upon final approval, the skill executes a programmatic render command to export the project into a high-quality MP4 file.
Video Generator (Remotion) Setup
To use this skill, ensure you have a valid FIRECRAWL_API_KEY set in your environment variables. Follow these steps to initialize your first project:
# Initialize a new video project from the template
cd output && bash ../scripts/remotion.sh init my-video-project
# Install the necessary dependencies
cd my-video-project && npm install
# Scrape brand assets to bootstrap the visual design
bash scripts/firecrawl.sh "https://example.com" output/my-video-project/public/images/brand
# Launch the dev server and expose it publicly
npm run dev
bash skills/cloudflare-tunnel/scripts/tunnel.sh start 3000
Video Generator (Remotion) Data Schema & Taxonomy
The skill organizes video projects using a standard React/Remotion structure with specialized asset directories for brand data.
| Directory | Purpose |
|---|---|
/src |
Contains React components for individual scenes, composition roots, and global styling. |
/public/images/brand |
Dedicated storage for scraped assets including logos, screenshots, and favicon images. |
/public/audio |
Directory for background music and voiceover files. |
remotion.config.ts |
Configuration file for frame rates, rendering settings, and resolution. |
Video Generator (Remotion) Advanced Features
- Narrative Guardrails: Enforces a non-negotiable AIDA story structure for every production.
- Real-time Cloud Collaboration: Instant public sharing via Cloudflare tunnels for stakeholder feedback.
- Intelligent Brand Extraction: Automatically identifies hex codes and hero images from any URL via Firecrawl.
- Component-Based Motion: Leverages Lucide React and custom spring-physics transitions rather than generic video presets.
- Hot-Reloading Workflow: Source code edits reflect instantly in the browser-based preview server for rapid iteration.
SKILL.md
Loading
Related Openclaw Skills
Shellbot Product Video
An AI-powered workflow for building conversion-focused product marketing videos using Remotion, React, and the AIDA framework.
shellbot-creative
A high-end creative production orchestrator for generating images, videos, voiceovers, and music using multi-provider AI chains.
Freepik AI Multi-modal Generation
A comprehensive multi-modal AI skill for generating and editing images, videos, icons, and audio through the Freepik API.
Orgo Desktop Control
A comprehensive Python SDK integration for provisioning, managing, and automating remote cloud desktops and sandboxed execution environments.
x402 Bazaar Skill
An autonomous discovery and payment layer for AI agents to find, filter, and pay for API services using USDC on the Base network.
Secure Gmail Skill (Composio-backed)
A security-first Gmail integration for AI agents that enables reading and drafting emails without exposing raw OAuth tokens.
Featured*
