86.爆発音やUIの効果音を実装してみよう
🐱では前回アイテムの効果音を実装した訳ですが、このページからは爆発の効果音とUIのボタン音を実装していきます。今回は減衰を使用したり、2Dサウンドノードなど前回とは少し異なる方法で実装していきます。
①減衰付きの爆発音を鳴らしてみよう|実践
ではまず、減衰を付けた3Dサウンドの爆発音を鳴らしていきます。
https://youtu.be/pwkkQaiXmXo
まずは減衰付きの爆発音から作成して、後から爆発ループさせる処理を追加します。
前回使用したプロジェクトのままでも構いませんし、新たにサードーパーソンテンプレートプロジェクトを作成してもらっても構いません。スターターコンテンツを使用していきます。
https://scrapbox.io/files/65ce8173a3219e0025dc65a7.jpg
まずはAudioフォルダを用意して、右クリック > サウンド > サウンドキューから作成します。名前をA_Explosionにします。
https://scrapbox.io/files/65ce81962419d900247ea8ad.jpg
サウンドキュー命名時の絶対的な慣例は無いのですが、もし文頭などに頭文字つけるのであれば「A_Explosion「A_Explosion_Cue」「Explosion_Cue」などがおすすめです。最初は自分のわかりやすいもので良いです。
自分の場合は頭文字に『SC』(サウンドキューの略)をつけるようにしています。
サウンドキューを開いて、WavePlayerノードを追加し、スタータコンテンツのExplosion01を選択します。
https://scrapbox.io/files/65ce81d96dbd9900243f249e.jpg
次に減衰を設定します。アウトプットを選択してOverride Attenuationにチェックを入れます。
https://scrapbox.io/files/65ce81e2d7984200263e2c63.jpg
🐱これでこのサウンドキューに減衰(距離によって音量が変化したり、音を左右から聞き分けられる)を設定できました。また減衰は紹介した通り、減衰アセットを作成して割り当てる事もできますが今回は個別に簡単設定できるOverride Attenuationを使用します。
一旦サウンドキューをレベルに追加します。するとうっすらですが減衰範囲となる球体が見えます。
https://scrapbox.io/files/65ce81efd29c9c0025c24661.jpg
レベルで減衰の範囲を確認しつつ、サウンドキューのエディタを開いて減衰の > 減衰最短距離を400,フォールオフ距離を800にします。
https://scrapbox.io/files/65ce82083dd1f30024778965.jpg
これで800cm以内から爆発音が聞こえ始めて、400cm以内だと音が一定音量で再生されます。
確認したらもうサウンドキューは必要ないので削除します。
https://scrapbox.io/files/65ce8235d5cfbc00254b2075.jpg
😺続いて爆発のエフェクトと効果音を鳴らす処理を実装します。
右クリック > ブループリントクラス > アクタを作成します。名前をBP_Explosionにします。
https://scrapbox.io/files/65ce8265ae23c70027821f87.jpg
開いてParticleSystemコンポーネントを追加します。
https://scrapbox.io/files/65ce82815443a8002685b593.jpg
ParticleSystemコンポーネントの名前をPS_Explosionにします。
https://scrapbox.io/files/65ce8290b25124002889702e.jpg
PS_Explosionを選択した状態でパーティクルからP_Explosionをセットします。
https://scrapbox.io/files/65ce82a1ae23c70027821fdc.jpg
そしたらそのままBP_Explosionのイベントグラフを開きます。
https://scrapbox.io/files/65ce82ce0eb32f0024777909.jpg
BeginPlayからSetTimerbyEventノードを作成します。Timeは3.0にしてLoopingにチェックを入れます。
https://scrapbox.io/files/65ce82db2e80c2002535977c.jpg
SetTimerbyEventノードとは？
Eventピンに接続したカスタムイベントをTimeの時間で繰り返し実行するノードです。
EventからCustomと検索してカスタムイベントを作成します。名前はActivateExplosionとします。
https://scrapbox.io/files/65ce8307dc21eb0024ac6b88.jpg
そこからActivate(PS_Explosion)ノードを追加して、SpawnSoundatLocationとGetActorLocationノードを追加します。Soundには「A_Explosion」をセットします。
https://scrapbox.io/files/65ce8317ae23c7002782208c.jpg
Activateノードとは？
Activateノードは今回でいうパーティクルコンポーネントをアクティブ状態にするノードです。アクティブにするとパーティクルは再生されます。なお、パーティクルは再生が終了すると自動的に非アクティブになるように設定されているため、3秒毎にActivateノードで再生できるといったかんじになっています。
最終的な全体ノードは以下です↓
https://scrapbox.io/files/65ce8376b251240028897138.jpg
BP_Explosionをレベルに追加します。
https://scrapbox.io/files/65ce83980290f10025aa7581.jpg
🐱BP_Explosionはゲームが開始した時点でパーティクルの設定により、最初に一回だけ自動再生されるようになっています。そこで自動再生されないようにしておきましょう。
BP_Explosionを開いてPS_Explosionコンポーネントを選択した状態で
AutoActivateのチェックを外しておきます。
https://scrapbox.io/files/65ce83cbcb9c1d00276a0c3c.jpg
これでゲーム開始時に自動再生されなくなりました。
プレイしてみると爆発のエフェクトとともに爆発音が聞こえるようになっています。また音には減衰も追加したので800cm以上だと音は聞こえずに、400~800cm以内だと徐々に音量は変化して、400cm以下だと音量は一定に聞こえます。
https://youtu.be/pwkkQaiXmXo
😺基本的にはこういったレベル上で鳴らす効果音は ①減衰をつけたサウンドキューを用意 ②SpawanSoundatLocationで鳴らす というのが一般的な方法になります。では続いてボタン音を実装していきましょう!
②UIのボタン音を鳴らしてみよう|実践
では今度はUIのボタンを押した時やマウスカーソルをホバーした時の音を実装してみましょう。こんな感じに実装します↓
https://youtu.be/ZVjP4CYz-H8
それでは実際にやってみましょう。
先程作成した同じサードパーソンのプロジェクトで進めていきますが、新しいプロジェクトからでも構いません。
https://scrapbox.io/files/65ce8422b02de60024faedf8.jpg
まずは先程と同じく効果音ラボさんのサイトから「カーソル移動2」「カーソル移動9」をダウンロードします。 https://scrapbox.io/files/65ce8434d7984200263e2fec.jpg
これもmp3からwave形式に変換する必要があるのでCloudConvertでwavに変換します。ドラッグ＆ドロップして変換します。 https://scrapbox.io/files/65ce8478baaf8b0023b5117f.jpg
エクスプローラーからドラッグでwav形式にした音声をインポートします。
https://scrapbox.io/files/65ce84ce2e80c20025359b21.jpg
次にUIを作成します。右クリック > ユーザーインターフェース > ウィジェットブループリントから作成します。名前をWBP_AudioTestにします。
https://scrapbox.io/files/65ce84da72c6490023d840c1.jpg
WBP_AudioTestのウィジェットブループリントを開いてパレットからCanvasPanelをまず追加します。
https://scrapbox.io/files/65ce84eb3dd1f30024778ebc.jpg
次にButtonとTextを追加します。
https://scrapbox.io/files/65ce84f9634dd60024d15cfb.jpg
Buttonをドラッグで大きくして、位置少し移動させます。適当に見やすいButton配置で構いません。
https://scrapbox.io/files/65ce85230d782300246e4707.jpg
現在こんな感じ↓
https://scrapbox.io/files/65ce852f83dbd9002452dccc.jpg
次にTextウィジェットを選択した状態でコンテンツ > Textを「Button」に、アピアレンス > Font > sizeを50にします。
https://scrapbox.io/files/65ce853eedde530025c8ee87.jpg
Buttonを選択した状態でアピアランス > Styleの中のPressedSound(押した時の音)にカーソル移動9を設定します。HoverdSound(ホバーした時の音)にはカーソル移動2を設定します。
https://scrapbox.io/files/65ce85543dd1f30024778f67.jpg
これでUIは完成したので次にレベルブループリントを開きます。
https://scrapbox.io/files/65ce855edeb1aa00259af52c.jpg
いつものUIを表示させるノードを作成します。CreateWidgetノードからAddtoViewportノードを作成します。ClassにはWBP_AudioTestをセットします。
https://scrapbox.io/files/65ce8569ae23c700278226f0.jpg
プレイしてみましょう。カーソルをボタンにホバーした時と押した時、それぞれ音が鳴るようになりました。
https://youtu.be/ZVjP4CYz-H8
以上です。UIのボタン音などはこのように設定できる場所があるのでそこから設定していきましょう。
😺これまでで3Dサウンドの効果音、BGMの音、UIの音など実装してきました。次ページではアクタにAudioコンポーネントを付けて音を鳴らす方法を紹介していきます。