【最終回】超入門!Unityでパズルゲームを作ろう!「クリア判定とWebビルド編」

最終回クリア判定とWebビルド編
ゆくすぃ

ごきげんよう、Budding Lab.編集部のゆくすぃです!
「MONSTER HUNTER STORIES 3」の体験版がリリースされましたね!パオウルムーの赤ちゃんが可愛いです!

ゲームが大好きな皆さんなら、一度は「自分でゲームを作ってみたい!」と、思ったことがあるのではないでしょうか?

本連載では、ゲーム開発初心者のゆくすぃが、基礎的なスクリプトだけを使って、超入門・パズルゲームの作り方を解説します!

本記事は、最終回「クリア判定とビルド編」です。

プログラミングの専門知識がなくたって、画像や音楽作成アプリが使えなくたって、案外、ゲームって作れるものです。興味が湧いたなら、ぜひ挑戦してみてください!

2D脱出ゲームの作り方も解説しています。ご興味があれば、ぜひご覧ください!

目次

クリア判定を実装する

Scriptsフォルダの中に新規スクリプトを作成し、名前を付けて確定します。今回は「GameClearChacker.cs」としました。

クリア判定するスクリプト:GameClearChecker.cs

1 using UnityEngine;
2 using UnityEngine.SceneManagement; // シーンの切り替えを担うメソッド:LoadSceneを使うために必要
3
4 public class GameClearChecker : MonoBehaviour
5 {
6     public UIDragSnap[] draggablePieces; // ドラッグ操作用ピース(正解)のUI要素:配列
7     [SerializeField] SEController _seController; // SEControllerと接続(クリア時にSEを鳴らすため)
8     [SerializeField] private string _loadScene; // string型の変数_loadStringを定義
9
10    void Update()
11    {
12         if (AllPiecesSnappedCorrectly()) // すべてのピースが正解の位置に置かれていればゲームクリアとする
13         {
14              Invoke("SceneChange", 1.0f); // 1.0秒後にSceneChangeメソッドを呼び出す
15              _seController.StageClear(); // ゲームクリア時のSEを鳴らす
16         }
17    }
18
19    private bool AllPiecesSnappedCorrectly() // すべてのピースが正解の位置に置かれているか判定する
20    {
21        foreach (var piece in draggablePieces) // 配列 draggablePieces の全ての要素に処理を行う
22        {
23             if (!piece.IsSnappedCorrectly) // この処理の結果が一つでも"false"なら"false"を返す
24             return false;
25        }
26        return true; // すべてのピースが正解の位置あれば"true"を返す
27    }
28
29    public void SceneChange() // シーンを切り替える処理
30    {
31        SceneManager.LoadScene(_loadScene);
32    }
33 }

このスクリプトの大まかな流れは以下の通りです。

STEP
必要な変数を定義する
  • STEP2以降で利用する変数を定義する。
dands-blog_67
STEP
すべてのピースが正しい位置に置かれているか判定する
  • UIDragSnap.cs にある bool型の変数:IsSnappedCorrectly を参照してクリア判定する。
STEP
ゲームをクリアしたら、効果音を鳴らし、クリア画面に遷移する
  • SEController.cs にある StageClear() メソッドを呼び出して実行する。
  • 同一スクリプト内の SceneChange() メソッドを呼び出して実行する。

EventSystems 名前空間を追記する

2行目に「using UnityEngine.SceneManagement;」を追記することで SceneManager.LoadScene(シーンの名前、またはインデックス番号によってシーンを読み込む)を使えるようになります。

変数を定義する

青文字の部分で、変数を定義していきます。

クリア判定に利用する変数
  • public UIDragSnap[] draggablePieces; ・・・ 正解となるピースのUI要素
    UIDragSnap型の配列、Inspectorウインドウに複数の「変数:Draggable Pieces」を指定できる。
    (ドラッグ操作用ピースのうちパズルの正解となる「GameObject」を参照させる)
  • [SerializeField] SEController _seController; ・・・ 効果音を鳴らすスクリプト
    Inspectorウインドウで SEController.cs を参照させる。
  • [SerializeField] private string _loadScene; ・・・ ゲームクリア時の遷移先シーン
    Inspectorウインドウで ClearScene を指定する。

クリア判定を行う

19行目~27行目の「private bool AllPiecesSnappedCorrectly() 」に、クリア判定の処理を書き込みます。

クリア判定の処理:private bool AllPiecesSnappedCorrectly()

// すべてのピースが正解の位置に置かれているか判定する
private bool AllPiecesSnappedCorrectly()
{

// 配列 draggablePieces の全ての要素に処理を行う
foreach (var piece in draggablePieces)
{
// この処理の結果が一つでも “false” なら “false” を返す
// IsSnappedCorrectlyはUIDragSnap.csにあるクリア判定用の変数
if (!piece.IsSnappedCorrectly)
return false;
}
return true; // すべてのピースが正解の位置にあれば “true” を返す
}

シーンを切り替える処理を書きこむ

29行目~32行目の「public void SceneChange() 」に、シーンを切り替える処理を書き込みます。

シーンを切り替える処理:public void SceneChange()

public void SceneChange() // シーンを切り替える処理
{
// Inspectorウィンドウの Load Scene に遷移先のシーン(ClearScene)を指定
SceneManager.LoadScene(_loadScene);
}

クリア画面に遷移する

10行目~17行目の「void Update() 内の if (AllPiecesSnappedCorrectly())」に、ゲームをクリアしたら効果音を鳴らし、クリア画面に遷移する処理を書き込みます。

効果音を鳴らし、クリア画面に遷移する処理:public void SceneChange()

void Update()
{
// すべてのピースが正解の位置に置かれていればゲームクリアとする
if (AllPiecesSnappedCorrectly())
{
Invoke(“SceneChange”, 1.0f); // 1.0秒後にSceneChangeメソッドを呼び出す
_seController.StageClear(); // ゲームクリア時のSEを鳴らす
}
}

AllPiecesSnappedCorrectly() を毎フレーム呼び出す(そのうち、条件が満たされたタイミングで処理を実行する)ために、「void Update()」 の中に書きます。

処理を遅らせる関数:Invokeについては、以下記事を参考にしてください。

スクリプトをアタッチする

作成したスクリプトをアタッチします。

Hierarchyウインドウに Create Empty を新規作成し、名前を付けて確定します。今回は「GameClearChecker」としました。

dands-blog_68

「GameClearChacker.cs」を、Scriptsフォルダから「GameClearChecker」のInspectorウインドウにドラッグ&ドロップするか、Inspectorウィンドウの「Add Component」から選択することでアタッチできます。

dands-blog_69
Inspectorウィンドウで変数に参照させるもの
  • Draggable Pieces の Element 0~3
    パズルの正解となる4つのピースを参照させる
  • Se Controller
    効果音を鳴らすスクリプトSEController.csをアタッチしているゲームオブジェクト「SE」を参照させる
  • Load Scene
    ゲームをクリア時の遷移先「ClearScene」の名前を記入する

すべてのドラッグ操作用ピースにアタッチが済んだら、再生モードで動作を確認してみてください。

ゆくすぃ

4つのピースを正しい位置に置いてみましょう。ゲーム画面がクリア画面に切り替われば、ゲームは完成です!

ゲームをWebビルドする

ゲーム開発中は、Unityの再生モードを使って頻繁にゲームを動かしていましたが、ブラウザゲームとしてリリースするには、Unityがなくてもゲームが動く状態にしなければなりません。
それが「ゲームをビルドする」ということです。

まずは、エディター画面のツールバーから「File > Build Profiles」を選んでクリックします。

dands-blog_70

すると、以下のようなBuild Profiles画面が開くので、Platformsで「Web」が「Active」になっていることを確認し、画面下部の「Build」をクリックします。

dands-blog_71

次に、ビルドしたファイルを保存するフォルダを指定して「フォルダーの選択」をクリックします。
しばらく待つとビルドが完了し、指定したフォルダにゲームのファイルが保存されます。

以上で、ゲームのWebビルドは完了です。

Webビルドの軽量化

ゆくすぃが、Webビルドを軽量化するために行った設定をご紹介します。参考になれば幸いです。
※ゲーム開発環境:Unity(6000.2.7f2)、Windows 11

1.Project Settingsウィンドウを開き、Player > Other Settings の中の「IL2CPP Code Generation」で「Optimize for code size and build time」を選択する。

ビルドサイズの削減ビルド時間の短縮を優先して最適化する設定です。

dands-blog_72

2.Project Settingsウィンドウを開き、Player > Other Settings の中の「Managed Stripping Level」で「High」を選択する。

使っていないコードを最大限削除して、Webビルドを軽量化する設定です。

dands-blog_73

3.Project Settingsウィンドウを開き、Publishing Settings > Compression Format の中の「Compression Format」で「Brotli」を選択する。さらに「Decompression Fallback」にチェックを入れる。

「Brotli」は、選択肢の中で最も圧縮率が高く、ダウンロードサイズを大幅に削減できます。また、Brotliに対応していないサーバーへの保険として「Compression Format」にチェックを入れておきます。

dands-blog_74
ゆくすぃ

開発環境・利用サーバー・ゲーム内容によって最適解は変わってきます。ご紹介する内容はあくまで一例ですので、参考としてご利用ください。

まとめ

今回の記事では、クリア判定とWebビルドについて解説しました。初めてのUnity6でしたが、こうして無事にゲーム完成まで漕ぎ着けることができて、本当に良かったです。また、ビルドしたゲームが(今のところ)モバイルOSでも正常に動いていることが嬉しいです。

パズルゲーム制作を通して、UIをタップやクリックで動かす楽しみを知ってしまったので、次回もまた、画面上でUIを動かすタイプのゲームを企画したいなぁ・・・と、ふんわり考えております。Unity学習が進んだら、知識の定着と情報共有を兼ねて、また記事を書きたいと思います。どんどん学んで、一緒にゲーム開発を楽しみましょう!

以上、最後まで読んでいただき有難うございました!

よかったらシェアしてね!
  • URLをコピーしました!
目次