Unityを使ったゲーム開発を体験しよう学生のためのUnity勉強会

自己紹介✤ 和泉 信生 (いずみ しのぶ)!

✤ 崇城大学 情報学部 情報学科 助教!

✤ izumi@cis.sojo-u.ac.jp　!

✤ @shinobu_shiva!

✤ http://www.cis.sojo-u.ac.jp/~izumi

とよすすいぞくかんhttp://toyosui.jp/

CUBELE+https://itunes.apple.com/jp/app/cubele+/id417145026

熊本Apps!熊本からデジタルコンテンツを世界へ

https://www.facebook.com/kumamotoapps

・コンシューマ向けサービスの構築に興味のある

・学生、社会人、企業が集まり、

・知識・ノウハウを共有しながら、

・世界のユーザーに利用されるモノをリリースしていく、

・「地域コミュニティブランド」

熊本Apps!https://www.facebook.com/kumamotoapps

著書の紹介

http://www.amazon.co.jp/dp/4877832742

第１部 Unityを触ってみる中高生のためのUnity勉強会

第１部 Unityを触ってみる

✤ 第１部Unityの基本的な使い方や各部分の名称を覚えるために、

Unityを触りながら3D世界を操作してみます

http://unity3d.com/

http://unity3d.com/japan/

Unityとは？

✤ 3D/2Dゲームを作るための統合開発環境及びゲームエンジン!

✤ Windows, Mac, ウェブブラウザ で動作するゲームを作成できるiPhone, Android, Xbox 360, PS3もサポート(さらにサポート拡大中)!

✤ ゲーム開発の大衆化を目指し、ヨーロッパを中心に多くのユーザを獲得!

✤ 誰でも無料で使える(プロライセンス限定の機能が少しある)

今日の資料

✤ 資料https://drive.google.com/file/d/0By-brejWDbtQeFZoTVJjeTVzRGs/edit?usp=sharing

✤ プロジェクトファイルhttps://drive.google.com/file/d/0By-brejWDbtQaEtjdWdvR2ZkSm8/edit?usp=sharing

とりあえず開いてみよう！

c:¥ユーザー¥パブリック¥パブリックのドキュメント¥Unity Projects¥AngryBots¥Assets¥AngryBots.unity

起動！

プレイしてみよう

w, a, s, d (カーソル)＝移動 マウス(プレス) = 視点移動(発砲)

いろいろな機能(Windowsは位置が違う)

3Dの作業を行うビュー

ゲーム実行時の画面

シーン中のオブジェクト

プロジェクトのアセット

オブジェクトやアセットの設定

各部名称 メニュー

シーンビュー

ゲームビュー

ヒエラルキービュープロジェクトビュー

インスペクタ

いろいろな機能(Windowsは位置が違う)

3Dの作業を行うビュー

ゲーム実行時の画面

シーン中のオブジェクト

プロジェクトのアセット

オブジェクトやアセットの設定

各部名称

メニュー

シーンビュー

ゲームビュー

ヒエラルキービュー

プロジェクトビュー

インスペクタ

ギズモシーンビューで見ている向きを表す

クリックするとその方向から見ることが出来る

移動ツール (画面左上)

✤ 選択した物体やビューの移動方法を選択

ビュー移動 物体移動 物体回転 物体拡縮{シーンビューの中でクリックすると物体が選択できる

プレイツール (画面中央)

✤ ゲームのプレイ、停止、一時停止、ステップ実行

プレイ 一時停止 ステップ実行

青くなっている状態でゲーム実行中

プレイをもう一度クリックすると停止

カメラの移動

✤ Altキーを押しながら!

✤ マウス左ボタン　→　回転!

✤ マウス中ボタン　→　移動!

✤ マウス右ボタン　→　拡大縮小 (スクロールでもOK)!

✤ 何かを選択して f キー　→　物体に合わせた位置に移動!

✤ スペースキー　→　マウスが指している画面をフルスクリーン化

操作に慣れよう！

初めてのゲーム作成

✤ 新規プロジェクトの作成✤ メニューから File → New Project... を選択

初めてのゲーム作成

✤ プロジェクトを作成する位置を選び、名前をつけてCreate Project✤ (例) C:¥Documents and Settings¥Izumiken¥My DocumenHelloUnity

灰色の部分はそれぞれ異なる

全角文字は使わないで！

初期画面WindowsとMacではメニューの位置が少し違う

オブジェクトを作る✤ メニューから GameObject → Create Other → Cube を選択

Cubeが作成された

オブジェクトを作る✤ メニューから GameObject → Create Other → Plane を選択

Planeが作成された

オブジェクトを動かす✤ Cubeを選択　ヒエラルキービューから選択　／　シーンビューでクリック

✤ 移動ツールから移動を選択

✤ 緑(上向き)のハンドルをドラッグして上に移動

ゲームビューには何も表示されていない

ショートカット q,w,e,r

カメラの位置と向きを調節✤ Main Cameraを選択 シーンビューでカメラギズモをクリック　／　ヒエラルキービューから

✤ 上手くカメラを移動してください

暗い、、、

ライトの追加✤ メニューから GameObject → Create Other → Point Light を選択

インスペクタ

✤ 選択しているオブジェクトの設定

Point Lightを選択した状態

Color - 色

Intensity - 光の強さ

Range - 光の届く距離

試しに赤く強くしてみた

プレイをクリックしてみよう、、、特に変化なし

剛体にしてみよう✤ RigidBody = 剛体 = 重力に作用する物体

✤ Cubeを選択✤ メニューから Component → Physics → Rigidbody を選択

Rigidbodyが追加された

プレイをクリックすると、、、

落ちた？

シーンの保存✤ メニューから File → Save Scene を選択

✤ 名前を入力して Saveをクリック

演習✤ プレイすると球体が３つ地面に落ちて転がっていくゲームを作成してください!

!

✤ Sphereを３つ作成し、Rigidbodyにしてください!

✤ Planeを傾けてください

(ヒント)

プロジェクトとシーン✤ プロジェクト

Unityにおけるゲーム開発の単位全ての部品はプロジェクト内に保存する１つのフォルダーとして管理!

✤ シーンゲームの１つのステージやスタートメニューなど

注意！

Unityが扱うファイルをUnityの外で移動しちゃダメ！

オブジェクトを作る✤ メニューから GameObject → Create Other → Cube を選択

Cubeが作成された

Hierarchy (階層)ビュー

✤ ゲーム中に存在する全ての GameObject が表示されている!

✤ 初期状態ではMain Cameraだけが存在する!

✤ Cubeやカメラ、ライトなど全てGameObject

Inspector(インスペクタ)ビュー

✤ 選択したGameObjectの属性を表示!

✤ 複数のComponentを保持!

✤ 編集可能

UnityのGameObject

✤ GameObjectは基本情報と複数のComponentを持っている!

✤ どんなComponentを持つかでGameObjectの機能が決まる

GameObject

(基本属性) 名前、レイヤ、タグ等

Transform : 位置、回転、サイズ

MeshRenderer : 描画方法

MeshFilter : ３次元の形状

BoxCollider : 箱型の衝突判定

Transformは全てのGameObjectに必ず存在する

Componentの値設定

✤ インスペクタで値を変更することが出来る!

✤ TransformコンポーネントのPosition値を変更してみよう!

!

✤ シーンビューでの変更がインスペクタに反映される!

✤ Cubeをシーンビューで移動や回転、拡大するとTransformコンポーネントの値が変化することを確認しよう

Cubeを原点に移動

✤ Cubeをヒエラルキービューで選択して、インスペクタからTransformコンポーネントのPosition値を原点(0, 0, 0)に設定しよう

第２部 Unityで2Dゲームをつくろう！情報学部 情報学科 和泉 信生

中高生のためのUnity勉強会

第２部 Unityで2Dゲームをつくろう！

✤ 第２部ではUnityで2Dゲームを作成しながら基本的な操作や使い方、

簡単なプログラムを書くことで様々な機能が追加できることを知ってもらいます

ハングリーキャット

ネコを飛ばしてネズミにぶつけて消すゲーム

プロジェクトファイルのダウンロード

✤ URL ～ からダウンロードして解凍!

✤ 解凍日本語が入っていないフォルダの場所においてください

とりあえず遊んでみよう

メニューから

File → Open Project… を選択HungryCatを選択して

Open Project をクリック

プロジェクトが開いた

完成番のシーンを開く

プロジェクトビューでGame-Compをダブルクリック

Maximize on Play (プレイ時に最大化)

Maximize on Play (プレイ時に最大化)を有効化しておく

プレイ！

① マウスで左クリックして引っ張る!② 離すとネコが飛び出す

柱や的に命中すると得点を獲得全部のネズミを倒したらゲームクリア

ゲームクリア！

自分で作ってみる！

プロジェクトビューでGameをダブルクリック

何も配置されていないシーンが表示された

このプロジェクトの使い方１この２つ（中身も）は変更しない

このプロジェクトの使い方２

ゲームに使う部品（プレハブ）

このプロジェクトの使い方３

スクリプト（プログラム）後で中身を記述して使います

このプロジェクトの使い方４

音声ファイル（効果音に使います）

猫シューターを配置しよう！

Cat Shooter プレハブをドラッグして配置

プレハブ = ゲーム内で使うものを再利用できるようにまとめたもの

猫シューターが配置できた！

プレイすると猫が飛ばせます（倒す敵がいないけど、、、）

プレイをもう一度クリックして止めましょう（ボタンが灰色になるのを確認）

木（障害物）を置いてみる

Tree プレハブをドラッグして配置

移動や回転をさせてステージを作る青い丸４つで囲まれた

枠の中をクリックすると移動します

青い丸のカドの少し外側をクリックすると回転します（カーソルが変化）

ステージ完成！プレイして動作確認してみよう

柱を壊すと得点が！

敵キャラクターを配置する

Mouse プレハブをドラッグして配置

Mouseプレハブ

Mouse Behaviorコンポーネント!このコンポーネント（スクリプト）に

猫があたった時の処理を記述して行きます。

インスペクターを見てみる

プロジェクトビューでMouse Behaviorをダブルクリック

エディタが起動

スクリプト（プログラム）

✤ ゲーム内での様々な処理はスクリプトを記述することで実現できます!

✤ 得点、ダメージ、音を鳴らす、猫を打ち出す、etc…!

✤ 今日は猫がネズミにあたった時の処理を記述します!

✤ UnityではC#, Javascript, Boo(Python) から言語を選んで使えます!

✤ この講義ではC#で記述します

スクリプト（プログラム）

この部分に処理を書いていきます

猫があたったらネズミが消えるようにするpublic void GetDamage(){ !

Destroy (gameObject); !

}

なぜここに書くの？猫が当たるとGetDamageの中（波括弧が開いて閉じる間）の処理が実行されるように、事前にプログラムを組んでいるからです

メソッド

Destroy (gameObject);スクリプト内では様々な命令を記述することで処理をさせます

ここではDestroyという命令を使っています

このような命令のことをメソッドと呼びます

引数（ひきすう）

Destroy (gameObject);メソッドにはその命令を実行するのに必要なモノや情報が渡される場合があります（渡されない場合もあります）

このようなものを引数と呼びます!

引数は（丸括弧）の間に書きます!

複数ある場合は ,（カンマ）で区切って記述します

Destroyメソッド

Destroy (gameObject);Destroyメソッドは引数で受け取ったものを破棄する命令ですここで渡している gameObject は

このスクリプトが付いているゲーム内のオブジェクトを指し示しています

最後にある ; は何？

Destroy (gameObject);

最後にある ; (セミコロン)は一つの命令の終わりを表す区切りです

スクリプトの保存スクリプトを書いたら忘れずに保存しましょう！

Ctrl + s (Ctrlキーを押しながらsを押す)で保存できます

未保存 保存済み

Unityにもどる

右下に丸いインジケーターが回っているときはコンパイル（プログラムの解析）を行っているので

少し待ちましょう

プログラムが間違えているとき

プログラムを間違えると(文法間違えなど)

左下に赤い字で間違いが指摘されます

メッセージを読んでプログラムを修正しましょう

プレイしてみましょう！

猫がネズミに当たると消えた？

ネズミを倒すと得点画面

敵を倒したらポイントを獲得しよう！

public void GetDamage(){ ! Destroy (gameObject);

Point (100); !}

Pointメソッドに100を引数として渡す!(＊Pointメソッドはすでに提供してあります)

プレイしてみましょう！

猫がネズミに当たると得点獲得！

敵を倒したら音を鳴らそう！

public class MouseBehavior: MonoBehaviour { !

public AudioClip destroySound; ! public void GetDamage(){ ! Destroy (gameObject); Point (100); ! } 鳴らす音を持っておく変数を作成

変数（へんすう）

public AudioClip destroySound;

destroySound

プログラム中で値や参照などを保持する名前のついた箱のようなもの

変数には型が設定される

型によって変数に入れることができるものの種類が限定される

public AudioClip destroySound;

型 変数名公開範囲

変数（へんすう）

公開範囲はここでは難しいので詳しい説明を省略しますが

変数にpublicとつけておくと

Unityのインスペクターで値を設定できる

ようになります

インスペクターを確認

Mouseを選択

作成した変数が表示された

音声ファイルを変数に設定

Destroy (音声ファイル)をドラッグして設定

音を鳴らすメソッドを記述public AudioClip destroySound; !public void GetDamage(){ ! AudioSource.PlayClipAtPoint(destroySound, Vector3.zero); Destroy (gameObject); Point (100); !}

AudioSource が持っている PlayClipAtPoint というメソッドに鳴らしたい音が入っている destroySound 変数とVector3.zero （３次元空間の原点を表す値）を引数として渡す

難しいので今はなんとなくで、、、

プレイしてみましょう！

ネズミを倒すと音がなる！

大きいネズミをおいてみる

BigMouseにもDestroy音声を設定

大きいネズミは２回当たらないとたおせないようにしたい！

ネズミに体力をもたせよう！

public class MouseBehavior: MonoBehaviour { ! public AudioClip destroySound; !

public int vital = 1; ! public void GetDamage(){

体力を持っておくための変数を作成（初期の値を１にしておく）

変数への値の代入（だいにゅう）

vital = 1;

vital

変数に値を入れることを代入するという

スクリプト中の = は

右側の値を左側に代入することを表す

1

あたったら１減らす! public void GetDamage(){ !

vital = vital - 1; ! AudioSource.PlayClipAtPoint(destroySound, Vector3.zero); Destroy (gameObject); Point (100); ! }

変数から１減らすとは？

vital = vital - 1;

vital

1

取り出して 1 を引いて また 入れる

1 - 1 → 0

vital

0

条件分岐

条件を満たしているか満たしていないかで処理をわける

vitalの値が 0 より大きければ　→　死なない

vitalの値が 0 以下ならば　→　死ぬ

if 文による条件分岐

public void GetDamage(){ vital = vital - 1; !

if(vital <= 0){ ! AudioSource.PlayClipAtPoint(destroySound, Vector3.zero); Destroy (gameObject); Point (100);

} }

if(vital <= 0) { 　　//条件を満たすとこの部分に書いてある処理が実行される

}

if 文による条件分岐

vitalの値が ０より小さいか０の時、波括弧で囲まれた部分の処理を実行する <= 小さいか同じ

>= 大きいか同じ> 大きい< 小さい== 同じ!= 違う

左辺と右辺をくらべて

BigMouse の vital を２に設定

２に設定Mouseのvitalは１になっていることを確認しておきましょう

BigMouse の得点を多くしたい！public class MouseBehavior: MonoBehaviour { ! public AudioClip destroySound; ! public int vital = 1;

public int point = 100; ! public void GetDamage(){ vital = vital - 1; ! if(vital <= 0){ ! AudioSource.PlayClipAtPoint(destroySound, Vector3.zero); Destroy (gameObject);

Point ( point ); } }

得点を持っておく変数を作成

変数の値で得点を追加

pointの値が設定できるようになった

Point の値を 1000に設定

動作確認！

大きいネズミを倒したら1000ポイント！

倒せなかった時の処理倒せなかった時にも得点を獲得したり音を鳴らしたりしたい！

if(vital <= 0){ ! AudioSource.PlayClipAtPoint(destroySound, Vector3.zero); Destroy (gameObject); Point (point);

} else { Point (point / 10); }elseの内部には if の条件が成り立たなかった時に実行する処理を記述する

倒せなくても当たったら10分の１のポイントを獲得

! public AudioClip destroySound;

public AudioClip crashSound; ! public int vital = 1; public int point = 100; ! public void GetDamage(){ vital = vital - 1; ! if(vital <= 0){ ! AudioSource.PlayClipAtPoint(destroySound, Vector3.zero); Destroy (gameObject); Point (point); } else { Point (point / 10); AudioSource.PlayClipAtPoint(crashSound, Vector3.zero); } }

音を持っておく変数

音の再生

BigMouseとMouseに音を設定

音を設定

完成！ 自由にステージを作ってみましょう！

自分で書いた絵を使ってみよう！

http://pixlr.com/editor/

Photoshopなど背景が透明な絵をかけるソフトであれば何でもいいです

今日はブラウザ上で絵がかけるサービスを使ってやってみます

「新しい画像を作成」をクリック

絵を描く

「透明」にチェックしてOKをクリック

適当に絵を描く

絵を保存

メニューから ファイル→保存

フォーマットで PNGを選択

OKをクリック

絵を保存

デスクトップなど分かりやすいところに保存（ファイル名はアルファベットで）

ファイルをインポート

Unityのプロジェクトビューにファイルをドロップ

ファイルのインポート設定

① 取り込んだファイルを選択

② Sprite Mode で Multipleを選択

③ Sprite Editorをクリック

スプライトの設定

使いたい範囲を囲んで Trim をクリック

スプライトの保存

Windowを閉じようとすると

適用するか聞かれるので

Applyをクリックして適用

スプライトをシーンに入れて位置と大きさを調整

敵として使うための設定

① 名前をMyEnemyにする（自由に名づけてよい）② Tag で Wall を選択

③ Sorting Layer で Character を選択

必要なコンポーネントを付加

メニューから

Component → Physics 2D → Box Collider 2D

メニューから

Component → Physics 2D → Rigidbody 2D

１

Add Componentから

Enemy Behavior, Mouse Behaviorを追加

音やPoint, Vitalの値を設定

自作キャラが敵になった！

作った敵キャラをプレハブにするプレハブにすると再利用できるようになります

ドラッグ

あとは自由に！

グローバルゲームジャム2014

熊本会場に参加しませんか？

https://sites.google.com/site/ggjkumamoto2013/

質問はこちらまで

✤ 崇城大学情報学部和泉助教 の部屋(研究室)!

✤ izumi@cis.sojo-u.ac.jp　!

✤ @shinobu_shiva!

✤ http://www.cis.sojo-u.ac.jp/~izumi

mail address