npx skills add outscal/video-generatorREADME
Outscal Video Generator
An AI-powered video generation tool that creates animated videos from text scripts using Claude Code.
π Table of Contents
π‘ How It Works
Unlike traditional AI video generators that output video files, this tool generates React/TSX code that renders as animated videos. The AI writes the codeβthe code becomes the video.
π Prerequisites
- Claude Code CLI installed and configured. see Claude Code Quickstart
π Quick Start
β‘ TL;DR: Clone repo β Run
/tools:initβ Set API key β Run/create-video
1. Clone and Setup
-
Get the repository: Either clone the repository or download it as a ZIP file and extract it.
-
Open Claude Code in the repository directory to ensure all commands work properly.
2. Install Dependencies
Run the initialization command in Claude Code:
/tools:init
This command will automatically:
- install the requirements needed to start generating video
- will direct you to setup the api key and will tell you how.
[!NOTE] This command only needs to be run once during initial setup.
3. API Key Setup (Required)
After installation completes, you need to set up your API key (this will be instructed after the /tools:init comand as well):
- Get your API key: Visit https://production2.outscal.com/v2/get-video-generation-api-key and register or login
- Add your API key to the
.envfile:
ReplaceOUTSCAL_API_KEY="your_api_key_here"your_api_key_herewith the actual API key you received.
4. Optional Environment Variables
The following environment variable is optional and only needed if you want to use a different voice:
| Variable | Description | Required |
|---|---|---|
ELEVENLABS_VOICE_ID | Voice ID from ElevenLabs. You can pick different voice IDs from your ElevenLabs account if you want to change the voice. | No |
[!NOTE] Only ElevenLabs' pre-made voices are supported. Custom or cloned voices will not work.
5. Create Your Video
Run the video creation command:
/create-video
[!TIP] Run this command every time you want to create a new video.
π Video Creation Workflow
When you run /create-video, the tool will guide you through this pipeline:
βββββββββββ βββββββββββ βββββββββββββ βββββββββββββ ββββββββββ ββββββββββ βββββββββ
β Style β β β Script β β β Direction β β β Audio β β β Assets β β β Design β β β Video β
βββββββββββ βββββββββββ βββββββββββββ βββββββββββββ ββββββββββ ββββββββββ βββββββββ
| Step | What Happens |
|---|---|
| π¨ Style | Choose from available art styles |
| π Script | Provide your narration script (max 2000 characters) |
| π¬ Direction | Generate scene-by-scene video direction |
| π Audio | Convert script to speech using ElevenLabs |
| πΌοΈ Assets | Create SVG assets for the video |
| βοΈ Design | Generate detailed design specifications |
| π₯ Video | Create and deploy video (displays deployed URL) |
[!TIP] After videos are created and deployed, use
/tools:list-videosto view all deployed video URLs.
π¨ Video Art Styles
When creating a video, you'll be asked to choose from three distinct visual styles:
Pencil
https://github.com/user-attachments/assets/d0eac993-6b4f-4757-8317-936550ba3b93
A hand-drawn, sketch-like aesthetic that gives videos a personal, artistic feel. Features rough edges, sketch lines, and a notebook-paper appearance. Great for educational content that wants to feel approachable and informal.
Neon
https://github.com/user-attachments/assets/e3356b5f-8f5b-4e98-b146-25054382057a
Vibrant, futuristic style with glowing effects, dark backgrounds, and bright accent colors. Features electric highlights and cyberpunk-inspired visuals. Perfect for tech topics, gaming content, or when you want a high-energy, modern look.
π Commands Reference (FYI)
| Command | Description |
|---|---|
/tools:init | Install all project dependenc |
...