ゲームツクール！第６回Unity×Unity-Chanで

アクションゲームを作ろう！

2014/05/22 FAGStudio 浅野

最初に

このスライドは

Unity情報番組「ゲームツクール！」第６回Unity×Unity-Chanでアクションゲームを作ろう！の資料です。

操作手順などはこちらを参考にしてください。・Youtube（録画分）http://bit.ly/GameTukuru・UStreamhttp://www.ustream.tv/channel/16059441/

FAGStudio　代表

浅野　祐一

自己紹介

FAG Studiohttp://fagstudio.com/

スマートフォン向けのゲームを作っています！鶏を愛してやまないゲームプログラマ！！

書籍の紹介

3/26に「Unity4スクリプト入門」を出版しました！！

既刊の「Unity4入門」と合わせて書店やAmazonなどで購入で

きます！！※画像クリックで紹介ページにジャンプします。

はじめに

本日は、アクションゲームで便利に使えるMecanimを機能を利用してアニメーションのタイミングに合わせたボイス再生や、当たり判定の操作を紹介します。

うまく活用するとスクリプトの量を減らす事ができます！！

本日の内容

1. Unity-Chanとは？2. Unity-ChanをUnityに取り込もう3. サンプルを確認してみよう4. ステージを作ろう5. アニメーションを追加しよう6. スライディングで壁の下を潜ろう7. ゴールを作ろう8. 動作にボイスを連動させよう

Unity-Chanとは？

公式：http://unity-chan.com/詳しくは公式をご覧下さい！！

ユニティちゃんをダウンロードしよう！

同意してダウンロード

ユニティちゃんをダウンロードしよう！

ユニティちゃんデータはUnityPackageで配布されています。

ユニティちゃんをインポートしよう

Unityを起動している状態で、PackageファイルをダブルクリックしてUnityに取り込みましょう。

Unityちゃんのサムネイルインパクトありますね！

ユニティちゃんの動きを見てみよう！

ProjectビューのAssets->UnityChan->ScenesにUnityちゃんのサンプルシーンがあるので

どんなものか試してみよう！

Unityちゃんのアニメーションを確認できます。

セットアップをしよう！

まず最初は、Hierarchyビューに最初から置いてあるMainCameraを削除してください。

セットアップをしよう！

続いて、ユニティちゃんをHierarchyビューに追加します。 Assets->UnityChan->Prefabs->for Locomotionにある

「UnityChan」と「MainCamera」をHierarchyビューの何も無いところにドラッグしてドロップします！

セットアップをしよう！

続いて、一つ上の階層(Assets->UnityChan->Prefabs)に含まれているユニティちゃん用のDirectional LightのPrefabをSceneに追加しましょう！

そうすることで見た目がいい感じになります。

AnimatorControllerを設定

Hierarchyビューに追加されたunitychanをクリックしてInspectorビューにあるAnimatorコンポーネントの

Controller項目の丸いアイコンをまずクリック

UnityChanLocomotionsを選択します。

床を作成しよう！

UnityChanには最初から重力が適用されているので床を設置しないと落下し続けてしまいます。

HierarchyビューのCreateからCubeを作成しましょう。

Name: FloorPostion: 「X, 0」「Y,-1」「Z,0」Rotation: 「X, 0」「Y,0」「Z,0」Scale: 「X, 100」「Y, 1」「Z, 100」

Unityちゃんを動かす

Unityちゃんを動かす事ができるようになりました。

矢印キーで動かせます。

ここからが本番！

今日作るもの

1. ステージ2. 障害物を潜れるスライディング3. 勝利ポーズ4. アニメーションに連動したボイス再生

まずサンプルスクリプトを見てみよう

・UnityChanControlScriptWithRgidBody.cs

１行１行、日本語のコメントがついている親切っぷりです！！

これだけでもかなり勉強になるかも

ステージを作ろう

HierachyビューのCreateからCubeを２つ作成してそれぞれを次のように設定します。

・BlockPosition 0, 1, 5 Scale: 5, 1, 1

・Goal Position 0, 0, 10 Scale: 3, 3, 3IsTrigger -> true

ステージを作ろう

資料では、見やすいように適当に作ったMaterialを各パーツに割り当てておきます。

この辺は任意で好きな色や絵を設定してください。

AnimatorControllerを編集

Assets->UnityChan->Animatorsフォルダの中にある

UnityChanLocomotions.controllerをダブルクリックでAnimatorビューを開きます。

AnimatorControllerを編集

Locomotionステートの上あたりに 「Sliding」「Win」の２つのStateを追加します。

AnimatorControllerを編集

追加したSlidingとWinそれぞれのInspectorビューのMotionにモーションデータを設定します。

Win -> WIN00 Sliding -> SLIDE00

AnimatorControllerを編集

続いて、AnimatorビューのParameterを２つ追加します。

一つ目、 Trigger型 “Sliding”二つ目、 Bool型 “Win”

AnimatorControllerを編集

SlidingとWinはLocomotionから双方向にTransitionを設定します。

AnimatorControllerを編集

LocomotionステートのInspectorビューのTransitionsのLocomotion -> Sliding　のConditionsにSlidingを設定します。

Locomotion -> Win　のConditionsには

Win : true を設定します。

AnimatorControllerを編集

WinステートのInspecotorビューのTransitionsも設定します。

・Win -> Locomotions　　Win : false

キャラクタースクリプトを作成しよう

Hierarchyビューのunitychanに、Inspectorビューの一番下にあるAddComponentから 「PlayerController」という名前のスクリプトを作成します。

LanguageはCSharpで作ります。

キャラクタースクリプトを作成しようスクリプト完成版はこちらから

Zキーを押したらSliding、OnGoalが呼ばれたらWinのParameterを変更するようにしています。

ゴールスクリプトを作成しよう

HierarchyビューのGoalを選択して

InspectorビューのAddComponentから Name : GoalLanguage : CSharpで新しいスクリプトを追加してください。

ゴールスクリプトを作成しよう

スクリプト完成版はこちらから

中身は、OnTriggerEnter関数を用意して

当たり領域に侵入した相手に対して”OnGoal”をSendMessageするだけです。

SendMessageは、相手に渡した名前の関数があればそれを呼んでくれる機能ですね。

ここまでで確認してみよう！

とりあえず、スライディングと勝利ポーズが確認できるようになりましたが、問題点が２つあります。

一つは、スライディングでBlockの下を潜れないのと、

もう一つは、ゴールについて勝利ポーズをしてもそのままのポーズで動けてしまう点です。

次にそれらを対応していきます。

スライディングの高さの調整

Assets->UnityChan->Animationsの中にある

unitychan_SLIDE00.fbxを選択してください！

スライディングの高さの調整

unitychan_SLIDE00.fbxのInspectorビューで

まずAnimationsタブを選択して、下の方にある

「Curves」の+ボタンクリックします。

スライディングの高さの調整

すると、アニメーションカーブというデータが一つ追加されます。

名前を「slidingHeight」と変えておいてください。

スライディングの高さの調整

Preview画面のシークバーをしゃがむタイミングまで再生してから・・・

スライディングの高さの調整

AnimationCurverの赤枠で囲った+アイコンをクリックします。するとKeyというパラメータが追加されます。

続けて、-1と数値を入力します。

最後にApplyをクリックしてください。

（忘れると追加が反映されません）

スライディングの高さの調整

同じ要領で、スライディングを終えて立つ直前にも-1のKeyを設定します。

追加したらApply ボタンを押してください。

スライディングの高さの調整

再びUnityChanLocomotionのAnimatorビューを開いて

Parametersに Float型のslidingHeightを追加してください。

先ほどSLIDE00に追加したAnimationCurveの名と同じ物がParamtersにある場合、アニメーション側でAnimationCurverで設定した通りにパラメータを変えてくれます。

スライディングの高さの調整

最後に、自動的に設定されるslidingHeightのパラメータを

スクリプト側で取得して、いい感じにユニティちゃんの

CapsuleColliderを調整してあげればBlockの下を潜れるようになります！！

「UnityChanControlScriptWithRigidbody」のスクリプトで

ジャンプした際にColliderを調整している箇所があるのでそちらを参考にしてみましょう。

スライディングの高さの調整

スクリプト全体はこちらから

ゴール後は動けないように対応

UnityChanを歩かせているコンポーネントは

unitychanに設定されている

「UnityChanControlScriptWithRigidbody」です。

これを無効にすれば、ユニティちゃんは歩けなくなります。

ゴール後は動けないように対応

スクリプト全体はこちらから

ユニティちゃんコンポーネントをGetして・・・

OnGoal関数内でコンポーネントを無効に設定

確認してみよう。

ボイスとアニメーションの連動

最後に、アニメーションと連動したボイス再生を実装します。

Assets->UnityChan->Animationsunitychan_SLIDE00.fbxを選択してください。

ボイスとアニメーションの連動

手順はAnimationCurveを追加したときと同じ要領です。

unitychan_SLIDE00.fbxのInspectorビューで

Animationsタグを選択して下の方にあるEventをクリックしてください。

するとイベントのタイムラインが表示されます。

ボイスとアニメーションの連動

ボイスを再生したいタイミングまでPreviewを再生しておいて、赤枠の+アイコンをクリックします。

すると、EventのKeyが追加されます。

ボイスとアニメーションの連動

こんなウインドウが開くので、Objectの赤枠で囲ったアイコンをクリックして・・・

univという名前のものがボイス素材なので好きな物を選んでください。

ボイスとアニメーションの連動

再び先ほどのWindowにもどり、Functionに「OnPlaySound」と設定してください。(Applyは忘れずに)これはSendMessageと同じような働きをしてくれます。

あとは、unitychanにAudioSourceを追加して

PlayerControllerにOnPlaySound関数を追加すればボイスが再生されるようになります。

ボイスを再生しよう

Hierarchyビューのunitychanを選択してから

InspectorビューのAddComponentをクリックして

Audio->AudioSourceを追加します。

これで音がユニティちゃんの位置からなるようになります。

ボイスを再生しよう

スクリプト全体はこちらから

最後に、OnPlaySound関数ををPlayerControllerに追加すれば声が再生されるようになります。

Eventを作成する際にObjectに設定したファイルが引数として入ってきますので、それをそのまま再生するだけでよいです。

ボイスを再生しよう

Winアニメーションも同じようにサウンドを設定してみましょう。

おまけ

やられアクションを入れてみる

AnimatorビューにDamageステートを追加して

MotionにはDAMAGE01を設定します。

やられアクションを入れてみる

ParametersにInt型の

Lifeを追加します。

すぐやられるようにLifeは１をセット

Locomotionステートと

Deadステートとの

Transitionを繋いで

Locomotion -> DeadのConditionsをLife Equals 0 にします。

やられアクションを入れてみる

スクリプト全体はこちらから

OnCollisionEnterで、”Enemy”タグを持った何かにぶつかればLifeパラメータを一つ減らすようにします。

やられアニメーションのトリミング

Assets->UnityChan->Animationsにある

unitychan_DAMAGE01.fbxを選択して

InspectorビューのAnimationsタブの中程にある

右側の画像のものを見つけてください。

やられアニメーションのトリミング

右側のつまみを操作して、Preview画面のキャラクターが倒れている状態になるようにします。

こうする事で、立ち上がるアニメーションは使わず、倒れたままを維持する事ができるようになります。

やられアニメーションのトリミング

Enemyタグを持つ何かにぶつかるとその場に倒れるようになりました。

今回はトリミングで立ち上がる部分をカットしていますが、このままだと倒れた状態で動きが停止してしまうので、気になるようでしたら倒れた状態のステートも用意してあげると良いでしょう。

終わり！