Braindots-開発秘話- Cocos2d-x3.5 開発事例 -

Preview:

Citation preview

-Cocos2d-x3.5での開発事例-

株式会社トランスリミット

Cocos Talks #5 (2015/07/23)

アジェンダ

会社概要 ゲーム概要 開発環境

物理ゲームの 開発

その他 苦労したこと

まとめ

会社紹介

提供サービス1300万DL 100万DL

アジェンダ

開発環境

物理ゲームの 開発

その他 苦労したこと

まとめ

ゲーム概要会社概要

ゲーム概要

今度は描く脳トレ!

BrainDotsの遊び方

線を描いて

ぶつける

BrainDotsの遊び方

BrainDotsの遊び方

ペンの種類は30種類以上

300以上のステージ

プレイ動画共有

ユーザーのプレイ動画

俺のプレイ動画

グローバルで流行ると…

自己紹介川端 和樹

(Kawabata_Lemon)

株式会社トランスリミット 2015年度新卒入社

@Kawabata_Lemon

クライアントサイドエンジニア

アジェンダ

物理ゲームの 開発

その他 苦労したこと

まとめ

開発環境ゲーム概要会社概要

開発環境

開発期間は2ヶ月ちょっと

基本的な機能 ブラッシュアップ

社内ライブラリの開発も並行して実装

開発環境

Cocos2d-x

Translimit-core(社内ライブラリ)

ゲーム部分(BrainDots)

SNSシェア、通信処理、プレイ録画、 広告、サウンド、暗号化、課金、ローカライズ

開発環境物理エンジン

Cocos2d-x 3.0から標準実装されている 物理エンジンを使用

こちらは使わず。

開発環境

->当初は最新だった3.6をベースに開発開始

当初は最新版であったCocos2d-x3.6で開発開始したが… ピクつき問題に遭遇した

開発環境->試しにCocos2d-xのcpp-testで3.5と3.6で

試してみると3.5なら発生しないことが発覚

_人人人人人人人人人人人人人人人人人_ > Cocos2d-x3.5にダウングレード <  ̄Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y ̄

動画共有EveryPlayを使用

->Cocosのオーディオが録音できない(Android)

->Cricket Audio Engineを導入

アジェンダ

その他 苦労したこと

まとめ

開発環境ゲーム概要会社概要

物理ゲームの 開発

物理システムを使った開発

PhysicsWorld

PhysicsBody

PhysicsShape

PhysicsContact

PhysicsJoint

Cocos2d-xの物理エンジン(Chipmunk) が提供するもの

->重力とかを持つ物理世界

->オブジェクトの剛体

->剛体に含まれる単位図形

->オブジェクトとの衝突イベント

->物体を世界に繋ぎとめるもの

描いたものに剛体を与えるPhysicsShapeで作成できる図形

Circle Box Polygon

この図形のみで描いた物に剛体を作る

描いたものに剛体を与える

タッチした点を保存

onTouchBegan,onTouchMoved

描いたものに剛体を与える

図形を図形で結ぶ

手を離したタイミングで..

onTouchEnded

最適化が必要だったこの工程だと追加された点に合わせて図形が

めちゃ増える

iPod Touch 4Genで重くなるくらい 剛体の計算が辛くなった

ましてやAndroidなんて…(ボソッ

剛体を減らすような工夫が必要でした。

最適化1図形の描画はするけど剛体は追加しない

見た目

剛体

なんか違和感

最適化2四角形を追加する最低距離を長めに取る

あんまり長く取り過ぎたら違和感

最終的に

中間の丸をすべて取り除く

結果として剛体は約半分に

->Androidのミッドレンジ端末でもまあまあ動く

ギミックの開発

スイッチとレーザー

ベルトコンベア

動くオブジェクト

ピン

物理のイベント

onContactBegin

onContactSeparate

onContactPresolve

onContactPostSolve

物体がぶつかり合う時にはイベントが発生する

衝突したとき

離れたとき

衝突中

衝突後

ベルトコンベア

上に乗っているオブジェクトを加速(減速)

ベルトコンベアベルトコンベアに乗ったら配列に追加

Updateで配列中のオブジェクトをベルトコンベアの速度になるように調整する

onContactBegin

ベルトコンベア

ベルトコンベアに離れたら配列から外す

onContactSeparate

スイッチとレーザー

T

ノード(スイッチ)が他のノード(レーザー) に影響を与える

スイッチとレーザー

Tレーザーを先に生成して

スイッチを生成

スイッチとレーザー

T

ボールとスイッチがぶつかったら

onContactBegin

スイッチとレーザー

T

レーザーを消す

動くオブジェクトAction(MoveByとか)で移動するオブジェクト

剛体もついてくるためアニメーションさせるだけで 簡単にリフトなどが実装できた

ピン(PhysicsJoint)オブジェクトを空間内に止めるためのオブジェクト

ボールが上に乗ると

ピン(PhysicsJoint)オブジェクトを空間内に止めるためのオブジェクト

重みで回転する

動くオブジェクトとピンの注意点

PhysicsJointも、剛体のrunActionもPhysicsWorld が存在しない状態で生成すると落ちる

onEnterTransitionDidFinish()->オブジェクトのでピンを追加するようにしたり、runActionを開始

アジェンダ

まとめ

開発環境ゲーム概要会社概要

物理ゲームの 開発

その他 苦労したこと

苦労したその他の点

Androidで画面が黒くなる

AndroidでClippingNodeが効かない

Androidで 画面やオブジェクトが黒くなる現象は2つのパターンがあった

1.動画広告から戻ってきた時にラベルやスプライトが真っ黒になる

2.RenderTextureで生成したテクスチャが バックグラウンドからもどると…

1.動画広告から戻ってきた時にラベルやスプライトが真っ黒になる

原因:動画広告のコールバック時にはOpenGLのContextが存在していなかった

Cocos

Java

動画広告

Cocos

Java

Callback

解決策JavaからうけたコールバックをCocosの Scheduler処理で実行するようにした。

Director::getInstance()->getScheduler()-> schedule(CC_SCHEDULE_SELECTOR(Callback::doCallback), this, 0, false);

// Cocosのスケジューラで実行するためOpenGLの復帰後に必ず実行される

2.RenderTextureで生成したテクスチャがバックグラウンドからもどると真っ黒になる

ゲーム内で使用する方眼紙の背景はRenderTextureで動的に生成している。

(端末によって解像度が違うため)

->内部でキャッシュ機構を作って解像度ごとにテクスチャをマッピングして持っておくよ

うに実装した。

2.RenderTextureで生成したテクスチャがバックグラウンドからもどると…

ところがバックグラウンドに入って戻ってくるとそのテクスチャが解放されて真っ黒に

原因:AndroidのOpenGLの挙動でバックグラウンド時に入った際、一旦テクスチャ情報がリセットされていた

画像ファイルから作られたテクスチャ類は復活されるが動的に生成したテクスチャは復活されない

->結局、必要な方眼パターンを初回時にRenderTextureですべて生成し画像ファイルで保存

して使うようにした。

解決策

AndroidでClippingNodeが効かない

解決法1.AppActivity.javaの設定をいじる

2.RenderTextureのオプションを設定

@Override public Cocos2dxGLSurfaceView onCreateView() { // ClippingNodeのバグ対応 glSurfaceView = new Cocos2dxGLSurfaceView(this); this.hideSystemUI(); glSurfaceView.setEGLConfigChooser(5, 6, 5, 0, 16, 8); return glSurfaceView; }

RenderTexture::create(paddedSize.width, paddedSize.height, Texture2D::PixelFormat::RGBA8888, GL_DEPTH24_STENCIL8_OES);

アジェンダ

開発環境ゲーム概要会社概要

物理ゲームの 開発

その他 苦労したこと

まとめ

まとめ物理ゲームは楽しいけどパフォーマンス的に

制約が求められることになるため グローバルで作るのはなかなか難しい

->剛体をいかにして減らすかなどの最適化が 必要となる。

まとめクロスプラットフォームゲームエンジン

とはいえ Android(iOS)にしか起こらない問題は

付きまとう

->OS固有のみならず、端末固有の問題など それもまた最適化が必要となるため

完全にすべての端末に対応することは難しい。

まとめそれでもやっぱり便利ではあるので

Cocos2d-xはオススメです。

->中のコードも見える

->必要に応じてカスタマイズもできる

アジェンダ

開発環境ゲーム概要会社概要

物理ゲームの 開発

その他 苦労したこと

まとめ

世界に響くサービスを作りたい エンジニア/デザイナー募集中!

https://www.wantedly.com/projects/21002

ご清聴ありがとうございました

Recommended