Post on 27-Jun-2015
ゲームツクール！第4回Unity x Photon Cloudでオンラインゲーム
を作ろう！
2013年12月12日FAG Studio 荒川巧也
毎月１回放送USTREAM
http://www.ustream.tv/channel/16059441/
ニコ生 毎回URLが変更になります。Youtube “SB クリエイティブチャンネル” http://www.youtube.com/user/SBBITchannel/videos チェックしてください。
Unity4入門のご紹介• はじめてUnityをさわる人を想定して書かれた本
• Unity4から追加された機能を含む基本操作を学ぶことができます。
コッコと不思議な塔• FAGStudioがUnityを使って作ったピンボールゲーム。
• iOS/Androidで無料配信中
Photon Cloudって何だ？
Photon Cloudについて• ExitGamesというドイツの会社が開発。
• 無料で使えるプランがある(無料は20人まで同時に接続可能。プランの詳細は http://photoncloud.jp/pricing/ でご確認ください。)
• PC/Mac向けはもちろん、iOS/Androidなどのスマホ向けのオンラインゲームも作れる。(＊ただし、iOS/Android書き出し時にはUnityのPro版が必要のようです。)
Photon Cloudにアクセス
http://photoncloud.jp/ にアクセス。
「Photon Cloud 日本公式サイトへ」をクリックしてください。
新規アカウント登録
新規登録をクリック
メールアドレスを登録
登録するメールアドレスを登録してください。その後、登録したアドレスに確認用のメールが届きます。その後、メールに従いパスワードとApp ID取得してください
＊届いたメールの登録先のURLにアクセスできずに登録できない 場合は、↓のURLにアクセスして確認してください。http://photoncloud.jp/info/detail.php?no=1386151532
登録が完了するとこのようなにアカウントを取得できます。
Unity New Project 起動
Asset Store起動Window -> Asset Store
Photonを検索
①“Photon”で検索
②“Photon Unity Networking Free”を選択
Photon Unity Networking Free ダウンロード
クリック！
<参考> iOS/Android対応について
→ iOS/Androidへの対応はPhoton有料版が必要です。 iOS/Androidへの書き出しはUnity Proライセンスが 必要です。
Assetをインストール後、このような画面になりましたか？
Photon Cloudへ接続設定
① クリック
② アカウント設定時取得したAPPID入力
③ 登録地域を選択
④ 地域選択後”Save”をクリック
Photon Cloudのアセットを入れると、このセットアップ画面は自動で現れます。
接続完了！
ワンポイント!
---
このようにネットワークセットアップタブを整理することもいいでしょう。
InportしたAssetからDemoWorkerGame-Scene選択する
クリックDemoWorkerGame-Scene選択
このような画面になりましたか？
Static Stuff削除
Static Stuffを削除
Directional light追加
Terrainを使おう！
クリック
150100
Create -> Terrain positionの値チェック！
Terrain Assets追加Assets -> Import Package -> Terrain Assets
地形を作ろうTerrainのInspector Viewを確認して地形を作ろう
クリック
Scene View上で地形を作ろうTerrainを絵の具のように塗ると盛り上がります。
地形が完成！
Terrainの使い方はUnity4入門を見てね！
PlayerをHierarchyに移動
Assets -> Photon Unity Networking -> Demos-> Demo Worker -> Resources -> Player
PlayerをHierarchy Viewに移動させます。
玉を発射させる準備
胸のあたりに移動
空のGameObjectを作りそこから発射します。
このようにしているのはPlayerというTagを持っているPlayerが玉を発射させると、玉を発射した瞬間にPlayer自身がDestroyしてしまうからです。
ここでは名前を”Fire”にしました。
玉を発射させるスクリプト
//Fire.js#pragma strictvar bullet : Rigidbody; var speed = 20;
function Update () {if (Input.GetButtonUp("Fire1")){var clone = Instantiate(bullet,transform.position,transform.rotation);clone.velocity = transform.TransformDirection(Vector3(0,0,speed));Destroy(clone.gameObject,3);
}}
Playerに追加した空オブジェクト(Fire)に追加してください。Javascriptのスクリプトです。
玉を作ろう(Sphereで作成)
Sphereのサイズ変更Scale x:0.2 Y:0.2 Z:0.2
SphereにRigidbody追加 SphereをPrefab化
Prefab化できればHierarchyのSphereを削除してください。
Playerのあたり判定準備①
//hit.js#pragma strict
function OnCollisionEnter(info : Collision) { if (info.gameObject.tag == "Player") { info.gameObject.SendMessage("ApplyDamage"); }}
Javascriptのスクリプトです。Bullet(玉)に追加してください。hit.js
Bulletの準備(玉の準備)
BulletのNoneにRigidbody付きのPrefabオブジェクトを追加します。(この場合はPrefab化したSphere”bullet”です。)
Playerのあたり判定準備②
//Damage.js#pragma strict
var explosionPrefab : GameObject;
function ApplyDamage() { Instantiate(explosionPrefab, transform.position, Quaternion.identity); Destroy(gameObject); Application.LoadLevel(Application.loadedLevel);}
Javascriptのスクリプトです。Playerに追加してください。 Damage.js
爆発エフェクト追加
Expolsion PrefabにParticle追加
Assets -> Import Package -> Particles
Particle追加
変更を適応する
PlayerのInspectorのApplyをクリックする。
Hierarchy viewのPlayerを削除する。
Playボタンを押してみよう
Player名ルーム名 Create Roomをクリック
ゲーム開始
ゲームができました！
ゲームを書き出す
File -> Build SettingsPC or Macに書き出し。WebPlayerに書き出してWeb上に置くのもGoodです。
遊んでみよう！
1つのMacで2つのブラウザを立ち上げました。1つ目のブラウザは、Create Roomでゲームを始めます。
サンプルは、こちらで確認できます。http://p.tl/5gHe
2つ目のブラウザでは下に現れたRoomに入ってください
Joinを押す
2人が巡り会い！
右クリックで弾発射！
チャットも使える！
チャットできる！