ゲーム開発研修前半【21新卒技術研修】/2021-game-training

21新卒技術研修で実施したゲーム開発（Unity）研修の講義資料です。
動画：https://youtu.be/uA1q-Jp_7gE
リポジトリ：https://github.com/mixigroup/2021BeginnerTrainingUnityPublic

21新卒技術研修全体のまとめ記事
https://medium.com/mixi-developers/a0bcdbf9bca0

Transcript

1. 2021-新卒研修-ゲーム開発-前半
2. 目次 I. T01. まずUnityをGUIだけで触ってみよう II. T02. スクリプトを書けるようになろう III. T03. ゲーム画面にUIをつけてみよう IV. T04. 当たり判定を実装してみよう V. T05. コルーチン（Coroutine）
3. 自己紹介 • 岡本 勇太（yuta.okamoto） • 2018新卒入社 • モンストクライアントG エンジニア ◦ C++ / Cocos2dx ◦ ストライクショット ◦ 新規コンテンツのUI実装 ◦ 開発フロー改善 ◦ モンスターストライクスタジアムの開発サポート
4. T01. まずUnityをGUIだけで触ってみよう
5. T01. まずUnityをGUIだけで触ってみよう • GameObject作成する ◦ Hierarchy -> 右クリック -> Create Empty ◦ GameObject名: FieldRoot • 子GameObject作成する ◦ Hierarchy -> オブジェクト選択右クリック -> 3D Object -> Cube ※ドラック&ドロップで移動も可 ◦ GameObject名: Base
6. T01. まずUnityをGUIだけで触ってみよう • 座標、向き、大きさを変更する ◦ Inspector -> Transform Component ◦ ※Unityの座標系はY軸が縦方向
7. T01. まずUnityをGUIだけで触ってみよう • GameObjectが重力の影響を受けるようにする ◦ Inspector -> Add Component -> RigidBody ◦ 適当な高さのY座標に置いて、「Run　　 」すると、自由落下するようになっている。
8. T01. まずUnityをGUIだけで触ってみよう • GameObjectに弾性を加えてみる ◦ Assets/Tasks/T01/Physic Material.physicMaterial ▪ Bounciness: 1 0~1の範囲でオブジェクトの弾性（跳ね返りの度合い）が設定できる ◦ GameObjectのInspector -> ◯◯ Collider -> Material にドラック&ドロップ
9. T02. スクリプトを書けるようになろう
10. T02Ex. MonoBehaviour • MonoBehaviour is the base class from which every Unity script derives. (MonoBehaviourは、すべてのUnityスクリプトが派生する基本クラスです。 ) らしい。（MonoBehaviour） • 語弊を恐れず簡単に言うと スクリプトを書く際に MonoBehaviourを継承する必要があり、そのスクリプトで Unityのライフサイクルに よって呼び出されるイベント関数の内容を定義できる。 • イベント関数はいくつかあり、詳しくは公式マニュアルに載っています。 https://docs.unity3d.com/ja/2019.4/Manual/ExecutionOrder.html
11. T02Ex. Awake, Start, Updateメソッド • MonoBehaviourクラスのメソッドでUnityのシステムから呼び出されるイベント関数 • Awake() ◦ アタッチされたGameObjectが初期化された時に呼び出されるメソッド。 ◦ Startよりも呼び出し順が早いため、シングルトンなど複数から参照される可能性のあるインスタンスの初期化処理を 呼び出したり。 ◦ MonoBehaviour-Awake() - Unity スクリプトリファレンス • Start() ◦ スクリプトが有効になった最初のUpdate()が呼ばれる直前に呼び出されるメソッド ◦ 例）初期化など1度だけ実行したい処理を呼び出したり。 MonoBehaviour-Start() - Unity スクリプトリファレンス • Update() ◦ スクリプトが有効な時に毎フレーム呼び出されるメソッド ◦ 例）タッチ判定、フレーム単位での座標更新を行ったり。 MonoBehaviour-Update() - Unity スクリプトリファレンス
12. T02. スクリプトを書けるようになろう • スクリプトで動かすGameObjectを作成する ◦ 今回はカプセルのGameObjectを作成。（3D Object -> Capsule） ◦ 用意されているMoveTarget.csをGameObjectにアタッチ。（Inspector -> AddComponent） • MoveTargetクラスに変更を加えて 移動速度を調整できるようにしてみよう • MoveTargetクラスに変更を加えて XZ平面を円形に移動するようにしてみよう • チャレンジ：新しいスクリプトを作成して GameObjectにアタッチ、好きに変更してスクリプトの理解度を深 めよう
13. T02. スクリプトを書けるようになろう • MoveTargetを量産する ◦ MoveTargetをPrefab化する。（次スライド） ◦ MoveTarget生成用のGameObjectを作成。（Create Empty） ◦ FactoryMoveTarget.csをGameObjectにアタッチ。（Inspector -> AddComponent） • FactoryMoveTargetクラスに変更を加えて 初期生成位置を指定できるようにしてみよう • FactoryMoveTargetクラスに変更を加えて ランダムな位置に生成するようにしてみよう • チャレンジ：別のPrefabを作成、好きな条件で 2種類のオブジェクトを出し分けてみよう
14. T02Ex. Prefab化 • Prefab化する ◦ 再利用出来るようGameObjectをオブジェクトファイルとして保存する ※拡張子は.prefab ◦ Hierarchyから Project -> 保存したいフォルダ上にドラック &ドロップ • Prefab化したオブジェクト自体を編集したい場合 ◦ Prefab化したオブジェクトを選択 ◦ Inspector -> Open Prefab ◦ 値をいじると自動でScene側のGameObjectにも反映されてる。
15. T03. ゲーム画面にUIをつけてみよう
16. T03Ex. Canvas • UnityにおいてUI表現をするために必要なコンポーネント ◦ https://docs.unity3d.com/ja/2019.4/Manual/class-Canvas.html ◦ UI オブジェクトはCanvasコンポーネントを持った GameObjectの子である必要があります。 ▪ Text、Image、Button...etc • Canvas = UI描画する領域（のようなもの） ◦ 描画優先やCameraと組み合わせてどのように表示するかを設定できる。 ◦ 複数Canvasを作成することで描画内容毎に UIオブジェクトを管理したりなど。 ▪ Canvasの子要素の表示が変化した際、 Canvasの子要素全てが再描画されるため、 最適化の面でも静的な UIと動的なUIはCanvasを分けたほうが良いです。
17. T03Ex. UIオブジェクト • UIを構築する上で扱うコンポーネントを持った GameObject ◦ Inspector -> 右クリック -> UI ▪ Text：文字を描画する ▪ Text - TextMeshPro：文字を描画する（Textよりも機能が豊富でリッチな表現ができる） ▪ Image：画像を描画する ▪ Button：ボタンを実装する。etc… • UIオブジェクトはRectTrasnformという矩形を扱うコンポーネントを持ちます。 ◦ https://docs.unity3d.com/ja/2019.4/Manual/class-RectTransform.html ◦ Position, Rotation, Scaleの他にWidth, Height, Anchor Pointなど UI描画に必要な要素を持ったコンポーネント。
18. T03. ゲーム画面にUIをつけてみよう • Canvasにテキストを配置する ◦ Hierarchy -> 右クリック -> UI -> Text - TextMeshPro ※今回はuGUIのTextではなく、TextMeshProを使用する ※Canvasが存在しない場合自動的に Canvasが生成され、子にTextオブジェクトが生成される • Inspectorから好きな文字列をゲーム画面に表示させてみよう • チャレンジ：早く終わった人はスクリプトで文字列を変えれるようにしてみよう
19. T03. ゲーム画面にUIをつけてみよう • Canvasに画像を配置する ◦ Hierarchy -> 右クリック -> UI -> Image ◦ ImageのInspector -> Source Imageに｢CC0｣という画像ファイルをドラッグ &ドロップ • 好きな画像を画面に表示させてみよう • チャレンジ：早く終わった人はスクリプトを使って時間経過やマウス動作によって画像や位置が変わるよう にしてみよう
20. T03. ゲーム画面にUIをつけてみよう • Canvasにボタンを配置する ◦ Hierarchy -> 右クリック -> UI -> Button - TextMeshPro ◦ 作成されたButtonオブジェクトの子オブジェクトに Textが追加されているので、その Textを編集して ボタンに表示されている文字を変えてみる ◦ ButtonオブジェクトにはImageコンポーネントがあるので先ほどの Imageと同じく画像を差し替えるこ とが出来る • 好きな画像と文字列に変更してみよう
21. T03. ゲーム画面にUIをつけてみよう • ボタンが押されたときの処理を追加する ◦ Hierarchyにある先ほど作った Buttonオブジェクトに、ButtonCallback.csをアタッチして InspectorのButton欄にButtonオブジェクトをドラッグアンドドロップ 「Run　　」 -> ゲーム画面に表示されたボタンを押してみる • ButtonCallback.csの実装を見てみよう • ButtonCallbackクラスに変更を加えて ボタンが押されたときの動作を変更してみよう • チャレンジ：新しいシーンを作成して、ボタンが押されたらシーン遷移するようにしてみよう
22. T03Ex. ボタンのコールバックについて • ボタンが押されてどんな処理をするかを指定するとき、 Unityでは2通りのやり方がある ◦ InspectorからButtonコンポーネントを見ると On Click()という項目があるのでそちらを使う。 Scene中のオブジェクトを選択、そのオブジェクトにアタッチされたスクリプトの選択したメソッドを実 行させる。 ◦ スクリプトからbutton.onClick.AddListener([Arg])で[Arg]に呼び出したいメソッドを指定する。
23. T04. 当たり判定を実装してみよう
24. T04. 当たり判定とは？ • 簡単に言うと、「物と物が接触した事を知る判定」のこと。 • Unityでは主に２つのコンポーネント、「～ Collider」、「Rigidbody」を用いて当たり判定を行います。 ◦ Collider : オブジェクトに物理衝突のための形状を与えるコンポーネント。 「BoxCollider」、「SphereCollider」等の数種類の形状の物が用意されています。 ◦ Rigitbody : オブジェクトに物理特性を与えるコンポーネント。 基本的には物理演算で動作させたいオブジェクトに設定します。 壁や床等の動かさないオブジェクトにはアタッチする必要はありません。
25. T04. 当たり判定のコールバック • Unityでは衝突が発生するとコールバックが実行されます。 それぞれの状況に応じたコールバックが存在するので、必要に応じて使い分けます。 ◦ isTriggerにチェックが無い時 ▪ 触れた時 : OnCollisionEnter ▪ 触れている間: OnCollisionStay ▪ 触れているのが離れた時 : OnCollisionExit ◦ isTriggerチェック時 ▪ 触れた時 : OnTriggerEnter ▪ 触れている間: OnTriggerStay ▪ 触れているのが離れた時 : OnTriggerExit
26. T04. 衝突した際に処理を行う • Cubeにコンポーネントを設定する。 ◦ Hierarchy -> Cubeを選択 ◦ Inspector -> Add Commponent ▪ RigidBodyとBoxColliderをアタッチ
27. T04. 衝突した際に処理を行う • Assets/Tasks/T04/Cube.csにOnCollisionEnter実装し、 Cubeオブジェクトアタッチしてください。 • 実行するとCubeが床に接触した際に Consoleに「 Cube：ヒットしました 」の文字が表示される • OnCollisionEnterでは接触したオブジェクトの情報が引数の Collision型で受け取れるため、 「特定の対象にヒットした場合はこの処理をする」等のコードを書くことができる。 void OnCollisionEnter(Collision collision) { Debug.Log("Cube：ヒットしました"); }
28. T04. 見かけ上は接触しているけど、衝突させずに処理を行いたい • Sphereにコンポーネントを設定する。 ◦ Hierarchy -> Sphereを選択 ◦ Inspector -> Add Commponent ▪ RigidBodyとSphereColliderをアタッチ • 衝突させたくないオブジェクトの Colliderコンポーネントの「IsTrigger」にチェックを入れる。 • ここにチェックを入れる事で、物理演算を使った衝突が行われない状態になります。 • このまま実行するとオブジェクトは床をすり抜けるはずです。
29. T04. 見かけ上は接触しているけど、衝突させずに処理を行いたい • 「IsTrigger」にチェックを入れている状態で接触判定を行う。 • Assets/Tasks/T04/Sphere.csにOnTriggerStay実装し、 Sphereオブジェクトアタッチしてください。 • 実行するとSphereが床と接触している間、 ConsoleにSphere：「ヒットしていますが、すり抜けます。」の文字が表示される • OnTriggerStayでも衝突したオブジェクトの情報が引数の Collision型で受け取れる void OnTriggerStay(Collider collider) { Debug.Log("Sphere：「ヒットしていますが、すり抜けます。」 "); }
30. T05. コルーチン（Coroutine）
31. T05. コルーチン（Coroutine） • ゲーム開発において、◯秒後に処理 A、その後◯秒後に処理 Bなど 処理の完了や一定時間待って処理を行いたいことは多々あります。 ◦ 演出シーケンス ◦ 通信待ち..etc • また、処理を待っている間も一部の他の処理の実行を止めたくないなど、 非同期実装もしたくなります。 • Unityにおいて非同期実装を実現する手法の一つとして、 Coroutineがあります。 ◦ https://docs.unity3d.com/ja/2019.4/ScriptReference/Coroutine.html
32. T05. コルーチン（Coroutine） • Assets/Tasks/T05/Task_05.unityを開いて実行してみてください。 ◦ 簡単なCoroutine処理のサンプル。 ◦ Task_05ではクリックのたびにフェードインアニメーションが行われ、 画面が見えなくなったタイミングで Cubeを生成、 その後フェードアウトする処理。 • フェード処理の終了を待ってから Cubeの生成が行われている • 時間カウント表示は止まらずカウントされている
33. T05. コルーチン（Coroutine） • 「処理を途中で一旦切り上げ」「切り上げた箇所から再開する」ことができる。 ◦ 関数内部で状態を持てるため、 Updateで待機処理をするよりもシンプルに実装できる。 • Coroutineは非常にベーシックな機能で複雑な非同期制御には向かない。 ◦ Coroutine内の処理結果の値を返せないため、コールバックによる数珠つなぎな実装になりやすい。 ◦ 並列で実行し両方が終了したタイミングなど、複数のコルーチンを組み合わせた制御が難しい。 • Unity2018で.NET 4.xに対応し、C#のTask,async/await構文が使用できるようになった。 ◦ async/await構文 : 非同期処理を同期処理のような記法で扱える。処理の一時停止、再開など。 ◦ Task : async/awaitと組み合わせて使う。非同期で実行する処理。
34. ここまでがチュートリアル
35. これからが本編
36. • 本編に入る前に「Unityに触ってみて」どうでしたか？ • よく分からなかったなどあれば本編に入る前に気軽に聞いてください！ • また、Unityはゲームを作るために提供されている機能が説明しきれないほど豊富にあります。 興味持ってみたら公式チュートリアルを見てみるなどしてみてください！ Learn game development w/ Unity | Courses & tutorials in game design, VR, AR, & Real-time 3D | Unity Learn