# touhou-code-video-template

> An MIT-licensed template for making a fully voiced Touhou Project fan explainer video in nothing but JavaScript and Canvas 2D. Every frame is a pure function of time; 14 paper-cut chibi characters are drawn procedurally (no image assets, no AI-generated art); voice-over is AquesTalk ("Yukkuri" style) synthesized from Chinese text; background music is a music-box arrangement of a character theme; a headless Chromium renderer pipes frames to ffmpeg to produce a 1080p MP4. 中文名「纯代码做一集东方视频」：只用代码做一集有配音、有配乐的东方同人科普视频。日本語：JavaScript と Canvas 2D だけで東方の解説動画を一本作るテンプレート。

The project is meant both as an art practice (code as the brush; a style written down as a parts table) and as a research testbed (deterministic, reproducible visual programs for studying how coding agents synthesize animation and collaborate in parallel). It was itself built by a human working with several AI agents.

Key facts:

- Source: https://github.com/fish2lab/touhou-code-video-template ("Use this template" on GitHub starts a new episode)
- Requirements: Node.js 20+, ffmpeg; Playwright Chromium for screenshots and rendering
- Characters (id → draw function): reimu → drawReimu, marisa → drawMarisa, flandre → drawFlandre, koishi → drawKoishi, youmu → drawYoumu, sakuya → drawSakuya, remilia → drawRemilia, satori → drawSatori, mokou → drawMokou, cirno → drawCirno, patchouli → drawPatchouli, meiling → drawMeiling, yukari → drawYukari, ran → drawRan. All share one chibi proportion (about 2.4 heads tall). Call: drawX(c, { x, y, h: 500, pose, mood, t }) → anchors { head, hands, tip, ... }. Each file header documents its poses, moods and anchors.
- The first ten are exactly the top 10 of the character division of the fan-run Touhou Project Popularity Poll (東方Project人気投票) in 2024, 2025 and 2026 (toho-vote.info); the other four come from the "Patchouli Lecture" series.
- Hard rules: no Math.random() (seeded hash/rng instead), no per-frame canvas filters, every script uses its own global name prefix (all scripts share one global scope), people never overlap props or text unless the contact is designed.
- Cheap checks: `node tools/sheet.mjs --who <id>` (pose and mood sheets, exit code 1 on page errors); `node tools/frames.mjs --scene <name> --grid 24` (contact sheet of a scene); `node tools/overlap.mjs --scene <name>` (overlap check).
- Render time: the 97-second demo renders in about 56 seconds with 4 parallel pages on a MacBook Air (M5), measured 2026-10-08.
- Touhou Project characters are © Team Shanghai Alice (ZUN); this is a fan-work tool, not official content.

## Docs

- [README](https://github.com/fish2lab/touhou-code-video-template/blob/main/README.md): definition in Chinese, English and Japanese; outlook; quick start; directory map; section for AI agents; FAQ; licenses
- [AGENTS.md](https://github.com/fish2lab/touhou-code-video-template/blob/main/AGENTS.md): workflow and hard rules for starting a new episode; read this first
- [Character rig spec](https://github.com/fish2lab/touhou-code-video-template/blob/main/docs/rig.md): shared proportions, drawing rules, how to add a character in four steps
- [Character list and poll data](https://github.com/fish2lab/touhou-code-video-template/blob/main/docs/%E8%A7%92%E8%89%B2%E5%90%8D%E5%8D%95.md): top 10 of the 2024–2026 polls with points and sources
- [Tutorial (Chinese)](https://github.com/fish2lab/touhou-code-video-template/blob/main/docs/%E6%95%99%E7%A8%8B.md): "frame = f(t)", file map, writing a scene, voice, dev loop, rendering
- [CITATION.cff](https://github.com/fish2lab/touhou-code-video-template/blob/main/CITATION.cff): how to cite

## Demos

- [Project page](https://fish2lab.github.io/touhou-code-video-template/)
- [97-second demo film, rendered live in the browser](https://fish2lab.github.io/touhou-code-video-template/film/)
- [Ten reusable effects](https://fish2lab.github.io/touhou-code-video-template/highlights/)

## Optional

- [Lessons (Chinese)](https://github.com/fish2lab/touhou-code-video-template/blob/main/docs/%E7%BB%8F%E9%AA%8C.md): what made earlier episodes engaging or monotonous
- Series episodes: [1](https://github.com/fish2lab/patchouli-lecture-1), [2](https://github.com/fish2lab/patchouli-lecture-2), [3](https://github.com/fish2lab/patchouli-lecture-3)