生成AIだけで漫画を作るシステムを個人開発した話

TK＠非エンジニア×AIでコンテンツ制作

2026年4月28日 14:17

この記事では、AIを活用してシナリオ生成→コマ割り→画像生成→動画化までを一気通貫で行う個人開発システム「Mangagravity」の全体像を紹介します。

はじめに：なぜ「AIで漫画」なのか

2025年後半、画像生成AIは「絵を1枚描く」段階を超え、連続した物語を視覚的に紡げる段階に達しました。

しかし現実には、以下の壁が立ちはだかります：

✅ 1枚絵は生成できる
❌ キャラクターの一貫性が保てない
❌ ページ単位のコマ割りが組めない
❌ セリフの配置やフキダシの制御ができない
❌ 動画化（TTS + BGM + カメラワーク）はさらに別次元

「じゃあ、全部つなぐシステムを自分で作ればいい」

その発想から生まれたのが、AI漫画生成エディタ「Manga-Gravity」と、AI動画生成エディタ「Cinematic Video Editor」です。

システム全体像

📝 シナリオ                     🎨 キャラクター
   │                              │
   ▼                              ▼
┌─────────────────────────────────────────────┐
│         Manga-Gravity (AI漫画エディタ)        │
│                                             │
│  📝 Scenario Writer (Gemini / Ollama)       │
│  🎨 Character Studio (LoRA学習 + ComfyUI)   │
│  🎬 Comic Studio (NanoBanana 2 画像生成)     │
│  🖼️ Gallery & Export                         │
└──────────────────┬──────────────────────────┘
                   │ 生成されたコマ画像
                   ▼
┌─────────────────────────────────────────────┐
│     Cinematic Video Editor (動画エディタ)     │
│                                             │
│  🎤 TTS音声生成 (Gemini / GPT-SoVITS)       │
│  🖼️ 背景AI画像 (NanoBanana 2)               │
│  🎭 PSD立ち絵システム (表情差分自動制御)       │
│  📹 カメラワーク (バストアップ / 顔アップ)     │
│  🎵 BGM / SE 自動割り当て                    │
│  ⬇️ Remotion SSR → MP4レンダリング           │
└──────────────────┬──────────────────────────┘
                   │
                   ▼
            📦 完成動画 / CG集

Manga-Gravity：AI漫画エディタの5つのタブ

1. 📝 Scenario Writer

GeminiまたはOllamaを使って、テーマからシナリオを自動生成します。

入力例: 「放課後の体育用具室で幼馴染と2人きりになるラブコメ」

出力: ページ番号・コマ番号・シーン説明・キャラクター・セリフ・画面イメージが構造化されたJSON。

{
  "page": "1(奇)",
  "panel": "1-3",
  "scene": "放課後の体育用具室。ジャージ姿の健児が片付けをしている。",
  "character": "隆",
  "dialogue": "「ふぅ……これで最後か」",
  "image_vision": "空気中のホコリが夕日に照らされる。健児の後ろ姿。"
}

このJSON構造が、以降のすべてのパイプラインのデータ基盤になります。

2. 🎨 Character Studio

LoRA学習でオリジナルキャラクターの画風を固定し、ComfyUIと連携して一貫性のあるキャラクター画像を生成します。

sd-scripts によるSDXL LoRA学習
キャラクター辞書（名前→プロンプトマッピング）
チェックポイント切り替え（NoobAI、RouWei Illustrious XL 等）

3. 🎬 Comic Studio

ここがメインのワークスペースです。

左サイドバーにコマ一覧、右エディタに選択中のコマの詳細が表示されます。各コマに対して：

AI画像生成: Gemini Image API (NanoBanana 2) でコマ画像を生成
structured_prompt: YAMLベースの構造化プロンプトでカメラアングル、キャラポーズ、エフェクトまで制御
スプリットモード: 見開きページの左右独立制御
カラー/モノクロ切り替え: カラーCG集とモノクロ漫画の両対応

4. 🖼️ Gallery

生成した全コマ画像をサムネイルで一覧表示。お気に入り選択・差し替えが可能。

5. 📦 Export

完成した漫画をページ単位で書き出し。FANZA同人向けのCG集形式にも対応。

Cinematic Video Editor：「動く漫画」の自動生成

漫画を「読む」から「観る」に変えるのがこのエディタです。

アーキテクチャ

CSV / JSONシナリオ
    │
    ├── 🎤 TTS Mega-Batching
    │    └── Gemini 2.5 Flash TTS
    │    └── GPT-SoVITS v2 Pro (カスタム音声)
    │    └── Irodori-TTS
    │    └── FFmpeg silencedetect → 自動分割
    │
    ├── 🖼️ AI画像生成
    │    └── Gemini Image API (NanoBanana 2)
    │    └── キャラ参照画像付きプロンプト
    │
    ├── 🎭 PSD立ち絵レイヤー制御
    │    └── 表情差分自動マッピング (Gemini推論)
    │    └── 漫符 (マンプ) オーバーレイ
    │
    ├── 📹 カメラシステム
    │    └── none / bust-up / face close-up
    │    └── Ken Burns Effect
    │    └── キャラ別Y軸オフセット自動計算
    │
    └── 🎵 BGM / SE
         └── 自動SE割り当て (40%確率)
         └── セクション単位BGM制御

TTS Mega-Batching の仕組み

100シーン超の動画を効率的に生成するために、連続するセリフを最大10件まとめて1回のTTS APIコールで処理する仕組みを実装しました。

同一話者の連続セリフをバッチ化
セリフ間に `[PAUSE・2秒無言]` マーカーを挿入
1つの長いWAVファイルを生成
FFmpeg `silencedetect` で無音区間を検出
各セリフに対応する個別WAVに自動分割

これにより、API呼び出し回数を最大10分の1に削減しつつ、自然な発話テンポを維持しています。

Remotion SSRレンダリング

Reactコンポーネントで定義した動画を、サーバーサイドでMP4にレンダリングします。

// MainVideo.tsx（101KB）- 全シーンのレンダリングロジック
// PsdTachie.tsx - PSD立ち絵のレイヤー制御
// cameraUtils.ts - カメラワーク計算
// MangaScene.tsx - 漫画コマ風レイアウト

技術スタック一覧

| レイヤー | 技術 |
|:---|:---|
| フロントエンド | React 18 + Vite |
| バックエンド | Express.js (Node.js) |
| 動画レンダリング | Remotion SSR (@remotion/renderer) |
| 画像生成 | Gemini Image API (NanoBanana 2) / ComfyUI + SDXL |
| 音声合成 | Gemini 2.5 Flash TTS / GPT-SoVITS v2 Pro / Irodori-TTS |
| LoRA学習 | sd-scripts (SDXL LoRA) |
| 音声処理 | FFmpeg (silencedetect, 分割) |
| シナリオ生成 | Gemini Pro / Ollama (Midnight-Miqu 70B) |
| 立ち絵制御 | PSD レイヤー解析 + 表情マッピング |

個人開発で学んだこと

1. 「つなぐ」ことが最大の価値

個々のAI技術（画像生成、TTS、LLM）は誰でも使えます。それらをシームレスに接続するパイプラインこそが、クリエイティブツールとしての価値の源泉でした。

2. React + Remotion は動画制作の革命

「動画をReactコンポーネントとして定義する」という発想は、Web開発者にとって非常に直感的です。CSSアニメーション、状態管理、コンポーネント分割——すべてのWeb技術がそのまま動画制作に使えます。

3. Geminiは「万能ナイフ」

シナリオ生成 → Gemini Pro
画像生成 → NanoBanana 2
TTS → Gemini 2.5 Flash
表情推論 → Gemini Flash
プロンプト生成 → Gemini Flash

1つのAPIキーで、クリエイティブパイプラインの大部分をカバーできるのは圧倒的な利点です。

今後の展望

ワンクリック漫画生成: テーマ入力→完成CG集まで完全自動化
マルチプラットフォーム展開: FANZA同人 + YouTube動画 + Note記事の三面展開
OSS化検討: コアモジュールの一部をオープンソースとして公開予定

おわりに

「AIで漫画を作る」というのは、まだ多くの人にとって"夢物語"に聞こえるかもしれません。

でも実際には、既存のAI APIを適切に組み合わせるだけで、個人でもプロダクションレベルのパイプラインを構築できる時代が来ています。

この連載では、このシステムの設計思想から実装詳細、トラブルシューティングまでを包み隠さず公開していきます。

次回: 「Gemini + Remotionで"動く漫画"を自動生成する仕組み」（技術詳細編）

この記事が参考になったら「スキ」をお願いします。質問や感想はコメント欄へどうぞ！

#生成AI #個人開発 #漫画制作 #Gemini #Remotion #ComfyUI #StableDiffusion #React

いいなと思ったら応援しよう！

僕の記事に価値を見出してくれた…そのチップという名の『覚悟』、心に響きました。あなたからの応援は、より良い記事を作るための『黄金の風』にしてみせます。後悔はさせません、心からグラッツェ！