第６章 Unity３D

1

ドットイートGame

１節

2

土台作成

3

Unityを起動し、任意の名前をつけて

任意の格納フォルダを決めて CreateProjectボタンを押下

１節　土台となるステージ面を作成

Unityの起動画面が立ち上がることが

確認できる （レイアウトは2by3としています）

4

archフォルダをAssetsフォルダに

ドラッグ&ドロップして格納

１節　土台となるステージ面を作成

Hiararchyで３D Object

→Plane作成

5

Plane（平面)がSceneに作成

されたことが確認できる

１節　土台となるステージ面を作成

Project/Assets/arch/Materials/ Textures/FLOORを

HiararchyにあるPlaneに

ドラッグ&ドロップ

6

TextureがPlane（平面)

に適用されたことが 確認できる

１節　土台となるステージ面を作成

File→Save Sceneを選択

２節１項

7

モデル配置

8

任意の名前でSceneを保存

２節１項　モデルを配置

Sceneが保存できたことが確認できる

9

Knight_walkをSceneViewへ

ドラッグ&ドロップ

Sceneにモデルが表示される

ことを確認する

3DAssetsフォルダ,Scriptフォルダを

Assetsフォルダに

ドラッグ&ドロップして格納

２つのフォルダが格納できたことを 確認する

２節１項　モデルを配置

10

２節１項　モデルを配置

３Dモデル表示され

て少し動いた！

再生ボタンを選択

今回はこのアニメーションが適用されている

２節２項

11

モデル動作作成

12

作成されたスクリプトを Playerにリネーム

→ダブルクリック

Scriptフォルダを選択

→Create →C#Scriptを選択

２節２項　モデルに動きをつける

13

スクリプトを改良し、 移動できるようにしてみよう！

Scriptの中身が表示されることを

確認する

２節２項　モデルに動きをつける

14

knight_walkを選択

Playerスクリプトを

knight_walkへドラッグ&ドロップ

２節２項　モデルに動きをつける

Inspectorに

Playerスクリプトが

追加されていることを確認する

15

３Dモデル

が前に進んだー！

再生ボタンを選択

キーボードの上ボタンを押下する

２節２項　モデルに動きをつける

16

作成されたスクリプトを更に改良し、 上下左右に動くようにしてみましょう！！！ さらにわかる人は、向きも変えてみよう！

２節２項　モデルに動きをつける

ここがポイント！！

17

上下左右に移動し

て向きも変ったー！

再生ボタンを選択

キーボードの上下左右ボタンを押下する

２節２項　モデルに動きをつける

２節３項

18

モデルアニメーション設定

19

現在はこの歩くアニメーションが 適用されている

２節３項　モデルアニメーションを適用する

先ほどのPlayer.csのスクリプトを

改良し、Take 001のアニメーションを

操作してみましょう！ 左記は上ボタンのみなので、下右左も 同様にアニメーションを適用しよう！

こちらにチェックが入っていることで 再生時に自動で１度アニメーションが 再生される

20

アニメーション付きの

動きになったー！

再生ボタンを選択

キーボードの上下左右ボタンを押下する

２節３項　モデルアニメーションを適用する

２節４項

21

モデル音設定

22

２節４項　モデルに足音をつけてみる

knight_walkを選択する

AudioフォルダをAssetsフォルダに

ドラッグ&ドロップして格納

Audioフォルダが格納できたことを

確認する

23

２節４項　モデルに足音をつけてみる

Audio Sourseが

追加されたことが 確認できる

Add Component →Audio Audio Sourceを追加

24

２節４項　モデルに足音をつけてみる

Player.csを上記の箇所を追加する。

２節４項　モデルに足音をつけてみる

◯を押下し、

Inspectorを確認するとスクリプトの中に

追加したAudio Clipが追加されていること

が確認できる

dun_stepを選択するとdun_stepが

設定されることが確認できる

26

足音がついたー！

再生ボタンを選択

キーボードの上ボタンを押下する

２節４項　モデルに足音をつけてみる

27

２節４項　モデルに足音をつけてみる

下、右、左を押した時にも同じように音を適用させたいので、 同じコードを追加することになるが、 コードの可読性を高める為に上記のような関数にしておく。

先ほどの上を押した際のコードも上記の関数に変更し、 下、右、左を押した時にも同じように関数を追加する。

28

上下左右の移動にも

足音がついたー！

再生ボタンを選択

キーボードの上下左右ボタンを押下する

２節４項　モデルに足音をつけてみる

２節５項

29

カメラ追従

２節５項　モデルにカメラを追従させよう

スクリプトを左記のように 改修する

Scriptフォルダ内で

Create →C#Script

作成したScriptを

CameraTrackingにリネーム

２節５項　モデルにカメラを追従させよう

CameraTrakingスクリプトを

Main Cameraへ

ドラッグ&ドロップ

Main CameraのInspectorを見ると

スクリプトが追加されていることが 確認できる。

◯を押下し、 knigth_walkを選択する

２節５項　モデルにカメラを追従させよう

knight_walkが追加されていることが

確認できる

Positionを左記のように変更する

33

カメラが追従されたー

！

再生ボタンを選択

キーボードの上下左右ボタンを押下する

２節５項　モデルにカメラを追従させよう

３節１項

34

ステージ配置

３節１項　ステージを作ろう

右クリックから →Create Empty

Blockにリネームする

ProjectViewの3DAssetsから

blockを選択し、Sceneへドラッグ&ドロップ

３節１項　ステージを作ろう

SceneへBlockが配置されたことが

確認できる

Hierarcyのblockを

Blockの配下へ移動

Blockの子階層に

blockが配置される

ことが確認できる

３節１項　ステージを作ろう

Planeを選択

地面が少し狭いので左記ぐらいの サイズにして広くする

Planeのサイズが広く

なったことが確認できる

38

あれ？blockにすり抜

けている！？

再生ボタンを選択

キャラクターを動かしてみる

３節１項　ステージを作ろう

物体の当たり判定にはCompornentを追加してやる必要がある

３節１項　ステージを作ろうまずはキャラクターに物理計算をさせる componentを追加する

knight_walkを選択後、

Inspectorから

AddComponent →physics →Rigidbodyを選択する

Rigidbody が追加されたことが

確認できる

物理演算で回転しないように Freeze Rotationのx,y,zにチェックを入れる

３節１項　ステージを作ろう続いて当たり判定をさせる

knight_walkを選択後、

Inspectorから

AddComponent →physics →CapsuleColliderを選択する

Capsule Colliderが追加されたことが

確認できる

３節１項　ステージを作ろう

続いてblockに物理計算をさせる

componentを追加する

blockを選択後、

Inspectorから

AddComponent →physics →Rigidbodyを選択する

Rigidbody が追加されたことが

確認できる

物理演算で移動と回転しないように Freeze Positionのx,zにチェックを入れる

Freeze Rotationのx,y,zにチェックを入れる

３節１項　ステージを作ろう続いて当たり判定をさせる

blockを選択後、

Inspectorから

AddComponent →physics →BoxColliderを選択する

Box Colliderが追加されたことが

確認できる

43

今度はしっかりと衝突

判定をしてくれた！

再生ボタンを選択

キャラクターを動かしてみる

３節１項　ステージを作ろう

３節１項　ステージを作ろう

続いてタグをつけておく

knight_walkを選択後、

Tagを選択する

Playerを選択

Tagにblockが設定されていること

が確認できる

３節１項　ステージを作ろう続いてタグをつけておく

blockを選択後、

Tagを選択する

Add Tagを選択

➕ボタンを押下後

Tag０にblockと入力

３節１項　ステージを作ろう

もう一度 blockを選択後、

Tagを選択する

先ほど追加したblockを選択

Tagにblockが設定されていること

が確認できる

３節１項　ステージを作ろう

blockを選択する

５個複製する （ctr + D）

複製しただけでは同じ位置なので 位置をずらして調整する

３節１項　ステージを作ろう

Blockを選択する

Staticにチェックをつける

ダイアログが表示されたら Yes,change childrenを押下する

３節１項　ステージを作ろう

Blockを選択する

５個複製する （ctr + D）

Blockの位置を少しずらしてみよう！

すると６個の塊が複製されてまとめて 移動できることが確認できる

３節１項　ステージを作ろう

Knight_walkが通ることを考えて作成してみよう！

やり直しはできるので、オリジナルの迷路をつくってみよう！

ブロックを移動させて 自分なりの迷路をつくってみよう！

先ほどの複製を繰り返して実施してみよう！

51

行き止まりなどがない

かを動かしながら確認

してみよう！

再生ボタンを選択

キャラクターを動かしてみる

３節１項　ステージを作ろう

３節２項

52

ステージライト設定

３節２項　ライトの設定を変えよう

右記のようにTransformのposition,Rotationと

LightのRange,SpotAngleを調整し、自分の迷路に合う

ライト調整をしよう

Directional Lightを選択

Typeを選択

Spotを選択

３節２項　ライトの設定を変えよう

例としてはこのような暗さと範囲になる

Planeも調整したりして、見える範囲の調整なども行ってみよう！

Spotを選択

３節３項

55

ステージにダイヤ設置

GUITextureフォルダをAssetsへ

ドラッグ&ドロップ

GUITexture →jewelryを選択

Texture　Typeを選択

３節３項　ダイヤを設置しよう

３節３項　ダイヤを設置しよう

Editor　Gui and Legacy GUIを

選択

Applyを選択

背景が透過されたことが確認できる

Hierarchyより右クリックにて

Particle Systemを作成

Sceneを見ると

パーティクル（エフェクト的な） が作成されていることが確認できる

３節３項　ダイヤを設置しよう

particle　Systemのパラメータを左記

のように設定する

Collisionにチェックを入れて左記の

ように設定する

３節３項　ダイヤを設置しよう

RendererのMaterialの◯ボタンをクリック

jewelryの背景透過されたものを選択する

３節３項　ダイヤを設置しよう

61

再生ボタンを選択

キャラクターを動かしてみる

３節１項　ステージを作ろう３節３項　ダイヤを設置しよう

ダイヤが設置された！

particle　Systemを選択し、Add Tagを選択

➕ボタンを押下し、jewelryを追加

３節３項　ダイヤを設置しよう

タグの中からjewelryを追加

particle　Systemを複製する

あとは画面の中で位置を調整する

３節３項　ダイヤを設置しよう

Playerに触れた時にダイヤを削除したいので、

PlayerScriptを選択し、改修する

スクリプトの最下行にこのスクリプトを追加する

３節３項　ダイヤを設置しよう

65

再生ボタンを選択

キャラクターを動かしてダイヤに触れてみる

３節１項　ステージを作ろう３節３項　ダイヤを設置しよう

ダイヤに触れるとダイ

ヤが削除された！

ダイヤに触れた時に音を追加する為に Playerスクリプトを改修する

playerスクリプトにjewelryが追加されたら

dun_getGemを設定する

３節３項　ダイヤを設置しよう

67

再生ボタンを選択

キャラクターを動かしてダイヤに触れてみる

３節１項　ステージを作ろう３節３項　ダイヤを設置しよう

ダイヤに触れるとダイ

ヤが音が追加された！

４節１項

68

スコアの設定

HierarchyよりUI

→Textを選択

InspectorよりTextの

パラメータを変更する

４節１項　スコアを設定しよう

Transformより位置を調整し、

画面の中央上に配置しよう

４節１項　スコアを設定しよう

Scriptフォルダに

Create →C#Script ScoreAddスクリプトを作成

４節１項　スコアを設定しよう

スクリプトを上記のように改修する

ScoreAddをTextに

ドラッグ&ドロップ

４節１項　スコアを設定しよう

Inspectorに

ScoreAddが追加されたことが

確認できる

73

再生ボタンを選択

４節１項　スコアを設定しよう

Scoreが表示された！

さらにPlayerスクリプトを改修して、

ダイヤに触れたらScoreを加算する

４節１項　スコアを設定しよう

75

再生ボタンを選択

４節１項　スコアを設定しよう

Scoreが加算された！

キャラクターを動かしてダイヤに触れてみる

５節１項

76

敵キャラクター配置

５節１項　敵キャラクターを配置する

ghost_idleが配置されたことが確認できる

ghost_idleをSceneへドラッグ&ドロップ

78

ゴーストが配置されて

、

少しアニメーションさ

れた！

再生ボタンを選択

５節１項　敵キャラクターを配置する

５節２項

79

敵キャラクター アニメーション設定

５節２項　敵キャラクターのアニメーションを繰り返す

Take 001というアニメーションが

設定されていることが確認できる

Take 001をダブルクリック

ghost_idleを選択する

Take 001というアニメーションの

ディレクトリが確認できる

確認したディレクトリ上で Take 001をクリック

Take 001というアニメーションの

設定内容が確認できる

InspectorからEditをクリック

Add Loop Frameにチェックを入れる

Wrap ModeをLoopに変更

Applyを押下する

５節２項　敵キャラクターのアニメーションを繰り返す

82

ゴーストのアニメーシ

ョン

が繰り返しになった！

再生ボタンを選択

５節２項　敵キャラクターのアニメーションを繰り返す

５節３項

83

敵キャラクター AI設定

５節３項　敵キャラクターのＡＩを設定する

ghost_idleを選択

→AddComponent →Navigation →NavMeshAgentを選択

NavMeshAgentが追加されたことが

確認できる

５節３項　敵キャラクターのＡＩを設定する

Planeを選択し、

InspectorでStaticにチェックをつける

Window →Navigationを選択

Navigationタブを選択

→Bakeタブ

Bakeボタンを押下

５節３項　敵キャラクターのＡＩを設定する

これで敵キャラクターの 移動ルート（緑色箇所） が確認できる ルートが途切れている 箇所があれば幅を調整 しよう

Scriptフォルダに

Create →C#Script Enemyスクリプトを作成

５節３項　敵キャラクターのＡＩを設定する

Enemyスクリプトを

左記のように改修する

Enemyスクリプトをghost_idle

ドラッグ&ドロップ

ghost_idleのEnemyスクリプトの

Targetに◯ボタンから

knight_walkを追加

88

ゴーストが

追いかけてくるーーー

！

再生ボタンを選択

５節３項　敵キャラクターのＡＩを設定する

キャラクターを動かしてみる

５節４項

89

敵キャラクター の当たりイベント

５節４項　敵キャラクターが当たった時のイベント作成

ghost_idlを選択

AddComponent →physics →CapsuleColliderを選択

追加されたCapsuleColliderの

IsTriggerにチェックを入れる

５節４項　敵キャラクターが当たった時のイベント作成

ghost_idlを選択

Tagを選択し

Add Tag

➕ボタンからenemyを追加

ghost_idlを選択

Tagを選択し

enemyを選択

５節４項　敵キャラクターが当たった時のイベント作成

Playerスクリプトを改修して

敵キャラクターが衝突した時のイベントを追加

一番下の行に左記を追加

playerスクリプトのEnemy_seに

◯ボタンを押下して dun_enemyAttackを追加

93

ゴーストの声が鳴らさ

れた！

再生ボタンを選択

５節３項　敵キャラクターのＡＩを設定する

ゴーストに当たってみる