UE4未経験者が５日間でインベーダーゲームを作った話

はじめに

UE4未経験な私が５日間で単純なゲームを完成させることができたので、まとめたいと思います。

作ったゲーム

上から迫ってくるエネミーたちを撃ってKILLするゲームです。　いわゆるインベーダーゲーム。
f:id:r-ngtm:20180208103213g:plain

全てのエネミーを倒すとクリア
f:id:r-ngtm:20180208103347g:plain

エネミーが撃つ弾に触ってしまうとゲームオーバーです。
[ f:id:r-ngtm:20180208103507g:plain

エネミーが下まで来てしまってもゲームオーバーです。
f:id:r-ngtm:20180208104237g:plain

開発環境

Windows 10
UE4.18.3

学習開始時のUE4スキル

UE4の学習を始めた時点での私のUE4スキルを挙げると以下の通りです。
・２年前にUE4をインストールしたことがある。
・２年前にレベルブループリントを使って画面に"Hello"と表示させたことがある。
・UE4でゲームを作ったことは無い。

これはUE4未経験といっても差し支えないでしょう。
そんなUE4未経験な私が５日間でインベーダーゲームを完成させるまでの過程を紹介したいと思います。

学習の流れ

以下の流れで学習とゲーム作成を行いました。
・初日～３日目 : UE4の基本を覚える
・４～５日目 : インベーダーゲームを作る

初日～３日目 : UE4の使い方を覚える

最初にやった事はUE4の基本を覚えること。人から勧められた下記の書籍を読みました。

www.borndigital.co.jp

全ての章を読んだ訳ではなく、６章～１２章だけを読みました。
また、この書籍にはハンズオン動画が付いており、これを観ながらUE4の学習を進めました。

書籍だけを読むよりハンズオン動画を観たほうが速いです。ハンズオン動画オススメ。

覚えたことは全部メモする

今回、一度覚えたことは忘れないようにGoogle スプレッドシートに全てメモする、という事をやっていました。

f:id:r-ngtm:20180208105257p:plain

覚えたことを忘れてしまった場合でも、メモを作ってるおかげですぐに思い出すことができます。
調べ直す手間を省略することができます。

メモしたもの

GoogleSpreadシートにメモしたものは主に以下のものです。
・分からないことを調べていた時に見つけたWebサイトのURL
・ショートカットキー
・エディタの操作方法
・ブループリントで使用したノード
・マテリアルで使用したノード
・コンポーネント

１回調べた物は２度調べなくていいように全てをメモします。
こうすることで時間を節約することができます。

４～５日目 : インベーダーゲームの開発

6～１２章を読み終えたところで基礎をおさえることができました。
４日目からインベーダーゲームの作成に取り掛かります。

プロジェクトの新規作成

テンプレート; "TwinStickExample" を使用して新規プロジェクトを作成しました。

プレイヤーキャラの実装

TwinStickExampleではキーボード操作の上下左右移動が実装されています。
f:id:r-ngtm:20180208112702g:plain

今回はインベーダーゲームを作りたいのでこれを改造し、左右だけに移動するようにしました。
f:id:r-ngtm:20180208113056g:plain

また、弾の上下左右発射が実装されていたのでこれを改造し、マウスボタンを押しているときにだけ上方向に弾を発射するようにしました。

Tips: マウスの入力をとる方法

プロジェクト設定のAxisMappingを利用してマウス入力をとっています。
f:id:r-ngtm:20180208114345p:plain:w300

AxisMappingで設定した入力はブループリント側から取得することができます。
f:id:r-ngtm:20180208114459p:plain:w300

弾を生成するFactoryクラスを用意

弾を生成部分のロジックがかなり複雑なので、ロジックを見やすくするために専用のFactoryクラスを用意することにしました。
f:id:r-ngtm:20180208120706p:plain

中身はこんな感じです。
f:id:r-ngtm:20180208121005p:plain:w400

このFactoryクラスは位置と向きを指定して弾を生成するFireShot関数を持っています。
FireShot関数はTwinStickPawnが持つFireShot関数をベースとして作成しました。

エネミーキャラの用意

TwinStickExampleではプレイヤーが操作する水色の機体が用意されています。
f:id:r-ngtm:20180208112328p:plain

これを複製してマテリアルを差し替え、エネミー用の赤い機体を用意しました。
f:id:r-ngtm:20180208120359p:plain

また、一定時間ごとに弾を下方向に発射するようにロジックを改造しました。
f:id:r-ngtm:20180208121445p:plain

エネミーのFireShow関数の中身はこんな感じ。
f:id:r-ngtm:20180208121610p:plain

Factoryクラスを作ったことおかげで、エネミーの弾の発射ロジックを簡潔に組むことができました。

エネミーのジグザグ移動の実装

エネミーのジグザグ移動の実装にはスプライン曲線を利用しました。

下記URLを参考に作成しました
[UE4] スプライン上を動く足場の作り方｜株式会社ヒストリア

壁の用意

インベーダーゲームでは弾を防ぐ壁があるので、これを実装しました。
f:id:r-ngtm:20180208122028p:plain

壁の仕様は以下の通りです
・壁に弾が当たったら弾を消す
・壁にはHPがある
・弾が当たると壁そのもののHPが削れ、サイズも小さくなる
・壁のHPがゼロになったら壁は消滅

詳細は割愛しますが、壁のブループリントのイベントグラフだけ載せておきます。
f:id:r-ngtm:20180208122941p:plain:w400

弾の改造

今回は「弾はプレイヤーのものなのか、エネミーのものなのか」という情報を持たせたいので、TwinStickProjectileには列挙型PawnType型の変数を持たせます。
f:id:r-ngtm:20180208124032p:plain
f:id:r-ngtm:20180208123909p:plain