This skill converts story copy or ordered local images into silent Remotion videos with a hand-drawn aesthetic. It is designed for content creators who need to translate written narratives into visual diary-comic formats.
The system includes a library of 20 distinct visual styles, ranging from watercolor and gouache to whiteboard and printmaking looks, allowing for precise control over the artistic direction of the animation.
Follow the documented setup, then try a first task.
Installs: Installs the story-to-handdrawn-video skill and sets up its complete Remotion renderer project. · Codex
From the directory where you want the renderer repository created, clone it, enter the project directory, install its locked npm dependencies, and run its checks.
git clone https://github.com/gnipbao/story-to-handdrawn-video.git cd story-to-handdrawn-video npm ci npm run check
From the renderer project directory, copy the skill into Codex's skills directory.
cp -R skill-package/story-to-handdrawn-video ~/.codex/skills/
If Codex will not run inside the renderer project, replace /absolute/path/to/story-to-handdrawn-video with the renderer project's absolute path and set the environment variable in the terminal. Skip this step when the agent runs inside the project.
export STORY_VIDEO_PROJECT=/absolute/path/to/story-to-handdrawn-video
Installs: Installs the story-to-handdrawn-video skill and sets up its complete Remotion renderer project. · Claude Code, generic agents
From the directory where you want the renderer repository created, clone it, enter the project directory, install its locked npm dependencies, and run its checks.
git clone https://github.com/gnipbao/story-to-handdrawn-video.git cd story-to-handdrawn-video npm ci npm run check
From the renderer project directory, copy the skill into the documented Claude Code or generic-agent skills directory.
cp -R skill-package/story-to-handdrawn-video ~/.claude/skills/
If the agent will not run inside the renderer project, replace /absolute/path/to/story-to-handdrawn-video with the renderer project's absolute path and set the environment variable in the terminal. Skip this step when the agent runs inside the project.
export STORY_VIDEO_PROJECT=/absolute/path/to/story-to-handdrawn-video
Installs: Installs the story-to-handdrawn-video skill and sets up its complete Remotion renderer project. · Kimi Code
From the directory where you want the renderer repository created, clone it, enter the project directory, install its locked npm dependencies, and run its checks.
git clone https://github.com/gnipbao/story-to-handdrawn-video.git cd story-to-handdrawn-video npm ci npm run check
From the renderer project directory, copy the skill into Kimi Code's skills directory.
cp -R skill-package/story-to-handdrawn-video ~/.agents/skills/
If Kimi Code will not run inside the renderer project, replace /absolute/path/to/story-to-handdrawn-video with the renderer project's absolute path and set the environment variable in the terminal. Skip this step when the agent runs inside the project.
export STORY_VIDEO_PROJECT=/absolute/path/to/story-to-handdrawn-video
Uses story-to-handdrawn-video
使用 $story-to-handdrawn-video 把这段故事生成可后期配音的手绘动画。 <paste your story here>
Uses story-to-handdrawn-video
使用 $story-to-handdrawn-video 把这几张图片按顺序生成手绘动画: /absolute/01.jpg /absolute/02.jpg /absolute/03.jpg
Uses story-to-handdrawn-video
使用 $story-to-handdrawn-video 把这些图片做成翻书效果的手绘动画: /absolute/01.jpg /absolute/02.jpg
Claude
Codex
Kimi Code