explaingit

gnipbao/story-to-handdrawn-video

Analysis updated 2026-05-18

534JavaScriptAudience · vibe coderComplexity · 3/5LicenseSetup · moderate

TLDR

Turn Chinese story text or hand-drawn images into vertical hand-drawn diary-comic animations. You can control it using plain language via coding assistants like Claude Code.

Mindmap

mindmap
  root((repo))
    What it does
      Converts text to video
      Hand-drawn comic style
      Silent video output
    How it works
      Remotion renderer
      Agent skill package
      Plain language control
    Use cases
      Story animations
      Diary comic videos
      Preview before render
    Tech stack
      JavaScript and Python
      Node.js runtime
      FFmpeg required
    Audience
      Codex users
      Claude Code users
      Kimi Code users

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Paste a Chinese story and get a vertical hand-drawn comic animation video.

USE CASE 2

Use ordered hand-drawn images to create an animated diary-comic with page-curl transitions.

USE CASE 3

Generate a low-resolution preview video before committing to a full 1080x1440 render.

USE CASE 4

Control the video rendering process by telling your coding assistant what story to animate.

What is it built with?

JavaScriptRemotionNode.jsPythonFFmpeg

How does it compare?

gnipbao/story-to-handdrawn-videojuliangarnier/3d-hartwig-chess-setlbr77/sideimpactor
Stars534537530
LanguageJavaScriptJavaScriptJavaScript
Last pushed2023-03-31
MaintenanceDormant
Setup difficultymoderateeasyhard
Complexity3/52/54/5
Audiencevibe coderdesignerdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

Requires Node.js 20+, Python 3.10+, FFmpeg, and Google Chrome installed on your computer.

Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

In plain English

This repository takes Chinese story text or a set of ordered hand-drawn images and converts them into a vertical hand-drawn diary-comic animation. The output is a silent video file, designed so that voiceover and music can be added later in post-production. The animations feature handwritten-style captions, a left-to-right reveal that progresses from text to a black-and-white sketch to a color illustration, and an optional page-curl flip transition in the bottom-right corner. The project has two parts. The first is a renderer, built on a tool called Remotion, which handles the actual work of splitting stories into scenes, applying animations, and producing the final video. The second part is an "agent skill," a package you install into a coding assistant like Codex, Claude Code, or Kimi Code. Once installed, you control the renderer using plain natural language instead of running scripts yourself. You simply tell the assistant what story or images you want to use, and it handles sentence splitting, storyboarding, image generation, and rendering automatically. To get started, you need Node.js 20 or higher, Python 3.10 or higher, and FFmpeg installed on your computer. You also need Google Chrome or a compatible browser. After downloading the repository and installing its dependencies, you copy the skill package into your assistant's skills directory and point it at the renderer project folder. From there, you can paste a story or provide image paths, and the assistant takes over. The default workflow uses Codex Image2 to generate images, with an optional OpenAI API path if you explicitly request it. You can generate a quick preview at a lower resolution before committing to a full render. Final videos are 1080 by 1440 pixels, while previews are 720 by 960. The project includes a bundled Chinese brush-style font called Ma Shan Zheng, released under the SIL Open Font License. The entire repository is available under the MIT license, and the author welcomes contributions, particularly to the core renderer logic and skill contract.

Copy-paste prompts

Prompt 1
I have a short Chinese story about a morning walk. Split it into scenes, generate hand-drawn images for each scene, and render a vertical diary-comic animation video at 1080x1440.
Prompt 2
I have 5 hand-drawn images in order in a folder. Use them to create a vertical hand-drawn comic animation with the left-to-right reveal effect and a page-curl flip transition.
Prompt 3
Render a quick low-resolution preview of my story animation first so I can check the scene flow before doing the full render.
Prompt 4
Install the story-to-handdrawn-video agent skill into my coding assistant and point it at the renderer project folder so I can control it with plain language.

Frequently asked questions

What is story-to-handdrawn-video?

Turn Chinese story text or hand-drawn images into vertical hand-drawn diary-comic animations. You can control it using plain language via coding assistants like Claude Code.

What language is story-to-handdrawn-video written in?

Mainly JavaScript. The stack also includes JavaScript, Remotion, Node.js.

What license does story-to-handdrawn-video use?

Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

How hard is story-to-handdrawn-video to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is story-to-handdrawn-video for?

Mainly vibe coder.

Open on GitHub → Explain another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.