Skip to content

Instantly share code, notes, and snippets.

@makoto-unity
Last active December 11, 2015 10:28
Show Gist options
  • Save makoto-unity/4586393 to your computer and use it in GitHub Desktop.
Save makoto-unity/4586393 to your computer and use it in GitHub Desktop.

Angry Chicken

完成プロジェクトの置き場 https://github.com/makoto-unity/angry-chicken

このドキュメント https://gist.github.com/4586393/

ドキュメントはこちら http://docs-jp.unity3d.com/

とりあえず出来上がりのゲームを見てみましょう。 まあ某怒りトリのゲームを作ります。

Editorの使い方を覚えましょう

環境を揃えましょう

  • 右端の項目を「2 by 3」に
  • Pivot、Globalに

地面

まず地面を作ります。

GameObject→Create Other→Cube

Hierarchy に「Cube」が追加されましたか?まずは名前を変更しましょう。選択して Inspector の一番上の項目を編集し、「Ground」としましょう。

位置が変なところにあると思うので、Inspector の TransformのPositionを(0,0,0)にします。 Inspectorは

そして適当な大きさにスケールします。Inspector の TransformのScaleを(100,1,100)とかにしておきましょうか。

ライト

暗いですね。明るくしましょう。ライトを作ります。

GameObject→Create Other→Directional Light

明るくなりましたね。

エディタの使い方

何はともあれ、Unityエディタの使い方に慣れていただきましょう。

Scene View

ゲームの世界を構築するビューです。 4つの操作を覚えてください。

  • 注目:「F」キーまたはダブルクリック
  • 注目点を中心に回転:Alt(Windows)/Option(Mac) +マウスの左ボタンのドラッグ
  • ズーム:マウスホイール/トラックパッドスクロール(または、Alt/Option+右ボタンのドラッグ)
  • 平行移動:マウスホイール(真ん中ボタン)ドラッグで平行移動(または、[Windows]Alt+Ctrl+右ボタンドラッグ、[Mac]option+command+右ボタンのドラッグ)

Game View

実際にゲームをプレイするビューです。iPhone用だったらここがiPhoneの画面になります。

Hierachy View

Scene Viewでのオブジェクト(UnityではGameObjectと言います)が列記されている画面です。

Project View

このゲームに含まれるファイルが閲覧できる場所です。WindowsのExplorerやMacのFinderと同じようなものです。

Inspector View

各GameObjectのパラメーターを見たり編集したりする場所です。Windowsで言うところの「プロパティ」みたいなものです。

とりあえず動かしてみましょう

カメラ

Hierarchy の Main Cameraを選択。これでカメラの調整をしていきましょう。 現状、3D空間の奥行きが認識出来る、「Perspective」(遠近法)によるカメラです。これはこれでいいのですが、今回は2Dゲームなので、遠近法はいりません。ですので、Inspector の Projection を 「Orthographic」(平行投影)に変更しましょう。何も映らなくなりましたね。 慌てないで、Position を (10,7,-100)に変更しましょう。そして、Size を 10ぐらいにしておきましょうか。 これで真横から見たカメラができました。

プレイヤーとターゲット

その後、プレイヤーのボールを作りましょう。

GameObject→Create Other→Sphere

今は素っ気ないですが、後で綺麗にしてゆくので慌てないでくださいね。 「Ground」と同様、こちらお「Player」にしてきましょうか。 場所はScene の矢印の上をドラッグして空中に置きましょう。

あと、到達するべきターゲットのボール。先ほどと同様に作って、こちらは「Target」としておきましょうか。 そしてこちらは地面のちょっと上におきましょうか。ターゲットなので、若干プレイヤーと離しておきましょう。

障害物

とりあえず、一個置きましょうか。

GameObject→Create Other→Cube

名前は「Box」にしておきましょう。

あ、そうそう、全てpositionのzはゼロにしてくださいね。 (少しずれちゃうと当たらなくなってしまうので)

ではいったんプレイ

・・・何もおきませんね。 物理挙動をオブジェクトに付けていないからです。

ではいったんプレイを止めて

*** 要注意!

ここでプレイを止めないで編集してしまうと、変更作業が「プレイ中」に起こったことと見なさます。そしてその後、プレイを止めると、編集作業が全てパーになります。

なので編集する際は必ず「プレイを止める」ことをお忘れなく!

で、今プレイ中かどうかを知る、Tipsをここだけに教えちゃいます。

これはかなりいいテクニックなので、やってみて下さい。

Unity→Preference

を選択して、Colorの項目の「Playmode tint」の色をお好きな色にして下さい。私はピンクにしています。

こうすると、プレイ中はピンクになるので、プレイ中かどうかが一目瞭然になるのです。

物理挙動

ではPlayerを選択して、Menuの

Components→Physics→ Rigid body

を選択すると、Playerに「Rigidbody」という機能が追加されました。Inspectorにありますよね?

その状態でもう一回プレイしてみましょう。

どうですか?プレイヤーは下に下がりましたか?

こうやって機能をオブジェクトに追加していくことが、Unityの基本的な作業となります。

では同様に Target、GroundにRigidbodyを追加しましょう。

ではもう一度プレイすると、やはり全部落ちてきましたよね?

物理属性

でもプレイヤーの弾は跳ねて欲しいですので、期待する動作ではないですね。

これは物理属性が設定されていないからです。

では物理属性を付けましょう。

時間があれば自分で作ってみましょう。Physicsで右クリックして、Create→Physics Materialを選択し、名前をBallにしておきましょうか。 パラメータをDynamic Friction:1 Static Friction:9.19 Bounciness:1 Friction Combine:Maximum Bounce Combine:Average

Player を選択し Inspector の Box Collider の Material を「Ball」にしましょう。これで跳ねる属性になりました。

BoxとTargetとGroundは「Wood」にしましょう。

そしてプレイすると..。プレイヤーだけ跳ねましたか?

2Dゲームにしましょう

でも実はこれだと、弾が奥とか手前とかに行ってしまうことがあるのですね。

2Dゲームっていうのはそういうことは普通ない訳ですから、それを抑制しないと行けない

というわけで、Physicsの Constrain の Freeze Position Z をチェック、Freeze Rotation X と Y をチェック

こうすると手前と向こうには行かなくなりました。

見栄えを良く

さあここまできました。ちょっとゲームっぽくなってきましたね。

でもなんか見栄えがよくないですよね。全然カワイくないですよね。

というわけで、ちょっときれいにしていきましょう。

画像の取得

ではどこからか画像を借りてきましょう。自分の書いたキャラクターとかがあればそれをお使いください。

はい、適当にトリの絵を持ってきました。

ではこれをテクスチャとして、オブジェクトのマテリアルに設定しましょう。

マテリアルとテクスチャ

はい、ここで「マテリアル」「テクスチャ」という言葉が出てきましたね。

マテリアルとは材質のことです。木の材質と金属の材質では違いますよね。そういった材質を決めるのがマテリアルです。では作ってみましょう。

Project ViewでAssets→Materialsを選択して、

Assets→Create→Material

で新しいマテリアルが作られました。名前も「PlayerMat」に変えましょうか。 あ、日本語の名前は作れないので注意して下さい。

はい、とりあえず、マテリアルはできましたね。

でも本当は画像を貼りたいわけです。さきほど持ってきた画像を。

それがテクスチャです。テクスチャとは貼る画像のことです。

テクスチャ(もってきた画像を)、いったんAssets/Materialsの中に入れましょうか。

これでこのテクスチャが、このプロジェクトでも使用可能になりました。

先ほどのPlayerMat マテリアルを選択してInspector の「None(Texture)」と書いてあるところ下の「Select」を押すとテクスチャ一覧が出てきます。これで先ほどの画像を選択します。

あと、Shaderを「Transparent/Cutout/VertexLit」にしてください。 (ここでは詳しくは触れません)

はい、マテリアルの準備ができました。

で、このマテリアルを選択して、テクスチャを適応したいオブジェクトにD&D(ドラッグアンドドロップ)すると、適応できます。

ここではPlayerに適応してみます。

どうでしょう。球にのっぺりと貼られましたか?

親子構造

でも今回は2Dゲームなので、コレジャナイんですよね。じゃあ一回アンドゥしましょう。通常のOSのアンドゥと同じです。

マテリアルが貼られていない状態に戻りましたか?

球に貼られると、のっぺり貼られてしまうので、四角に貼りましょう。それで衝突判定をナシにすればいいのです。

ではまず、Cubeを作ります。もう作り方はわかりますよね?

それでそのCubeに先ほどのマテリアルを設定しましょう。

はい、ちゃんとした絵が6面に表示されましたね。

しかし、これは元々は立方体なので、物理判定も立方体になってよろしくない。

ですので、表示はこちらの立方体を使って物理判定を球を使うようにしたい、ですね。

これを実現するには親子構造にすれば良いのです。

物理判定をする球(Player)を親、表示部分の立方体を子にします。

やり方は簡単で、子の方を親にしたいオブジェクトにD&Dします。

すると、Hierarchy で親子構造になったのが解るかと思います。なってますか?

そして、親子構造はできたのですが、今度は位置を合わせたいのです。子の方が今は全然位置がズレているので、それを(0,0,0)に戻します。

すると、はい、球の外側に立方体が来ましたか?

はい、これで親子構造の完成です。

ちょっと難しかったですかね?

まあ今は親子にしてると一緒に動いてくれるということだけ覚えておけばいいでしょう。

おっと、親の球の表示を切っておきましょう。renderを削除と。

それと子の立方体の物理判定部分も切っておきましょう。Box Collider を削除と。

では、同様にTargetもやってみましょう。

Asset Storeの活用

さあ、では、テクスチャとマテリアルの活用がわかったところで、ちょっと休憩しましょう。

モデルを作ったり、テクスチャを作ったりって、結構手間がかかりますよね。

立方体とか球とかはまだいいですけど、もっと複雑な形(例えばヒト)はやはりツールを使ってやっていかないとできません。

そこで、Unity Asset Store の出番です。

これは、世界中の人達が自分の作った Asset とよばれる Unityで活用するモノ を販売・公開しているのです。

Unity内から取得できます。

(時間があったらアカウント作ってもらう)

ログインすると、いろんなモノがあります。

今回は「Simple Box Pack」を使いましょう。

これをインポートすると。

適当に配置しましょう。

物理属性(rigidbodyをつけてPhysics Materialを設定して)

プレイしましょう。

ね、手軽でしょう?

ゲームルールを作って行きましょう

さて。このままではまだゲームとは呼べません。何もプレイヤーは入力できませんし、オブジェクトは何も反応しませんしね。

では、まずは、スクリプトを作ってみましょう。何か強く当たったら消える、という機能を作りましょう。

スクリプトの作成

Unityでは「機能」という単位でプログラムをしていくのが一般的です。(そういう意味ではオブジェクト指向ではありません)

フォルダ(Assets/Scripts)を作って

Assets→Create→Javascript (C#でも)

すると、テンプレートのスクリプトがとりあえず作られます。

その中に書いていけばいいのです。

じゃあ、HitExplosionとしましょうか。

そして、Inspector のOpenをクリックして、

function OnCollisionStay(col : Collision)
{
  Destroy(this.gameObject);
}

という文を書いていきましょう。これ関数名をスペルミスをすると動かなくなってしまうので、気をつけて下さいね。

ちょっと書くの面倒というひとは以下を参考にして下さい。

https://github.com/makoto-unity/angry-chicken

機能の付加

さあでは作ったスクリプト、つまり機能をGameObjectに付加してみましょう。

作ったスクリプト、つまりJavascriptですね。それを付加したい GameObject に D&Dします。

はい、できましたか? そうすると、Inspector上に「Hit explosion」という項目が出てきたと思います。 これでそういう機能を実装できました。

じゃあ一回プレイしてみましょう。

どうなりますか? たぶん、衝突したとたんに消えるのではないかなと思います。

もう一回プログラムをみて見ます。

function OnCollisionStay(col : Collision)
{
	Destroy(this.gameObject);
}

これはオブジェクトが衝突している際に呼ばれる関数を作ったところです。

つまりこれが呼ばれる時点で衝突しているということになりますね。

パラメータの追加

で、怒りトリは、衝突が大きい時に壊れる、というルールなので、今回もこれにならって

var limitVel : float = 4.0f;
var oldValue : float = 0.0f;

function OnCollisionStay(col : Collision)
{
	var diff: float = Mathf.Abs(oldValue - col.relativeVelocity.magnitude);
	if ( diff > limitVel ) {
		Destroy(this.gameObject);
	}
	oldValue = col.relativeVelocity.magnitude;
}

こうしましょうか。collisionInfo.relativeVelocity.magnitude が衝突している際の相対速度なので、それが急激に変わった時が消えるときだ、という意味になっております。

まあ、こういう関数名は全部覚える必要もありません。docs-jp.unity3d.com でドキュメントが揃っているので、それを確認しましょう。

そこにだいたいサンプルプログラムが載っていますので、参考にして下さい。

プログラムを書くというと最初は抵抗があるかもしれませんが、コピーペーストならば大丈夫でしょう。

Unity Editor に戻って、プレイしてみましょう。はい、どうですか?壊れなくなったのではないでしょうか?

では、そのスクリプトが動くGameObject をクリックしてみましょう。

Inspector の Hit Explosion のところに 「Limit Vel」「Old Value」という項目が増えていませんか?

つまりスクリプトでパラメータ(ここではlimitVelとoldValue)を増やすと、それがUnity Editor上で変更できるようになります。

このLimit Velを変更すれば、どのぐらいの速さでぶつかれば壊れるかが調整出来ます。

入力を受け付ける機能の追加

では今度はマウス入力をさせる機能を追加していきましょう。

ちょっとこれは複雑なんで端折ります。

#pragma strict

function Start () {
	startPos = transform.position;
	this.rigidbody.useGravity = false;
}

private var startPos : Vector3;

function OnMouseDown()
{
	startPos = transform.position;
}

function OnMouseDrag() 
{
	var hit : RaycastHit;
	if(Physics.Raycast(Camera.main.ScreenPointToRay(Input.mousePosition), hit)) 
	{
		transform.position = new Vector3( hit.point.x, hit.point.y, 0.0f );
	}
	this.rigidbody.useGravity = false;
}

public var addPower : float = 8.0f;

function OnMouseUp()
{
	var dir : Vector3 = startPos - this.transform.position;
	dir *= addPower;
	this.rigidbody.useGravity = true;
	this.rigidbody.AddForce(dir,ForceMode.Impulse);
}

コピペして下さい。

スクリプトは PlayerDrag とかいう名前にしましょうか。

そして、これを今度は Player にD&Dしましょう。

さあ、プレイしてみましょう。

マウスでドラッグしてみると、どうでしょうか?

ちゃんとプレイヤーが動きましたか?

【時間があればプログラムの説明を】

さらなるゲームルールの追加

SleepCheck.js:全オブジェクト、静止した?

FrictionAngle.js:ころころ転がり過ぎを抑制する

エフェクトの追加

ではブロックが消滅する際の画面効果を追加しましょう。そういう画面効果をエフェクトといいます。

エフェクトをイチから作るのは大変なので、最初から用意されているものを使いましょう。

Assets→Import Package→Particles

これで様々なエフェクトが追加されました。

この中にある

Assets/Standard Assets/Particles/Misc/Fireworks

を使いましょう。

そして、HitExplosion.jsを以下のように変更します。

#pragma strict

var limitVel : float = 4.0f;
var oldValue : float = 0.0f;
var fx : GameObject;

function OnCollisionStay(collisionInfo : Collision)
{
	var diff: float = Mathf.Abs(oldValue - collisionInfo.relativeVelocity.magnitude);
	if ( diff > limitVel ) {
		if ( vanishFx ) {
			Instantiate(fx, this.transform.position, this.transform.rotation);
		}
		Destroy(this.gameObject);
	}
	oldValue = collisionInfo.relativeVelocity.magnitude;
}

ここのInstantiateというところで、生成しているわけです。あとvanishFxというパラメータを作っていますね。これと同じモノを作ろうとしているのです。

では、Unity Editorに戻ってみると、、、

はい、さっきのブロックのInspectorに「Vanish Fx」という項目が追加されていますね。

ここに先ほどの Firewoks をD&Dします。

これで準備OKです。消える瞬間にFireworksを生成します。

ではプレイしてみましょう。

どうでしょうか?ちゃんとエフェクトが出るでしょうか?

Shurikenの制作

Assets -> Import Package -> Particles でパーティクルテクスチャをインポート

ShapeとSpeedを使うな

20:32から

ではGameObject -> Create Otehr -> Particle Systemをクリックして、パーティクルを作りましょう。

あ、デフォルトで90度かたむいているので、ゼロに戻しましょう。

Shapeで形を制御してはいけません。これはワナです。調整しにくいんですよね。なので、これはオフに。

Speedってなに?煙に速さなんてないですよね?煙は速度と力で制御されるはずです。

なので、まずはParticle Systemの「Shape」をオフに。そしてStart Speed を0にしましょう。

VelocityとForceを使おう

VelocityとForceを使いましょう。<ーこれを理解することが大事!

Velocityのカーブでは調整しやすいが、Forceのカーブは調整しにくい(ゼロになっても依然として続くので)

[Velocity over Lifetime]をオン。「Random Between Two Curves」を選択。

「Space」をWorld

XとZをすり鉢(-1:1) Yを直線で0に下がる(5:0)

[Base]の「Duration」を1.0

「Start Lifetime」を「Random Between Two Constant」で0.5〜1.5まで

「Start Size」を「Random Between Two Constant」で0.5〜1.3まで

[Emmition]の「Rate」を50

マテリアルを作る。「MySmoke」。Materialを「Particles/Alpha Blended」。テクスチャをSmoke。 マテリアルを作る。「MyFire」。Materialを「Particles/Additive」。テクスチャをSmoke。

[Color over Lifetime]をチェック

色を白(0)→黄(10)→ダイダイ(20)→黒(40)に 透明度を255(20) -> 0(100に

[Base]の「Start Rotation」を0〜360に。ワイヤーフレームで見ると?

[Rotation over Lifetime]をオンに。「Random Between Two Constant」で-45〜45

Cmd-Dでデュプリケート。片方をFire、片方をSmokeにして、Fire→Smokeの親子関係にする

Smokeの方の「Start Lifetime」を0.6〜1.9に

[Color over Lifetime]色を黒一色にして、透明度を最後を0(60)->255(70)->0(10)に

詳しくは

https://www.youtube.com/watch?v=Hb_UJMFtp1g

サウンドの追加

課題を解決していきましょう

はい、とりあえず、ここまででできたことは、

引っ張って、ぶつけて、消えると

どうでしょうか?ちょっとゲームっぽくなってきたと思いませんか?

でもここだけではまだゲームではありません。あとはちゃんと、プレイヤーの数を制限したり、

プレイヤーの死に判定

ターゲットを消した際の判定

クリア判定

ゲームシーンの追加

ゲームオーバーの追加

ゲームスタートの追加

違うステージを作成

トレイルエフェクトの追加

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment