srt-whiteboard-animation

Converts SRT subtitles into whiteboard hand-drawn animation MP4 videos with streaming pen strokes.

626|113|Updated Aug 21, 2026
One-click install
npx skills add https://github.com/ChenShuo2004/cs-board --skill srt-whiteboard-animation-chenshuo2004
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: srt-whiteboard-animation
Source: https://github.com/ChenShuo2004/cs-board
Command: npx skills add https://github.com/ChenShuo2004/cs-board --skill srt-whiteboard-animation-chenshuo2004

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires opencv-python, numpy, av, Pillow, and includes scripts (resource) and assets (resource) components.

What problem does it solve? Turning subtitle scripts into whiteboard-style hand-drawn videos normally requires manual storyboarding, illustration, masking, and frame-by-frame animation work. This Skill automates the full pipeline from an SRT file to a finished MP4 while keeping every step reviewable. ## Core Features & Use Cases - SRT-driven storyboarding: Parses SRT subtitles into 25–35 second scenes and produces an illustration strategy with key Chinese phrases per scene. - Semantic region annotation: Maps visible subjects in each generated line-art image to narrative events, producing pixel-accurate annotation.json files with sequence, timing, and protected regions. - Streaming pen-stroke rendering: Renders each region with continuous ink-then-color strokes (grid or skeleton paths) inside masked regions, then merges multi-scene MP4s. - Interactive preview stage: A browser-based preview tool (assets/preview.html) lets you drag regions, adjust timing, and save annotations before rendering. - Use Case: A content creator has a 3-minute narrated script with SRT subtitles and wants a warm-paper whiteboard animation video; the Skill generates consistent line art, overlays key phrases, animates the drawing, and outputs the final MP4. ## Quick Start Use the srt-whiteboard-animation skill to turn my subtitles.srt file into a whiteboard hand-drawn animation video.

Frequently Asked Questions about srt-whiteboard-animation

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

FAQPage Schema
How do I turn SRT subtitles into a whiteboard animation video?

Provide the SRT file and the Skill parses it into 25–35 second scenes, proposes an illustration strategy, generates unified line-art images, annotates narrative regions, and renders streaming pen-stroke MP4s per scene. Each step pauses for your confirmation before proceeding.

How to add Chinese key phrases to whiteboard animation frames?

The Skill extracts one 4–10 character key phrase per narrative region from the subtitles and overlays it locally using scripts/add_key_text.py with a system Chinese font. This avoids garbled text from image generation models, and the feature can be turned off on request.

Can I adjust region timing and order before rendering the video?

Yes. Open assets/preview.html in Chrome or Edge, load the folder containing your images and annotation JSON files, then drag regions, edit start/end times, reorder modules, and save back to the annotation files before command-line rendering.

What dependencies does the whiteboard rendering script need?

The rendering scripts run in an isolated virtual environment created by scripts/prepare_env.py, which installs opencv-python, numpy, and av. Merging multiple scene MP4s additionally uses system ffmpeg when available, falling back to PyAV re-encoding.

Why do overlapping regions leak lines in whiteboard animations?

Leaks happen when a region's rectangle overlaps later regions or background subjects. The Skill prevents this by computing each region's allowed mask as its rectangle minus all later regions and any protectedRegions, so strokes never touch upcoming content.