ADX2 for UE4で変化するループBGMを再生する（AtomCraft編）

# はじめに
アンリアルエンジン4とサウンドミドルウェア「ADX2 for UE4」を連携させ、
現在の状態に応じてループ楽曲の曲調、テンションを変化させていく「インタラクティブミュージック」を実装する方法です。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">UE4+ADX2で、ゲームの状況に応じてBGMが盛り上がったり旋律が変化するやつを作りました。<br>動画では横に動くと旋律、縦に動くと曲のテンションが変わります。<br>実装法は記事に全部書きました。音源、サンプルプロジェクトも公開してるので気軽に試せるはず！<a href="https://t.co/45z8vsiPtA">https://t.co/45z8vsiPtA</a> <br> <a href="https://twitter.com/hashtag/UE4?src=hash&amp;ref_src=twsrc%5Etfw">#UE4</a> <a href="https://twitter.com/hashtag/UE4Study?src=hash&amp;ref_src=twsrc%5Etfw">#UE4Study</a> <a href="https://t.co/3H0AY9GdRO">pic.twitter.com/3H0AY9GdRO</a></p>&mdash; Sig @3DAct開発中 (@sleepyslowsheep) <a href="https://twitter.com/sleepyslowsheep/status/1290551162593140741?ref_src=twsrc%5Etfw">August 4, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

当記事ではUE4.23+「ADX2 LE v2.10.05」を使用します。

ADX2 for UE4の基本的な使い方はこちらの記事で。
**ADX2 for UE4でインタラクティブミュージック（AtomCraft編)**
https://qiita.com/SigRem/items/8af9b7d8445477906741
**ADX2 for UE4でインタラクティブミュージック（ブループリント編）**
https://qiita.com/SigRem/items/b53dc03d01c5f8fe1465

今回の内容について、楽曲素材とサンプルプロジェクトを用意しました。こちらを覗くとお手軽に試せます。
**楽曲素材**
https://drive.google.com/file/d/1jm_jS8yjQArGqjlaOzGF11_MeZZyAAoO/view?usp=sharing
**サンプルプロジェクト**
https://drive.google.com/file/d/1vqmUzY95Yfv64nxo0C2Xn8_iGiMWNywf/view?usp=sharing

プラグインを導入する必要があるので、下記の「導入編」を参照してADX2 for UE4を有効にしてください。

# 前提
「ADX2 for UE4 LE」を使用します。導入や簡単な使い方は以下の記事にあります。
ADX2 for UE4の導入で、一歩上のサウンド表現を（導入編）
https://qiita.com/SigRem/items/4250925f6d66a4fd287a
ADX2 for UE4の導入で、一歩上のサウンド表現を（実践編）
https://qiita.com/SigRem/items/c089b71c42e898980a46


#やること
- マウスカーソルの位置を取得し、現在地に応じた楽曲処理をする
- X座標により曲のフレーズを変化させる
    - 「ブロック再生」機能
- Y座標により曲の盛り上がりを変化させる
    - 「Aisac Control」機能
- ブループリントで見た目を華やかに

# 実装

## 楽曲の構成設計

今回作るループ楽曲は以下のような構成を想定します。

### 4つのブロックで構成される
BGMは、4つのフレーズから構成されます。
ベース・ドラムは一定ですが、ピアノ・パッド・リードは異なる4つの旋律が存在します。
![001.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/7f27112d-0c50-0de5-50d5-77fb76142258.png)


### 3つのテンションに変化する
楽曲の盛り上がりが、3段階に分けて変化するように作ります。
これらの段階を当記事では「ロー」「ミドル」「ハイ」と呼称し、
「ロー」ではピアノ・ハイハットのみが再生され、
「ミドル」ではパッド・ベース・キックドラムが追加、
「ハイ」ではリード・スネアが追加されるようにします。
![002.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/2b6b83ac-5daa-7677-6c1c-69c65ceb2ec5.png)
▲青色=ローテンション 橙色=ミドルテンション 赤色=ハイテンション

これらの要素を持つよう、AtomCraftでBGMを設計していきます。

## AtomCraftでBGMを構成する

### 素材の用意
今回のサンプルのための楽曲素材を用意しましたので、手元に使える素材がない場合試してみてください。冒頭のものと同じです。
https://drive.google.com/file/d/1jm_jS8yjQArGqjlaOzGF11_MeZZyAAoO/view?usp=sharing

### 素材のインポート
用意した素材を「マテリアルツリー」にドラッグ＆ドロップしインポートします。
![A01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/3927c873-9a78-541c-a020-48deee27b439.png)

### キュー、トラックの作成
「ワークユニットツリー」のキューシートを右クリックし、「新規オブジェクト」→「キュー『ポリフォニック』の作成」で新規にキューを作成します。
![A02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/a2181f39-f972-84f6-7cc5-30cd43105885.png)
分かりやすいようにリネームします。
![A03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/462dcb12-4530-5196-9029-75762d157189.png)
「マテリアルツリー」からピアノトラックの1フレーズ目となる、「ADX_BlockSample_Piano01」をタイムラインにドラッグ＆ドロップして配置します。ピアノ用のトラックが作られます。再生(F5キー)するとピアノだけが流れます。
![A04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/9ad1e3d0-aafb-6527-c690-fed2bb8457b2.png)
その他のトラックも置いていきます。
画像のように置きながら都度再生していくと、音が段々増えて楽しいはず。
![A05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/6c4ea198-b710-d786-6a4a-a1b1c383ea30.png)
すべて置いたら次に移ります。

### ブロックの作成
UE4で再生中に異なるフレーズを行き来できるよう、ブロック再生を設定します。この機能についての詳細とセットアップは以下の記事にあります。この記事だけでそのまま進めても大丈夫です。
**ADX2 for UE4でインタラクティブミュージック（ブロック再生編）**
https://qiita.com/SigRem/items/696ab6f1b4e533eebdbf

トラックリストの空欄で右クリックし、「新規オブジェクト」→「ブロックの作成」をクリックします。
![A06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/3be8120a-23ce-3d66-9378-4f19e72dcff4.png)
ブロックが作られ、タイムラインの最初から1フレーズ目の終了にかけて配置されます。
![A07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/8be1b91c-c883-ab0b-7961-caf3a55000fe.png)
さらに同じように、「新規オブジェクト」→「ブロックの作成」。
![A08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/cce423f0-8589-2929-bdaa-d1a46a677f54.png)
ふたつめのブロックがその先に置かれます。
![A09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/9be8708d-0b72-4428-6ccc-3e9d9a7f707d.png)
分かりやすいように、各ブロックに名前をつけます。
![A10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/c8f23295-5ac8-09f7-a80d-1d461477f600.png)
各トラックに対して、2フレーズ目のマテリアルを置いていきます。
「Bass」「DrumA」「DrumB」「DrumC」は各フレーズ共通となりますので、1フレーズ目と同じマテリアルを置いていきます。
![A11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/b4abe6d7-6a30-857d-ed0f-d358413161d6.png)
同じ作業を繰り返し、3つめ、4つめのブロックとフレーズを配置したらタイムラインは完成となります。
ここで一度テスト再生して、おかしいところがないか確認すると安全です。
![A12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/515ecfd7-ab5b-4a49-bcf9-f41b248598d2.png)

### Aisacコントロールで動的なボリュームを設定する
次に、動的に楽曲のテンションを変えられるようにAisacコントロール機能の設定を行います。
この機能についてはこちらの記事に詳細がありますが、とりあえず試したい方はこの記事でそのまま進めてもOKです。
**ADX2 for UE4でインタラクティブミュージック（AtomCraft編)**
https://qiita.com/SigRem/items/8af9b7d8445477906741

今回の設計をおさらいしてみましょう。
「ミドル」テンションではパッド、ベース、ドラムBが追加され、
「ハイ」テンションではリード、ドラムCが追加されます。
上記を踏まえると、ミドルテンション用、ハイテンション用にふたつのAisacコントロールが必要になります。
**Aisacコントロール_00**をミドルテンションに、**Aisacコントロール_01**をハイテンションに割り当てることにします。

「パッド」を担当するトラックを右クリックし、「新規オブジェクト」→「AISACの作成」をクリックします。
![A13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/dbe1031e-bfd9-1234-e4a5-913a57085254.png)
ここではそのままOKを押します。トラックのボリュームを変動させてテンションを表現するので、「AISACグラフタイプ」は「ボリューム」です。
![A14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/064c6533-1607-8149-1e68-11e2e6f7a365.png)
Aisacコントロールの編集画面が開くので、「ボリューム」を選択して画像のように右肩上がりのグラフを作ります。
![A15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/186255c2-8ef5-4523-42ee-238c5ddb2319.png)
これでAisacコントロールの数値が少ないほどパッドトラックの音量は小さく、「1」に近づくほど大きくなります。
再生して、上部のバーを左右に動かすとボリュームが変わるはずです。
![a16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/c1ba2871-7836-60c6-f779-e95497f2db46.png)
ベース用トラックにもAisacコントロールを追加します。
![a17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/f7c3cef0-e0c8-c92e-5b09-5ef40b3a0f4f.png)
パッド、ベース用トラックは「ミドル」テンションの際に同じタイミングでボリュームが変動するので、こちらも**Aisacコントロール_00**を使います。
![a18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/24d29e9a-23fd-d92a-3fc8-13f6615a3483.png)
同じように右肩上がりのグラフを作ります。
これでベースもパッドと同期して音量が変動するようになります。この挙動も上部のバーで確認できます。
![A19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/0ca6b127-ad31-14ff-20b5-79bb451036d0.png)
ドラムBのトラックにも同様にAisacコントロールとグラフを作成・設定します。
![A25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/e4b926cf-d41c-b88a-ca57-29ddba33996e.png)

ここから設定するのはハイテンション用のAisacです。
「リード」トラックには**Aisacコントロール_01**を指定します。
![A20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/b9b105af-2a34-d7c2-84e2-12e6a20f0878.png)
「ドラムC」トラックも同様です。
![A26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/104f45b9-5408-1aa6-4411-a223e18d5f2a.png)
最終的に5つの同じようなグラフが並ぶことになります。
![A21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/2d3b1261-26a2-9c9d-209e-cf499a3a5b8d.png)
上部のバーをドラッグし、ふたつのAisacコントロールが変化した際の音量の変化を試してみましょう。
![A22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/2bc5a6a6-f8be-2a16-e4fd-cc9709b69172.png)


### キューシートのビルド
AtomCraftでの工程が完了したら、キューシートをビルドします。
![A23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/f9f93989-acb7-1867-5412-69903194230e.png)
![A24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154452/efc85c3e-38d7-145a-2fa9-e45d9444f281.png)


ここからはUEでの作業に移っていきます。
次の工程はこちら！

https://qiita.com/SigRem/items/0a15d9a0adc90662d2a4