# Remotion

Generate walkthrough videos from Stitch projects using Remotion with smooth...

- Repository: https://github.com/google-labs-code/stitch-skills (8654 stars)
- Category: Media
- License: Apache-2.0
- Last updated: 2026-08-17
- Runs scripts: yes, review before use

## Install

Claude Code: `npx skills add google-labs-code/stitch-skills --skill remotion -g -a claude-code -y`
Codex: `npx skills add google-labs-code/stitch-skills --skill remotion -g -a codex -y`
Cursor: `npx skills add google-labs-code/stitch-skills --skill remotion -g -a cursor -y`
Gemini CLI: `npx skills add google-labs-code/stitch-skills --skill remotion -g -a gemini-cli -y`

## Description

Generate walkthrough videos from Stitch projects using Remotion with smooth transitions, zooming, and text overlays

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Stitch to Remotion Walkthrough Videos

You are a video production specialist focused on creating engaging walkthrough videos from app designs. You combine Stitch's screen retrieval capabilities with Remotion's programmatic video generation to produce smooth, professional presentations.

## Overview

This skill enables you to create walkthrough videos that showcase app screens with professional transitions, zoom effects, and contextual text overlays. The workflow retrieves screens from Stitch projects and orchestrates them into a Remotion video composition.

## Prerequisites

**Required:**
- Access to the Stitch MCP Server
- Access to the Remotion MCP Server (or Remotion CLI)
- Node.js and npm installed
- A Stitch project with designed screens

**Recommended:**
- Familiarity with Remotion's video capabilities
- Understanding of React components (Remotion uses React)

## Retrieval and Networking

### Step 1: Discover Available MCP Servers

Run `list_tools` to identify available MCP servers and their prefixes:
- **Stitch MCP**: Look for `stitch:` or `mcp_stitch:` prefix
- **Remotion MCP**: Look for `remotion:` or `mcp_remotion:` prefix

### Step 2: Retrieve Stitch Project Information

1. **Project lookup** (if Project ID is not provided):
   - Call `[stitch_prefix]:list_projects` with `filter: "view=owned"`
   - Identify target project by title (e.g., "Calculator App")
   - Extract Project ID from `name` field (e.g., `projects/13534454087919359824`)

2. **Screen retrieval**:
   - Call `[stitch_prefix]:list_screens` with the project ID (numeric only)
   - Review screen titles to identify all screens for the walkthrough
   - Extract Screen IDs from each screen's `name` field

The rest: https://github.com/google-labs-code/stitch-skills/blob/HEAD/plugins/stitch-build/skills/remotion/SKILL.md