3
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

ADX+UE5で作る、ゲーム中会話パートのボイス再生機能(基本実装編/新バージョン対応)

Last updated at Posted at 2021-11-06

はじめに

ADXアンバサダーとして執筆しておりますSigと申します。
この記事ではアンリアルエンジン5とサウンドミドルウェア「ADX for UE」を連携させ、ゲーム中の会話パートにおけるボイスの再生及び再生待ち機能などを実装してみます。

本記事ではシチュエーション別に対応したメッセージとボイスを再生するまでの実装の基礎について扱います。

再生するほか、ボイスを再生し終わったらページ送りを促すアイコンの表示や、オートで会話を送る処理などは「機能追加編」の記事にて扱います。
https://qiita.com/SigRem/items/f3dc003632eae6d4f7b7

当記事ではUE5.2を使用します。基本的にブループリントのみでの実装を想定しています。
ADXはインディー向けの「LE版」であれば、無料で使用できます。
https://game.criware.jp/products/adx-le/

記事執筆時点のADX for UEのSDKバージョンは2.00です。

前提

ADX for UEの導入や基本的な使い方は以下の記事にあります。必要に応じて参照してください。
ADX for UEの導入で、一歩上のサウンド表現を(導入編/UE5/ADX新バージョン改訂版)

ADX for UEの導入で、一歩上のサウンド表現を(実践編)

実装

AtomCraftで素材を準備する

まずはADX用サウンドオーサリングツール「AtomCraft」でボイス素材を登録・編集していきます。

マテリアルのインポート

ボイスとなる音声素材を用意します。「マテリアルツリー」にドラッグアンドドロップして配置します。
A01.png
画像ではサンプルとして6つの音声をインポートし、「Voice_A」というフォルダに格納しました。
フォルダの追加は「マテリアルルートフォルダー」を右クリックし、「新規オブジェクト」→「マテリアルフォルダーの作成」から可能です。
A02.png

キューの作成

新規にキューを作成します。
「ワークユニットツリー」のキューシートを右クリックし、「新規オブジェクト」→「キュー『ポリフォニック』の作成」を選択します。
A03.png
「ランダムでキャラクターが喋るトーンや台詞を変える」などの特殊な演出をしたい場合、用途に合わせて「ランダム」などの別のキュータイプを選択してもよいでしょう。
A04.png
作成されたキューにマテリアルを配置します。タイムライン上で再生タイミングを合わせ、正常に再生されることを確認します。

3D音声の設定

2Dで展開されるビジュアルノベルなら距離による減衰などの要素は不要ですが、3D空間上で音声を再生したい場合は簡単な設定が必要です。

キューを選択し、インスペクターにて「パンのタイプ」を「3Dポジショニング」に変更します。
A05.png
ゲーム内での聞こえ方を確認するには、セッションウィンドウを使用します。
ツールバーの「表示」→「セッションウィンドウ」で開きます。
A06.png
ウィンドウ下部のリストに確認したいキューをドラッグアンドドロップして登録します。
A07.png
上部の「3Dポジショニング」をクリックし、3Dポジショニングの確認機能を呼び出します。
A08.png
「プレーヤーに3Dオブジェクトをアタッチ」にチェックを入れ、緑色の領域をドラッグすると音源の移動がテストできます。
A09.png

キューシートのビルド

設定が完了したらキューシートをビルドします。
A10.png
A11.png
これでAtomCraft側の実装は完了です。

UE5でボイス再生機能を実装する

UE5のエディタを起動します。

キューシートのインポート

ビルドしたキューシートをインポートします。
acb、acfファイルをコンテンツブラウザの適当な場所にドラッグアンドドロップします。
acfファイルインポートの際に出てくるダイアログではどちらも「Yes」を押します。これにより、プロジェクトにacfファイルが適用されます。
B01.png
B02.png
コンテンツブラウザにAtomConfigとAtomCueSheetアセットが登録されます。
B03.png
AtomCueSheetアセットをダブルクリックして開き、キューが再生できることを確認します。
B04.png

メッセージ表示ウィンドウを用意する

メッセージとボイスを呼び出す実装から始めます。
サンプル用にメッセージウィンドウを表示するだけのシンプルなウィジェットを用意します。
コンテンツブラウザの適当な場所で右クリックし、「User Interface」→「Widget Blueprint」を作成します。
B05.png
親クラスには「User Widget」を選択します。
B06.png
ダブルクリックしてUMG(UIエディタ)を開きます。
B07.png
まずはPaletteパネルから「Canvas Panel」を配置します。
B08.png
「Image」と「Text」を配置して、簡単な会話ウィンドウを作ります。
B09.png

表示するテキストを自由に変えられるように処理を組みます。
テキストを選択します。
テキストブロックの名前を設定し、「Is Variable」にチェックを入れて変数として参照できるようにします。
B13.png
「Graph」タブを押してグラフに移ります。
B19.png

カスタムイベントを追加します。
B14.png
B15.png
変数化したテキストブロックをGetし、そこから線を伸ばしてSet Textノードを配置します。
B16.png
Set Textノードのピンクのインプットピンから線を伸ばし、カスタムイベントノードまで持っていきます。
B17.png
カスタムイベント側に「Text」というパラメータが作られました。外部からこのカスタムイベントを通し、テキスト内容を設定できるようになりました。忘れず線をつないでおきます。
B18.png

ボイスを再生する(メッセージ表示)

今回はメッセージ表示を管理するアクター「BP_TalkManager」を作成して、レベルブループリントからイベントを呼び出す方法をとります。

新規にアクターを作成します。
コンテンツブラウザで右クリックし、「Blueprint Class」を作ります。
C01.png
親クラスは「Actor」を選択します。
C02.png

分かりやすいよう「BP_TalkManager」と名前をつけました。
C03.png

イベントグラフを開き、Event Begin PlayからUIを画面に表示するノードを配置します。
Create Widgetノードを配置し、表示するWidgetBlueprintを指定します。
ここでは先ほど作った「UI_TextMessage」です。
C04.png
Add to Viewportノードをつなげて画面に表示します。白ピン、青ピンがつながれていることを確認してください。
C05.png

Create Widgetの青いアウトプットピンを右クリックし、「Promote Variable」を選択します。
C06.png
ウィジェットが変数として登録されます。変数に名前をつけ、Set Talk Widgetノードを末尾につなげます。
C07.png

「BP_TalkManager」内に新規にカスタムイベントを作成します。
C08.png
C09.png

Get Talk Widgetを配置し、そこから線を伸ばしウィジェット内のカスタムイベントを呼び出します。
C10.png
カスタムイベントのピンクのインプットピンをドラッグし、「BP_TalkManager」側のカスタムイベントにつなげることで、外部からメッセージを代入することができるようになります。
C11.png
C12.png

これで、レベルブループリントや外部アクターからカスタムイベントを経由することで、メッセージウィジェットに新たなテキストを表示することができるようになりました。

ボイスを再生する(音声再生)

「BP_TalkManager」にAtomコンポーネントを追加します。
Componentsパネルの「+Add Component」から「Atom Component」を選択します。
D01.png
カスタムイベントの後ろにGet Atom Componentを配置し、そこから線を伸ばしてSet Soundノードを配置します。
D02.png
Set Soundノードのインプットピンから線を伸ばし、カスタムイベント上でドラッグアンドドロップします。
D03.png
カスタムイベントに再生するサウンドを代入することができるようになります。
D04.png
Get Atom Componentから線を伸ばし、一番最後にPlayノードを配置します。
D05.png

ボイスを再生する(イベント呼び出し)

レベル上に「BP_TalkManager」を配置します。
E01.png

レベルブループリントを開きます。
E02.png
「BP_TalkManager」を選択した状態で、イベントグラフで右クリックし「Create a Reference to BP_TalkManager」を選択します。
E03.png
「BP_TalkManager」のリファレンスノードが作られます。
E04.png
Input Keyイベントを使い、キー入力に応じてメッセージが表示されるようにします。
E05.png
Get BP_TalkManagerから線を伸ばし、カスタムイベントNew Messageを呼び出すことでメッセージ表示、ボイス再生が同時に実行されます。
E06.png

ボイス再生のためにはキューシートを指定し、キューを取得する必要があります。
レベルブループリントに新規に変数を作ります。
型は「AtomCueSheet」タイプです。コンパイルし、DefauntValueに今回ビルドしたキューシートを指定します。
E07.png
Getノードを配置し、そこからGetSoundCueノードで再生したいキューのインデックスを指定すればOKです。
E08.png

GetSoundCue by Nameノードを使えば、キューを名前で指定することも可能です。
E10.png

ゲームを再生し、キーを押せば対応したメッセージとボイスが流れます。
E09.png

ゲームのシチュエーションに合わせたてテキスト機能の基礎が完成しました。
「追加機能編」記事では、ボイスを再生し終わったらページ送りを促すアイコンの表示や、オートで会話を送るような処理を書いていきます。

補足

ここでは実装の簡略化のためにキューをあくまで単発で呼び出しています。
大量のボイス再生シーンを用意する場合はデータテーブルなどの機能を使用したり、イベントをキューとして記憶しておき、順番に実行するなどの処理にすると使い勝手が良くなります。
次に再生するメッセージやボイスを記憶していく実装は「追加機能編」の記事で解説します。

3
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?