マルチモーダル設定

概要

AITuberKitでは、マルチモーダル機能を活用してテキストだけでなく画像を用いたより豊かな対話体験を実現できます。

環境変数:

# マルチモーダル機能の有効化設定（true/false）
# Azure, OpenRouter, ローカルLLM, カスタムAPI および それ以外のモデルでのカスタムモデル選択時に利用
NEXT_PUBLIC_ENABLE_MULTIMODAL="true"

# 画像表示位置設定
# input: 入力エリア, side: サイドパネル, icon: アイコン
NEXT_PUBLIC_IMAGE_DISPLAY_POSITION="input"

# 画像にMIMEタイプを含めるかどうか
NEXT_PUBLIC_CUSTOM_API_INCLUDE_MIME_TYPE="false"

対応モデル

Azure OpenAI, OpenRouter, LM Studio, Ollama, Custom API

各AIサービスで利用できるマルチモーダルが有効なモデルを設定したうえで、「画像送信」設定を有効にしてください。

それ以外のAIサービス

マルチモーダル対応モデルは、以下のようにカメラマークが付いています。

任意のモデルを設定することも可能です。
マルチモーダル機能を利用したい場合は、「画像送信」設定を有効にしてください。

Difyでは、マルチモーダル機能はサポートされていません。

注意

マルチモーダル機能は、通常のテキストのみの対話に比べてAPI利用料金が高くなる場合があります。

使用方法

マルチモーダル機能を活用するには、以下の手順に従ってください：

1. 設定画面で対応するAIサービスとモデルを選択
2. 「画像送信」設定を有効にする
3. Webカメラや画面共有の有効化（必要に応じて）
4. メッセージを送信

画像送信設定

「画像送信」設定を有効にすると、画像付きメッセージが送信された場合にマルチモーダル機能が利用されます。無効にすると、画像が添付されていてもテキストのみがAIに送信されます。

以前の「AIで判断する / 常に利用する / 利用しない」の選択は廃止され、現在は画像送信のON/OFFだけで制御します。

MIMEタイプの設定

カスタムAPIを使用する場合のみ、画像のMIMEタイプを含めるかどうかを設定できます。
Mastraで利用する場合は、MIMEタイプを含める必要があることを確認しています。

マルチモーダル関連機能の説明

1. マルチモーダル関連ボタン

• 画面共有ボタン: 共有する画面を選択できます
• Webカメラボタン: 共有するWebカメラを起動します
• 画像アップロードボタン: 画像をアップロードできます（画像送信が有効な場合のみ表示されます）

2. 共有画面/Webカメラの映像

共有している画面またはWebカメラの映像が表示されます。 この映像枠はドラッグで移動させることができます。 また、四隅をクリックしてドラッグすることで、映像の表示領域を変更拡張・縮小することも可能です。

この画面が表示されている状態でメッセージを送信すると、メッセージを送信した時点のスクリーンショットを含めたメッセージが送信されます。 ただし、すでに画像がアップロードされている場合、そちらが優先して送信されます。

映像操作ボタン:

• 共有画面/カメラ切り替えボタン: 共有する画面またはWebカメラの映像を切り替えます
• 背景切り替えボタン: 共有画面またはWebカメラの映像を背景として切り替えます
• シャッターボタン: 共有画面またはWebカメラの映像を撮影します

3. 撮影/アップロード画像

撮影した画像またはアップロードした画像が表示されます。 ここに画像が表示されている状態でメッセージを送信すると、この画像を含めたメッセージが送信されます。

画像アップロード方法:

• 画像アップロードボタン: ファイル選択ダイアログから画像を選択
• ドラッグアンドドロップ: 画像ファイルを画面にドラッグアンドドロップすることでも画像をアップロードできます
• コピー＆ペースト: クリップボードから画像をコピーしてチャット欄へペーストすることも可能です
• 撮影機能: Webカメラや共有画面からシャッターボタンで撮影

注意

入力コンテキスト長を最適化するため、APIには最新の画像のみが送信されます。過去の会話で使用した画像は、新しいメッセージ送信時には含まれませんのでご注意ください。

アップロードされた画像の配置は以下から選択できます。

• 入力エリア: チャットの入力欄の上に画像が表示されます
• サイドパネル: メイン画面右側に表示されます（上図）
• アイコン: チャットの入力欄にクリップアイコンが表示されます（写真のデモは無し）

制限事項

• 各AIサービスによって、対応する入力形式やファイルサイズに制限があります
• 画像解像度が高すぎると処理が遅くなったり、料金が高くなる場合があります
• モデルによって、画像認識の精度に違いがあります