【Roblox Studio】親子でアスレチックゲームを作ろう!BGM・ゴール演出を実装しよう

    前回は、ギミックやチェックポイントを設置して、親子で遊べるアスレチックゲームが完成しました。
    これだけでも子供達はテストプレイが楽しくって、

    イチ

    次交代して!何で2回連続やるの!?

    と喧嘩勃発。

    おけ

    まてまてまだ完成じゃないぜ。BGMつけよう!

    そしたら子供達からこうしよう、こうしよう!とまた案がでてきました✧*。٩(ˊᗜˋ*)و✧*。

    そこで今回は、BGMの追加ゴールをキラキラ光らせる演出ファンファーレ「CLEAR!」の表示を実装して、ゲームらしさをぐっとアップさせていきます。

    どのBGMにするか、どんなファンファーレがいいか、キラキラの色や量はどうするか……。

    今回も子どもたちと相談しながら、「こんなゲームだったら楽しい!」を形にしていきました。

    ほんの少し演出を加えるだけで、「自分たちだけのオリジナルゲーム」が一気に完成形へ近づいていくので、ぜひ一緒に作ってみてください!

    前回の記事では、アスレチックコースの作り方や、チェックポイント・ギミックの設置方法を紹介しています。まだ作っていない方は、こちらからどうぞ。

    目次

    今回やること

    • BGMを追加する
    • ゴールをキラキラ光らせる
    • ファンファーレを鳴らす
    • 「CLEAR!」を表示する

    これでググッとゲームっぽくなります╭( ・ㅂ・)و ̑̑ グッ !"

    BGMを追加しよう

    ゲームの印象を大きく左右するのがBGMです。

    どーせ、安っぽい音しか無いんだろうなーとか思うこと勿れ。
    オシャレなボーカル付きの曲も、theゲーム!って感じの楽曲もたくさんありますよ(*・艸・)

    今回は、Roblox Studioに用意されている音楽の中から、子どもたちと相談しながら選びました。

    「元気な曲がいい!」
    「冒険っぽい方が楽しそう!」

    など、それぞれ好みが違うので、実際に何曲か再生して聞き比べながら決定。

    おけ

    ゲームの世界観に合う曲を選ぶ時間も、親子制作ならではの楽しみの一つでしたよ!

    結局は今回のチーフである長女の「k-popみたいな都会的で可愛い感じがいい!」とのことで決まりました。
    次女よ、癖あり楽曲は次のゲームで使うぞ。

    BGMを追加する方法

    エキスプローラから「Workspace」を選択します。

    「+」ボタンを押して「Sound」を追加します。

    オーディオから好きな曲を選んでクリックすると挿入されます。
    好きな系統を入れて検索することもできますよ(*´ω`*)

    ただ、著作権の問題でアーティストの曲ではなく、クリエイターの作った曲になります。

    が!

    レベル、めっちゃ高いです。曲選定だけでもかなり時間かかりますよ!

    画面右下、Loopedをオンにすると繰り返し再生されます。
    Volumeを調整して完成です。私は4にしました(画像は3ですが)

    ゲームを起動すると、BGMが流れるようになります。

    ゴールをキラキラ光らせよう

    次は、ゴール地点を分かりやすくするためにキラキラの演出を追加します!

    見た目が少し変わるだけですが、「ここがゴールなんだ!」と子どもにも伝わりやすくなります。
    今回はParticleEmitterを使って演出を追加しました。

    設定方法

    まずは、ゴールとなる床を選択し、名前がわかるようにしておきます。
    今回はゴールpartにしました。

    「+」を押して、「ParticleEmitter」を選びます。

    探しづらいときは検索窓に頭文字だけでも入れると探しやすいですよ。

    色や大きさ、放出量、放出の角度などは自由に変更できます。
    上の赤い部分の部分をいじるとできますよ。

    我が家では

    ニィ

    もっとキラキラ!

    イチ

    いや、多すぎる!

    なんて相談しながら調整しました。自分好みの演出を探してみてください♪

    ゴールしたらファンファーレを鳴らそう

    せっかくゴールしても何も起こらないと少し寂しいですよね。
    そこで、ゴールした瞬間にファンファーレが鳴るようにしてみます。

    こちらもRoblox Studioの効果音を使えば簡単に実装できます。

    まずは子どもと一緒に効果音を聞き比べて、お気に入りを選びましょう。

    おけ

    FFのレベルアップ音があるんだが、著作権的に大丈夫なのか…?
    最近やたら子供がロブロで遊んでると流れてるなーとは思ってたが。

    実装方法

    先ほど作ったゴール床(ゴールpart)に加えていきましょう。
    ここの床を踏んだら音が鳴る、というのが理想。

    こんな風にfanfareと検索するとたくさん出てきますよー(‘ω’)ノ

    いいのを見つけたら、ゴールpartにくっつけておきましょう。
    さらにゴールpartの+を押してscriptを挿入します。

    ゴールpart
     →ファンファーレの効果音
     →Particle Emitter
     →script
    とゴールpartの中に並列に3つ項目が並ぶようにしてくださいね。

    その後、以下のスクリプトを追加してください。

    local Players = game:GetService("Players")
    local ReplicatedStorage = game:GetService("ReplicatedStorage")
    
    local goal = script.Parent
    local fanfare = goal:WaitForChild("Top Prize")
    local showClear = ReplicatedStorage:WaitForChild("ShowClear")
    
    local touchedPlayers = {}
    
    goal.Touched:Connect(function(hit)
    	local character = hit:FindFirstAncestorOfClass("Model")
    	if not character then
    		return
    	end
    
    	local humanoid = character:FindFirstChildOfClass("Humanoid")
    	if not humanoid then
    		return
    	end
    
    	local player = Players:GetPlayerFromCharacter(character)
    	if not player then
    		return
    	end
    
    	if touchedPlayers[player] then
    		return
    	end
    
    	touchedPlayers[player] = true
    
    	fanfare:Play()
    	showClear:FireClient(player)
    end)

    ※右上のクリップマーク押すとコピーできるようにしておきました。ご活用くださいませ(‘ω’)ノ

    4行目の”Top Prize”は自分が選んだ効果音のタイトルを記入してくださいね。

    これでゴールした瞬間に自分が選んだファンファーレが流れるようになります。

    「CLEAR!」を表示しよう

    最後はクリア演出です。

    画面に「CLEAR!」と表示されるだけで、一気にゲームらしくなります。
    今回はGUIを使って表示を行いますね。

    実装方法

    ここにUIというボタンがあるので押します。

    するとここにScreenGuiというがあるので押します。

    すると右のエクスプローラにStarterGuiの下にScreenGuiが現れるので、+ボタンを押してText LabelとLocal Scriptを追加します。

    Text LAbelのプロパティをいじっていきます。

    エクスプローラ下のプロパティのtextの欄に表示させたい文字を入力します。
    私は🎉CLEAR🎉にしてみました。

    もちろん文字の色やフォントを変えることができます。

    左上に表示されましたので、真ん中にしたいところ。上画像の赤線のところをこのようにいじります。

    できたら、次はLocal Scriptを開いて以下のスクリプトを追加してくださいな

    local ReplicatedStorage = game:GetService("ReplicatedStorage")
    
    local showClear = ReplicatedStorage:WaitForChild("ShowClear")
    local clearLabel = script.Parent:WaitForChild("TextLabel")
    
    clearLabel.Visible = false
    
    showClear.OnClientEvent:Connect(function()
    	clearLabel.Visible = true
    
    	task.wait(4)
    
    	clearLabel.Visible = false
    end)

    フォントや文字の色、大きさを変更すれば、自分だけのクリア画面も作れます。

    ぜひ親子で相談しながらアレンジしてみてください。

    おけ

    パソコンで使える絵文字も入りましたよー。

    うまく動かない時は?

    Roblox Studioは、コードが間違っていることよりも、
    「オブジェクトの名前が違う」
    「置く場所が違う」
    といった設定ミスの方が意外と多いです。
    慌てずに一つずつ確認してみましょう。

    完成!

    これで、アスレチックゲームがさらにゲームらしくなりました。

    • BGMが流れる
    • ゴールがキラキラ光る
    • 「CLEAR!」が表示される

    演出が追加されるだけで、子どもたちの反応もぐっと変わります。

    おけ

    ゴールして無事に演出が出た時の長女のニヤリ顔、きっと私、忘れないと思います。

    今回一番苦戦したのは、まさかの私。

    ゲームを作るのは楽しい。

    でも……

    私、アスレチックが下手すぎる(笑)
    ゴールまでたどり着けないので、

    「ちゃんとスクリプト動いてる?」

    の確認ができません。

    ぽこポケ記事書いたり、ポケチャン記事書いたり、マイクラ記事かいてゲーマーママっぽいムーブしてますがアクションめっちゃ苦手なんです。

    ハートピアスローライフでもそういや書いてましたね。ゲーム内で長女と手を繋いでアスレチックをしてもらってました。

    今までのギミック床は一番最下層に置いて作れば良かったのですが、ゴール床は変にいじってバグったらそれこそ面倒。

    結局、

    スクリプトを書き換える

    長女がゴール

    「鳴らないよー?」

    スクリプトの書き換え

    の繰り返し(笑)

    めっちゃ書き換えて完成品を出しているので、どうぞ私の努力を享受してってください。

    そして完全にデバッグ担当は長女でした。

    ゲーム制作って、
    プログラムだけじゃなくてテストプレイも大事なんだなぁ…と実感しました。

    クリアプレイ100時間の大作ゲームとかどうしてんだろ。

    ※現在ファイヤーエンブレム風花雪月70時間プレイしてまだエンディングに行ってない人です。

    まとめ

    今回の演出を追加すると、ゲームの雰囲気がぐっと変わります。

    BGMが流れ、ゴールがキラキラ光り、クリアした瞬間にファンファーレと「CLEAR!」の表示が出るだけで、子どもたちからも「本当にゲームみたい!」と大好評でした。

    どのBGMにするか、どんな演出にするかを親子で相談しながら決める時間も、ゲーム作りならではの楽しさです。

    ぜひ、お子さんだけのオリジナル演出を作ってみてくださいね。

    次回予告

    いよいよこのシリーズも最終回です!

    最後は、長女が一番こだわった「クリア特典」を実装して、ゲームを遊んでもらうための最終チェックをしていきます。

    「本当に遊びやすい?」
    「バグはない?」
    「初めて遊ぶ人でも楽しめる?」

    親子で何度もテストプレイを繰り返しながら、一つのゲームを完成させていく様子をお届けします。

    ぜひ最終回もお楽しみに!

    ランキング参加中!

    ポチるとよろこびます にほんブログ村 にほんブログ村へ
    にほんブログ村
    よかったらシェアしてね!
    • URLをコピーしました!
    目次