簡単に「Hidden Objects」ゲームの作成

こんにちは！ベトナム人エンジニアのTrinhです。ゲームを通して単語を覚えたいと思う外国語を勉強している人達が多く、私も同じ考えを持っています。人気のあるゲームの中に「Hidden Objects」というゲームがありますが、主に英語の言葉に関するゲームしか使用していないようなので、自分で日本語のバージョンで作成してみようと思います。今回はこのようにゲーム作成を紹介させていただきたいと思います。

1. 技術について

ゲーム業界でアプリを作成する技術はさまざまですが、主に「PCプラウザで遊べるゲーム」と「色々なデバイスでも遊べるハイエンドゲーム」の二つの種類があります。「Hidden Objects」は後者ですので、Unityフレームワークは最良のオプションだと思います。

Unityは2005年にUnity Technologiesによって発行されたゲーム開発プラットフォームです。現在、Unityは世界で最もよく知られているフレームワーク（またはゲームエンジン）の 1 つになりました。このツールは2Dおよび3Dゲーム、シミュレーション、インタラクティブな体験を作成するために設計され、強力で広く使用されているといます。

2. Unityのインストール

a. Unity Hubのインストール

Unity Hubは、Unityエディターの管理ツールで、複数のバージョンのUnityエディターのインストール、管理、プロジェクトの整理、およびライセンスの管理を簡単に行えるアプリケーションです。インストーラーはUnityホームページでダウンロードすることができます。

b. Unityアカウントの登録

アカウントをお持ちでない場合はUnityを有効化するためにアカウント登録する必要があります。以下の赤い箇所を押します。電話番号、もしくはメールアドレスで簡単に登録することができます。

c. Unity エディターのインストール

最初のステップが完了したら、以下のようにエディターをインストールする案内が表示されます。

画面の右上にも「Install Editor」ボタンが表示されていますので、この処理は一旦スキップしても大丈夫です。

インストールしたい場合はボタンを押して好きなバージョンを選んでお待ちください。

今回は「Unity 6 Preview」という最新のエディターにしました。

d. プロジェクトを作成する

次はProjectsタブに移動して、最初のプロジェクトを作成しましょう！

「Create Project」を押すと、色々な面白い設定を選べます。今回は簡単に作成するため２Dアプリにしました。

3. Unityワークスペースの概要

Unityのメイン作業画面は、主に以下の3つのエリアに分かれています。

1. Scene・Gameビュー

Sceneビューでは、ゲームのシーン内でオブジェクトの配置や調整を行います。3Dや2D空間でオブジェクトを移動、回転、スケールさせたり、カメラの視点を操作することができます。

Gameビューにスイッチすると、実際のゲームプレイ中の見た目を確認できます。プレイヤーがゲームをプレイしたときにどのように見えるかをリアルタイムでプレビューが可能です。

2. Hierarchy（ヒエラルキー）

シーン内に存在するすべてのオブジェクトをリスト形式で表示するエリアです。ここからオブジェクトを選択して操作したり、グループ化することができます。

3. Projectエリア

Projectエリアは、Unityエディターの中で重要な場所の一つで、プロジェクト内のすべてのアセット（ゲームのシーン内に置くオブジェクト）を管理・表示するエリアです。さらに、作動方法を操作するスクリプトも管理できます。

具体的に以下のような作業が行えます。

• アセットの整理

画像、モデル、スクリプト、オーディオファイル、マテリアルなどのアセットがフォルダごとに整理され、すべてのプロジェクトファイルが表示されます。

• インポート・エクスポート

新しいアセットをUnityプロジェクトに追加（インポート）したり、既存のアセットを外部ファイルとしてエクスポートすることができます。

• 検索とフィルタリング

大規模なプロジェクトではアセット数が多くなるため、Projectエリアでアセットを検索・フィルタリングして素早く見つけることが可能です。

• ドラッグ＆ドロップでシーンに追加

ProjectエリアのアセットをSceneビューやHierarchyにドラッグすることで、簡単にシーン内にオブジェクトを追加できます。

さらに、次のConsoleタブでスクリプトに書いてある出たログも見ることができます。

4.「Hidden Objects」ゲームとは？

簡単に言えば「Hidden Objects」は、テキストで書かれた単語のリストがあり、それに各ラウンドごとに、その言葉それぞれに対してどこかに隠されているアイテムを背景画像の中から見つけ出すゲームです。

このようなゲームには次の主要コンポーネントが必要です。

1. メインの背景画像
2. 画像のコレクション（色々な隠されたアイテム）
3. 単語表
4. カウントダウン時計

5. ゲーム作成のガイド

ステップ１：アセットをインポートする

商業目的の場合、独自のアセットを用意することが必要であるのはもちろんですが、それらをユニークで魅力的なものにするためには、自分で画像を作成することも重要だと思います。ただし、この記事では説明のみの目的として、インターネットからいくつかの画像をダウンロードさせていただきました。

上記のイメージのように表示される通りに、インポートするには、Projectエリアで右クリックし、『Import New Asset』をクリックして、選んだ項目をアップロードします。

ステップ２：Sceneビュー内に働きたいアイテムをドラッグする

アイテムは、Sceneビューに直接ドラッグするか、順序を気にせずにHierarchyにドラッグすることができます。

赤いボックスに「Order in Layer」というプロパティがあり、画面内の2つの異なるアイテム間の位置を調整するために使用します。この場合では、草むらを街灯の後ろに配置したいので、この草叢のレイアウト順序を0、街灯のレイアウト順序を1に設定し、メインの背景を-1として表示しています。

そして、レイヤー化できる 2 つの異なるアイテムを作成するためのヒントが 1 つあります。それは、背景を削除した SVG または画像を使用することです。このようなウェブサイトに無料で実行できることがあります。

ステップ３：単語表を用意する

メニューから「GameObject」を選択し、「Create Empty」をクリックすると、Hierarchyに新しいオブジェクト（2）が作成されます。

次に、右側のメニュー（3）から「Add Component」をクリックし、「Mesh > TextMeshPro – Text」を選択してください。この際、「TMP Importer」のインストールを求められますので、必ずインストールしてください。これを行わないと、テキスト入力フィールドに入力したテキストが表示されません。

日本語を入力するためにはフォントライブラリが必要ですが、それについては後ほど説明します。とりあえず英語で書いてある「街灯」を入力して進めていきます。

ステップ４：操作方法を制御するスクリプトを作成する

もうー度Projectエリアで右クリックし、「Create > Scripting > Empty C# Script」を選択してC#スクリプトを作成します。このファイルは「Visual Studio Code」やその他のIDEで開くと、編集が容易です。

もう一つ重要な点として、この機能は「MonoBehaviour」クラスを継承する必要があります。各部分の理解には少し時間がかかるかもしれませんが、まずはその仕組みを楽しみながら進めてみてください。

もう一度、Projectエリアで右クリックし、「Create > Scripting > Empty C# Script」を選択してC#のスクリプトを作成しましょう。このファイルは「Visual Studio Code」や他のIDEで開くと、編集がしやすくなります。

こちらでクリックすることのコントロールのためのスクリプトです。

using UnityEngine;

public class clickControl : MonoBehaviour
{
    public static string nameofobj;

    public GameObject objectnametext;

    void Start() {}

    void Update() {}

    void OnMouseDown() {
        nameofobj = gameObject.name;
        //Debug.Log(nameofobj);
        Destroy(gameObject);
        Destroy(objectnametext);
    }
}

もう一つ重要な点は、関数が「MonoBehaviour」というクラスから継承する必要があることです。各部分を理解するにはもう少し時間がかかると思いますが、今のところはその仕組みを楽しんでください。

ステップ５：スクリプトを追加してテストしましょう

まず、右側のメニューから「Add Component」を選択します。今回はアイテムに効果を与えるために「Physics 2D > Box Collider 2D」を追加します。

次に、エフェクトのプロパティで「Is Trigger」にチェックを入れ、イベントをトリガーできるように設定します。

スクリプトを追加するには、Projectエリアから右側のメニューにスクリプトをドラッグするだけで、スクリプト内で定義した変数（objectnametext）が表示されます。（スクリプトを保存するのを忘れないようにしてくださいね）。この変数には、特定のアイテムとリンクするリスト内の単語を設定します。Hierarchyから対応するテキストアイテム（lampPostTxt）をこの変数にドラッグして関連付けを行いましょう。

これで最初のテストの準備が整いました。

6. まとめ

ウェブサイト開発者にとって、初めてのゲーム制作は難しく感じられるかもしれませんが、挑戦してみる価値のある楽しいプロジェクトです。本投稿では、ゲーム制作の第一歩を紹介していましたが、C#を用いたスクリプトの記述方法や、ゲームにタイマーやエフェクトを追加する方法については、今後の投稿で詳しく説明していきますので、どうぞご期待ください。