← ガイド一覧

GUIDE 05 / PNGTUBER SETUP

Live2DなしでPNG立ち絵をOBSで声に合わせて動かす方法|無料手順と仕組み

WebカメラやLive2Dモデルを使わず、マイクの音量で透過PNG画像を切り替えるアバター配信の導入手順を解説します。

VTuber配信を始める際、「Live2Dモデルを作る予算や技術がない」「カメラで表情を読み取るソフトはPCに負荷がかかる」と感じる方に広く利用されているのが、静止画の透過PNGイラストを音声に合わせて動かす「PNGTuber」方式です。

Webカメラによる顔認識は使わず、マイクに入った音量をトリガーにして画像を切り替えるため、低スペックなPC環境でも動作が軽く、手軽に立ち絵アバター配信を構築できます。

この記事では、完全無料で利用できる定番Webサービス「Reactive by FugiTech」とOBS Studioを組み合わせ、手持ちのイラスト2枚からアバターを声に合わせて動かす具体的な手順を解説します。

先に結論:まずは背景が透明な「口閉じ」「口開き」のPNG画像2枚を用意してください。無料のWebサービスとDiscord通話を組み合わせることで、今日からすぐに画面上で喋る立ち絵を動かせます。

1. 音量連動で立ち絵を動かすPNGTuberの仕組み

PNGTuberの動作原理は、カメラトラッキングではなく「音量の判定」に基づいています。

  • 無音時(喋っていない時):「口を閉じた画像」を表示
  • 発話時(マイク音量が一定値を超えた時):「口を開いた画像」へ切り替え

顔の向きや視線を追跡するわけではないため、Webカメラを設置する必要がなく、部屋の明るさや姿勢に左右されずに安定した配信画面を作ることができます。

2. 立ち絵画像の準備と「ズレない」キャンバス設定

最低限必要な素材は、背景が透明化された以下の2枚の画像です。

  1. 待機時画像(口閉じ):目を開けて口を閉じているイラスト
  2. 発話時画像(口開き):目を開けて口を開けているイラスト
画像の注意点:2枚の画像の縦横ピクセルサイズ(解像度)は完全に一致させてください。また、口以外のパーツ(頭・輪郭・髪・身体)の位置を固定して口のパーツ差分だけを書き出すことで、切り替わったときの不自然なガタつきを防げます。

3. 完全無料手順:Reactive by FugiTech を使ってOBSへ表示する

現在、最も手軽に無料でPNG立ち絵をOBSに連動させる方法として広く使われているのが、FugiTech氏が提供するWebサービスReactive by FugiTechです。

最低限の確実な設定手順は以下のとおりです。

ステップ1:Discord認証

ブラウザで https://reactive.fugi.tech/ にアクセスし、Discordアカウントとの連携を認証します。また、Discord上で任意のボイスチャンネルに入室しておきます(個人サーバーで一人で入室した状態でも構いません)。

ステップ2:モデル/画像設定

設定画面で自分のアカウントを選択し、待機時用(Inactive)に「口閉じPNG」、発話時用(Speaking)に「口開きPNG」をそれぞれ設定します。

ステップ3:Source URLの取得

画面上に生成されたBrowser Source用のURLをコピーします。

ステップ4:OBSのブラウザソースへ追加

OBSのソース欄で「+」→「ブラウザ」を追加し、URL欄にコピーしたアドレスを貼り付けます。幅と高さを画像の解像度に合わせて指定すれば完了です。

動作上の注意:FugiTech方式はWebブラウザ上で動作する外部サービスであり、マイク音量の検知にDiscordのボイス通話を利用しています。そのため、配信中もインターネット接続とDiscordボイスチャンネルへの接続が前提となります。

4. 無料Web方式とローカルツールの違い

配信の規模や目的に応じて、適切なツールを選択することが大切です。

項目Reactive by FugiTech(無料Web方式)yuu3 Lab PNGTuber(ローカルツール)
動作環境Webブラウザ + Discord連携PCローカル常駐(Discord不要・オフライン動作)
対応画像2枚(待機・発話)2枚でも使用可(最大4状態:通常・瞬き・発話・発話瞬き)
発話リアクション発話状態に応じた画像切り替え音量連動バウンス + 大声時の叫び/パニックリアクション
表情差分基本1種類Pro版:4表情(通常・笑顔・怒り・悲しみ)の手元切り替え
向いている用途コラボ通話相手の立ち絵表示、無料ですぐ試したい方1人配信の安定運用、瞬きや表情差分を細かく作り込みたい方
価格完全無料無料Lite版あり / Pro版(買い切り)

Discordを起動せずPCローカル完結で安定動作させたい場合や、瞬きアニメーション・大声リアクションを加えたい場合は、yuu3 Lab PNGTuber(無料Liteあり / BOOTH) ↗が役立ちます。

5. 反応しない・動きがおかしい時の切り分けチェック

Discord側のマイク入力と感度を確認する

FugiTechはDiscord側の音声判定を利用しています。声を出しても口が開かない場合は、Discordの「ユーザー設定」→「音声・ビデオ」で正しいマイクが選択されているか、「入力感度の自動調整」が過敏または鈍感になりすぎていないかを確認してください。

OBSブラウザソースのサイズ比率を確認する

立ち絵が小さく表示されたり、端が見切れる場合は、OBSブラウザソースのプロパティで幅・高さを元の立ち絵の縦横比(アスペクト比)に合わせて指定してください。

TRY THE TOOL 無料版あり

PCローカルで安定動作する立ち絵ツールを試す

yuu3 LabのPNGTuber OBS Overlayは、Discord不要・PCローカルで動く配信者向けツールです。無料Lite版で基本動作を確認でき、Pro版では瞬き連動・4表情切り替え・大声叫びリアクションに対応しています。

参考資料・公式一次情報