制作・運用ページ

ローカル開発

Node.js 24系と npm 11 系で最初の動作確認をする入口です。

1. 1.git clone https://github.com/tegnike/aituber-kit.git
2. 2.cd aituber-kit
3. 3.npm install
4. 4.cp .env.example .env
5. 5.npm run dev
6. 6.http://localhost:3000 を開く

Docker

依存関係を手元に増やしたくない場合の最短ルートです。

1. 1.cp .env.example .env
2. 2.docker compose up -d
3. 3.http://localhost:3000 を開く
4. 4.停止は docker compose down

公開前チェック

READMEが明示している運用上の最低ラインです。

1. 1.APIキーをクライアントに直置きしない
2. 2.AI/TTS呼び出しはバックエンド経由にする
3. 3.認証やアクセス制限を追加する

npm パッケージ導入

既存アプリに必要な部品だけ入れるときの入口です。

1. 1.npm install @aituber-onair/core
2. 2.音声も使うなら npm install @aituber-onair/voice
3. 3.会話UIは自前実装、またはサンプル実装を参考にする

React サンプル

動くUIから入りたい場合は `react-basic` が最短です。

1. 1.git clone https://github.com/shinshin86/aituber-onair.git
2. 2.cd aituber-onair/packages/core/examples/react-basic
3. 3.npm install
4. 4.npm run dev
5. 5.http://localhost:5173 を開く

モノレポ開発

各 package をまとめて触る開発者向けの入口です。

1. 1.git clone https://github.com/shinshin86/aituber-onair.git
2. 2.cd aituber-onair
3. 3.npm install
4. 4.npm run build
5. 5.npm run test

ローカル開発

Node.js 18以上の環境で開発サーバーを起動します。

1. 1.git clone https://github.com/shinshin86/chrome-on-aituber.git
2. 2.cd chrome-on-aituber
3. 3.npm install
4. 4.npm run dev
5. 5.Chrome 138以上で http://localhost:5173 を開く

Chrome フラグ設定

Gemini Nano を有効にするためのブラウザ設定です。

1. 1.chrome://flags/#optimization-guide-on-device-model を Enabled にする
2. 2.chrome://flags/#prompt-api-for-gemini-nano を Enabled にする
3. 3.Chrome を再起動する

TTS セットアップ

音声合成を使うための追加セットアップです。

1. 1.piper-plus WASM 用のアセットを所定のディレクトリに配置する
2. 2.詳細は README の TTS セクションを参照

ローカル検証

まず動きを見るだけなら README の手順はかなり短いです。

1. 1.git clone git@github.com:pixiv/ChatVRM.git
2. 2.npm install
3. 3.npm run dev
4. 4.http://localhost:3000 を開く

派生開発

今から触るなら fork して手元で改修する前提で考えます。

1. 1.OpenAI API と Koeiromap API の利用条件を先に確認する
2. 2.fork して自分用に依存サービスやUIを差し替える
3. 3.完全ローカル寄りなら related project の local-chat-vrm も検討する

Unity Editor で試す

最短は demo scene をそのまま起動して流れを掴む方法です。

1. 1.最新版 unitypackage と依存パッケージを入れる
2. 2.Demo/Demo08 シーンを開く
3. 3.AIAvatarVRM の Inspector で OpenAI 関連キーを設定する
4. 4.Unity Editor で Play して会話を試す

新規Unityプロジェクト

自前プロジェクトへ組み込むときの基本導線です。

1. 1.AIAvatarVRM prefab を配置する
2. 2.ModelController と Animator をセットアップする
3. 3.SpeechListener / SpeechSynthesizer を付ける
4. 4.MicrophoneController を置いて実行する

WebGL

READMEでも注意点が多い上級者向けの入口です。

1. 1.CORS 前提でHTTP周りを組む
2. 2.マイクは ChatdollMicrophone を使う
3. 3.音声は WAV を使う
4. 4.Async/Await ではなく UniTask を基本にする

NVIDIA GPU 環境

READMEに載っている基本導入ルートです。

1. 1.Python 3.8 以上を用意する
2. 2.pip3 install -r requirements.txt
3. 3.pip3 install torch torchvision torchaudio --index-url https://download.pytorch.org/whl/cu121
4. 4.NVIDIA ドライバを最新に更新する

初見セットアップ

READMEは動画とマニュアルへの導線も強いです。

1. 1.Tutorial Video を先に見て画面構成を把握する
2. 2.User Manual を開いて設定項目を確認する
3. 3.Google AI Studio の API Key を取得する

低VRAMで試す

Whisper はモデルサイズ選びで現実的な負荷がかなり変わります。

1. 1.まず tiny / base から試す
2. 2.余裕があれば small へ上げる
3. 3.large 系は VRAM 10GB 前後を見込む

Windows GUI

READMEの最短3ステップで試せる基本ルートです。

1. 1.Python 3.10 と uv を入れる
2. 2.uv sync
3. 3.uv run python mouth_track_gui.py
4. 4.sample assets で 解析→キャリブ→口消し→ライブ実行 の順に進める

macOS (Apple Silicon)

READMEでは実験的対応として別 pyproject と追加ビルドが案内されています。

1. 1.pyproject.macos.toml を pyproject.toml に差し替える
2. 2.uv venv .venv && uv sync
3. 3.torch 2.0.1 / torchvision 0.15.2 を追加する
4. 4.xtcocotools と mmcv-full をソースからビルドする

ブラウザ版との併用

READMEと関連リポジトリでは Player 系の併用が案内されています。

1. 1.Python版で口消し動画と mouth_track.json を作る
2. 2.mouth フォルダを含むアバター一式を用意する
3. 3.MotionPNGTuber_Player の assets に置いて OBS 向けに使う

ローカルLAN

READMEの標準ルートです。まずローカルワールドで試します。

1. 1.git clone https://github.com/mindcraft-bots/mindcraft.git
2. 2.keys.example.json を keys.json にして API key を入れる
3. 3.npm install
4. 4.Minecraft ワールドを localhost:55916 で LAN 公開する
5. 5.node main.js

Docker で隔離

危険性を下げたいときはコンテナ実行が推奨されています。

1. 1.docker run または docker-compose up を使う
2. 2.ローカルサーバー接続時は host を host.docker.internal に変える
3. 3.remote server で coding を許可する前に隔離を確認する

オンラインサーバー

Microsoft アカウントを使う構成です。

1. 1.settings.js の host / port / auth を書き換える
2. 2.auth を microsoft にする
3. 3.profile 名を Minecraft プロフィール名と完全一致させる

Windows かんたん導入

Git や Python に慣れていない人向けの導線が README に明記されています。

1. 1.最新版 sbv2.zip を日本語や空白のないパスに展開する
2. 2.GPUありなら Install-Style-Bert-VITS2.bat を実行する
3. 3.GPUなしなら CPU 用 bat を実行する
4. 4.Editor が起動したらそのままデフォルトモデルで試す

開発者向け uv 構築

手元で細かく制御したいなら uv 構築が素直です。

1. 1.uv を入れる
2. 2.git clone https://github.com/litagin02/Style-Bert-VITS2.git
3. 3.uv venv venv && venv\Scripts\activate
4. 4.uv pip install "torch<2.4" "torchaudio<2.4" --index-url https://download.pytorch.org/whl/cu118
5. 5.uv pip install -r requirements.txt
6. 6.python initialize.py

Colab / APIサーバー

手元GPUが弱い場合と外部連携したい場合の入口です。

1. 1.学習は公式 colab.ipynb を使う
2. 2.API化するなら python server_fastapi.py
3. 3.起動後に /docs で仕様を確認する

Windows 利用者

公式サイトからダウンロードして最短で使う一般向けルートです。

1. 1.Windows 10 なら 22H2 以降、または Windows 11 を確認する
2. 2.公式サイトから AivisSpeech をダウンロードする
3. 3.初回起動時はインターネット接続したまま待つ
4. 4.必要なら AivisHub から追加モデルを入れる

macOS 利用者

Apple Silicon を優先したい構成です。

1. 1.macOS 13 Ventura 以降を確認する
2. 2.公式サイトから macOS 版をダウンロードする
3. 3.初回起動時のセキュリティ警告は公式手順に沿って許可する
4. 4.初回モデル取得が終わるまで数分待つ

開発・連携

README は開発者向けに Node/Electron 側の構築手順も持っています。

1. 1.Node.js 22.11.0 を用意する
2. 2.npm ci
3. 3.cp .env.development .env
4. 4.別ターミナルで AivisSpeech Engine を立ち上げて連携確認する

新規プロジェクト

README が案内している最短入口です。

1. 1.Node.js を入れる
2. 2.npx create-video@latest
3. 3.テンプレートを選んでセットアップする
4. 4.プレビューしながらコンポーネントを編集する

AITuber運用向け

紹介動画や定型ショートを作る時の現実的な使い方です。

1. 1.会話ログや記事データを props として流し込む
2. 2.字幕・立ち絵・BGM を React コンポーネントで管理する
3. 3.同じテンプレートから複数本をバッチ生成する

サーバー / 自動化

公式サイトではローカルだけでなくサーバーや serverless でのレンダリングも前提にしています。

1. 1.まずはローカルでテンプレートを固める
2. 2.必要なら @remotion/player や Lambda 系構成を検討する
3. 3.商用運用前にライセンス条件を確認する

Windows 導入

公式公開記事から読み取れる最短導線です。

1. 1.Windows 環境を用意する
2. 2.Patreon の支援者向けダウンロードページから Shoost を取得する
3. 3.起動後は三層レイヤー前提で素材を配置して画を作る

OBS 連携

Shoost の強みである Spout 出力を使う流れです。

1. 1.Settings で Spout Capture を有効にする
2. 2.OBS 側にも対応プラグインを追加する
3. 3.UI を映さず Shoost の出力だけを取り込む

VSeeFace / Unity 素材活用

既存アバターソフトの出力を演出寄りに整える使い方です。

1. 1.VSeeFace のキャプチャや alpha 動画を Shoost 側へ取り込む
2. 2.Brightness / Rim Light / Flare / Diffusion などを調整する
3. 3.必要に応じて OBS や録画ソフトへ渡す