i-school - おはじきゲーム 設計を考える

2Dアクションゲームの設計を考える


 Unityのバージョンは2019.4.xf1、あるいは2020.1.xf1にて製作を行う前提です。
 
 ゲームのジャンルは2Dゲーム、スマホで遊ぶアクションゲームです。

 基礎設計が出来上がれば、あとはイラストを自由に差し替えたり(キャラ以外のものに変更)、ステージ用の背景を変えたり、
スキルを追加したり、新しいルールや機能を追加していくことでオリジナルアプリとして製作することも出来ますし、
最終的にはポートフォリオとして頂くことも出来ます。

 少なくても以下の内容について、詳細な設計を考えていく必要があります。

・ゲーム性(Canvasのみでゲームを製作する、バトルシーン以外はタップで操作。バトルシーンはスワイプで操作。制限時間内にクリアを目指すための仕組み作り、など)

・画面のデザイン(UIの配置。ゲームの世界観に沿ったUIのデザイン、など)

・必要なシステム・機能(スワイプをしてゲーム画面内のゲームオブジェクトを弾く方法。敵や障害物を自動生成する方法、など)

・ゲームシーンを複数用意し、遷移する際にはトランジション処理を施す方法

・1つプレファブからの異なる敵や障害物を作成する方法(プレファブとデータベースの利用方法、など)

・演出(DoTweenによるアニメーション。画面のエフェクト、など)

・ゲームのサイクル(制限時間内を設定し終了と同時にリザルトを表示する。リザルトからまたステージ選択シーンに戻る、など)

 それでは1つずつ設計を行っていきましょう。


・ゲーム性

1.Canvasのみでゲームを製作する


 2Dのアクションゲームということですので、今回はゲームシーンの製作については、Canvas内のみでゲームを製作するようにします。
そのため、ヒエラルキー上にはまずCanvasを用意し、その中に必要なゲームオブジェクトを配置していく手法でゲームを製作していきます。

 多くのスマホゲームで利用させているデザイン手法ですので、UIの設置や画面の作り方などを学ぶことも出来ます。


2.基本動作はタップのみでゲームを進行する


 ステージ選択やキャラの選択、ゲームのスタートなど、バトルシーン以外の場面においては、すべて1回の画面タップでゲームが進行するような設計にします。

 ・ステージ選択(ピンを1つ選択してタップ1回 => タップしたステージが選択されてキャラ選択ポップアップが開く)
    ↓
 ・キャラ選択(初期設定のキャラ以外を1つ選択する場合にはタップ1回)

 ・ゲームスタート(スタートボタンをタップ1回 => ステージ選択シーンを終了し、バトルシーンが始まる)
    ↓
 ・アクションバトル(操作はスワイプだが、スキルの使用はタップ1回で行える)
    ↓
 ・リザルト表示(リザルト表示後、タップ1回 => ステージ選択シーンに戻る)

 上記のような挙動でゲームが進行していくように実装手順を考えます。


3.アクションバトルはスワイプで操作を行う


 ゲーム画面には手球であるキャラが設置され、的球である敵キャラや障害物も同じように画面内に設置されています。

 ゲームはビリヤードのような雰囲気を持っています。
 画面をスワイプするとバーが生成されますので、このバーを使い手球を上手く弾いて、敵キャラにぶつけていきます。
敵キャラと手球が接触すると敵キャラの体力が減少していきます。体力を 0 にすると敵が消えます。
 ポケット(穴)に手球を落とさないように弾いていきます。またポケットに敵キャラを落とすことができれば体力に関係なく1回で消すことが出来ます。

 敵キャラを消すとランダムで宝箱が出現し、宝箱は手球をぶつけることで獲得することが出来ます。
 
 敵キャラや障害物を直接弾くことはできません。


4.制限時間内にクリアを目指すための仕組み作り


 1回のゲームプレイは60秒(設定可能)とし、その時間内で敵キャラをすべて消すことがゲームの目的です。
またスコアアタック要素も追加できるように、敵キャラを1つ消すごとに点数が加算されていきます。
ポケットに敵キャラを落とすと点数が高くなるなど、機能を追加すれば、より面白い設計が可能です。

 発展課題で実装するスキルを使用することによって、キャラをタップして周囲にいる敵キャラと障害物をまとめて攻撃できます。
特に破壊できない障害物も破壊できますので、弾いて敵キャラを消すのとはまた違った爽快感があります。
 
 ゲーム終了後にはリザルト(挑戦結果)が表示され、今回の獲得した点数と残った時間を表示することで、この値が次に向けての指針作りにもなっています。
(リザルトへの表示内容は自由に追加しましょう。スキルを使用した回数や、穴に敵キャラを落とした数、など)

 この辺りのバランスを調整して(レベルデザインを行って)何回も遊んでもらえるような仕組みを作ります。
 

 

・画面のデザイン

1.UIの配置


 Canvas内にてゲームを製作するようになりますので、各画面に表示・設置するゲームオブジェクトについて設定をしておく必要があります。

 ・ステージ選択時 : 1つのプレファブからステージの数分のボタンを用意して、それを自動で生成して順番に並べて表示する。配置をバランスよく考える。

 ・キャラ選択時  : 1つのプレファブからキャラの数分のボタンを用意して、同じように自動的に生成して順番に並べて表示する。獲得していないキャラはロック表示をつける。 
           ゲームスタートボタンの配置場所、キャラのステータスの説明場所などを用意する。
           背景のイメージは目立ちすぎないものにする、などわかりやすい配置を心がける

 ・アクションゲーム時 : スワイプできる部分とそれ以外の上下のUIの部分(スコアや点数表示、手球の数などの表示部分)とを分けて考える。

 ・リザルト表示時 : スコアなどの表示部分と、背景部分、タップを促す表示などを考える

 他にも必要な場合にはロジックも考えて設計し、画面へ追加していきます。


2.ゲームの世界観に沿ったUIのデザイン


 各画面のUIは常にゲーム中表示されていますので、そのデザインや、文字に使用するフォントの種類が見にくかったりするとユーザーは疲れてしまいます。
世界観に凝ったデザインもよいですが、見やすさ、読みやすさも一緒に考えて、バランスを保ちましょう。
 

必要なシステム・機能

1.スワイプをしてゲーム画面内のゲームオブジェクトを弾いて操作する


 ビリヤードを基準としたゲームを考えていますので、手球を直接操作は出来ません。
プレイヤーの役割はキューであり、「手球を弾くもの」です。

 この「弾く」操作をゲーム内で再現するためにスワイプ機能を使っていきます。

 直接操作ができない分、上手く手球を弾いて敵キャラに続けてぶつかったりしたときの爽快感は格別なものがありますので
その辺りをユーザーにも楽しんで頂くように心がけましょう。
 

2.敵キャラや障害物を自動で生成する


 バトルが開始されたときに敵キャラや障害物を自動で生成するようにロジックを組みます。

 ゲームの管理用スクリプトを作成し、それが自動生成処理や、ゲームの進行管理などを担うようにしていきます。


3.データベースを作成してゲーム内のデータとして利用する


 データベースとは、検索や蓄積が容易にできるよう整理された情報の集まりのことです。
今回は、敵キャラの情報などをこのデータベースとして作成します。

 Unityにはデータベース機能として、スクリプタブル・オブジェクトという機能が用意されています。
またUnityでは外部の拡張機能を採用することによってExcelにて用意したシナリオ用のデータを直接参照する方法もあります。

 この方法を利用して、Excelで作成したデータベースをUnityにインポートして利用するようにしていきます。
このようにデータベースで管理しておくことで、敵キャラの情報の比較や修正、管理が容易になります。

 具体的な方法については後述します。


ゲームシーンを複数用意し、遷移する際にはトランジション処理を施す方法


 3つのシーンを用意して遷移しながらゲームを進行していくようにします。
シーン遷移時にはトランジション(切り替え)処理を用意して、すぐにシーンが切り替わるのではなく
このトランジション処理を組み込んでシーン遷移を行うようにしていきます。

 トランジション処理によってゲームの見栄えが大きく変わります。


1つプレファブからの異なる敵や障害物を作成する方法


 敵キャラを生成する場合、敵キャラの数だけプレファブを用意する方法もありますが、ここではすべて個別に作成するのではなく、
元となるプレーンな敵キャラ用プレファブを1つ用意しておいて、自動生成しながら、各敵キャラとしての役割・ふるまいを与えられて画面に配置されるような設計にします。
 
 プレーンな敵キャラを自動生成する
   ↓
 用意された情報を元に、敵キャラの画像、体力などを自動で設定し、「どんな敵であるか」というふるまいを決める


演出(エフェクト)

1.DoTweenを使用してアニメーション演出をする


 DoTween(ドットゥイーン)とは無料アセットの1つで、広く使われているTween(トゥイーン)系のアセットです。
Tweenとはゲームオブジェクトの途中経過情報を補間して表現することを言います。
例えば、Aというゲームオブジェクトが現在の地点から別の地点に移動するに際し、その移動する間の情報を補間して表現することが出来ます。
この補間表現機能を利用することにより、様々なアニメーション演出を実装出来ます。

 またDoTweenには、この機能が終了するタイミングを待って別の処理を呼ぶことや、途中で補間処理を中断したりといったことも出来ます。
Transformコンポーネントに対しての補間機能が多くありますが、それ以外にも使用方法は多岐にわたります。

 特に今回は多くの部分でこの機能を利用します。


2.画面のエフェクト


 画面をフラッシュさせたり、暗転させたりといったものだけではなく、キャラクターを揺らしたり、文字を一部だけ大きくしたりなど
画面を通じて行える演出はたくさんあります。これらはシナリオに応じて適した内容のエフェクトを適宜いれていくことで、ゲームの臨場感や没入感が変わってきます。
 
 やりすぎず、少なすぎず、バランスを見ながら考えて実装しましょう。


ゲームのサイクル

1.ゲームの流れ

 
 何回も繰り返し遊んでもらうような設計になっているため、明確なエンディングはありません。
ステージ選択からはじまって、最後にはまた、ステージ選択に戻るようなサイクルを作成します。


2.追加の要素を作る


 【1】の部分を改良し、ステージ選択シーンに、キャラの準備要素を新しくシーンとして追加します。

 このキャラの準備シーンでは、ゲーム内で獲得したコインを消費して、新しいキャラをアンロックさせる機能を追加し、
ゲーム内で使用できる手球のバリエーションを増やします。

 この要素を追加することによって、バトルで獲得できるコインに大きな役割が生まれます。
クリアした際に、ハイスコアだけではなく、たくさん集めればそれを使える、という部分が出来、
プレイ結果がゲーム内に反映されるという側面を持つようになります。


 
 設計の項目については、以上になります。詳細については実装する際の手順内にて説明を補記していきます。
また、これら以外にも用意するべきものがあるのであれば、それらも考えておきましょう。