MotionPNGTuberでAIキャラクターを作る
こんにちは。うえぞうです。
アバター表現の新機軸「MotionPNGTuber」が話題ですね?
さらに、作ったキャラクターをブラウザー上で動かせる「MotionPNGTuber Player」がリリースされました。
「動くPNGTuber」ブラウザだけで動くような軽量プレイヤーを公開しました。より手軽に使いたい人向けかな。サンプルも2種類ほど入れてあるので直ぐ試せます。
— ろてじん (@rotejin) January 14, 2026
MotionPNGTuber Playerhttps://t.co/ssuGfBAn5j
せっかくブラウザー上で動くようになったので、こちらをフロントエンドとして音声対話できるAIキャラクターの作り方をまとめてみました。出来上がりのイメージはこんな感じ。イメージっていうかこの記事を読めば誰でもこれを作れます。
MotionPNGTuber Player x AIAvatarKitの統合完了した💪
— うえぞう@うな技研代表 (@uezochan) January 15, 2026
セットアップ手順の記事と合わせて今日明日にも配布するね(今回も別の子のプロンプトなのでにゃんにゃん言わせてすみません🙇♀️) pic.twitter.com/83CETCG4pA
それでは、やっていきましょう!
VOICEVOXのインストール
まずは音声合成システムとしてローカルでも動作するVOICEVOXをインストールします。プラットフォームに合わせてインストーラーをダウンロードし、手順に従ってインストールしてください。
インストールしたら起動しましょう。
起動後に http://localhost:50021/docs にアクセスして以下のような画面が表示されたら成功です。
サンプルリソースの入手
続いて、以下からサンプルリソースをダウンロードして、任意のディレクトリーに展開してください。この中にはすぐに動かせるMotionPNGTuberの一式が含まれています。ありがとうろてじんさん!✨🙏✨
展開したら、ターミナルでこのディレクトリーの中(mpt.htmlなどがあるディレクトリー)に移動しましょう。
AIAvatarKitのインストール
今回、バックエンドとしてはAIAvatarKitを使用します。その名の通り音声対話型のAIアバターを簡単に開発するためのフレームワークで、VRChatなどのメタバースプラットフォームはもちろん電話やWebブラウザーをフロントエンドとして接続することができます。
インストールはとても簡単で、以下のコマンド一発でお手元のPython環境に入ります。(なので、必要に応じて仮想環境などで実行してください)
pip install aiavatar fastapi uvicorn websocketsMotionPNGTuberサンプルの実行
server.py を任意のコードエディターで開いて、OPENAI_API_KEYにOpenAIのAPIキーを入力します。
OPENAI_API_KEY = "YOUR_OPENAI_API_KEY"さて、これで準備完了です。ターミナルでwebsocketフォルダーに移動してサーバーを起動しましょう。
unicorn server:app
INFO: Started server process [57264]
INFO: Waiting for application startup.
INFO: Application startup complete.
INFO: Uvicorn running on http://0.0.0.0:8000 (Press CTRL+C to quit)それではお待ちかねのご対面です!http://localhost:8000/static/mpt.html にアクセスしてみましょう。
こんな画面が表示されたら、Startボタンを押してみましょう。マイクの許可を求めるダイアログが出たら許可してあげてください。そして話しかけてみましょう。キャラクターがリップシンクを伴って応答してくれるはずです。
ちなみにBerge-inをオンにするとAI発話中に割り込んで話すことができるようになり、Cameraをオンにすると「これ見てみて」などと言うと自律的にカメラから画像を取得して応答してくれます。
あなた好みのカスタマイズ
アバターそのもののカスタマイズ(独自アバターの作成)手順はMotionPNGTuber本家を見ていただくとして、ここでは発話内容・キャラクター設定や音声合成、音声認識のカスタマイズについて触れていきます。
発話内容・キャラクター設定の変更
server.py の SYSTEM_PROMPT_JP の内容をキャラクター向けに修正しましょう。この値は ChatGPTService のインスタンス化にあたり、システムプロンプトとして設定されます。
音声合成の変更
動作確認ではVOICEVOXを使用しましたが、AivisSpeechやStyle-Bert-VITS2などを使用することもできます。最も簡単なAivisSpeechへの切り替えの場合、以下のようにポート番号と話者IDを変更すればOKです👍
tts = VoicevoxSpeechSynthesizer(
base_url="http://127.0.0.1:10101",
speaker="1878365376" # Kohaku - Normal
)音声認識の変更
OpenAI APIキーだけ入力すれば動くようにOpenAIのSTTを使用していますが、速度で言うとAzure Fast Transcriptionがピカイチです。APIキーとリージョンをメモっておいて、以下の通りインスタンス化しましょう。
from aiavatar.sts.stt.azure import AzureSpeechRecognizer
stt = AzureSpeechRecognizer(
azure_api_key="YOUR_AZURE_API_KEY",
azure_region="YOUR_AZURE_REGION"
)発話の長さにもよりますが、だいたい0.2秒程度で認識してくれるようになります。びっくりするほど速い。
おわりに
AIキャラクター作ってみたい!と思ってもアバターを用意するハードルが高すぎて挫折する、それを救うためにこの仕組みを作った!みたいなことをMotionPNGTuber開発者のろてじんさんはおっしゃっていたと記憶しています。
わたしも本当にそうだなーって思いますし、せっかくなので配信や動画のためのAITuberだけではなく、音声対話できるAIキャラクターを作りたい人にとってもハードルを取り除くことができたら・・・と思ってこの仕組み&記事を公開しました。
手前味噌ですが、今回バックエンドに使用したAIAvatarKitは、単に音声でおしゃべりできるオモチャではなく、会話が破綻しないための仕組みやガードレール(音声対話に最適化した非同期・並列処理)など、ガチでプロダクトに使える機能も満載です。興味ある方はこちらもぜひDeepdiveしてみてください。
それでは、みなさんぜひ素敵な、あるいは素敵かどうかよりもみなさんの「癖」を詰め込んだAIキャラクターをどんどん作ってみてください!作った方、よかったら報告してね!たのしみ!🥳


コメント