KLabがFacebookインスタントゲームでゲームエンジンにPlayCanvasを採用！

PlayCanvasを採用するに至った経緯を教えてください

鎌田：まずFacebookから「インスタントゲームでゲームを公開しませんか？」とお声がかかり、そのときにPlayCanvasについても紹介を受けました。紹介してもらったときにスマートフォンの実機上で動作するPlayCanvas製のサンプルアプリを見せてもらい、軽快に動作していることが目で見て確認できたので、すぐさまPlayCanvasにアカウント登録をして検証を開始しました。

私自身はもともとUnityを利用してゲームを開発しており、エディターを利用したゲーム開発に慣れ親しんでいたのですが、PlayCanvasではWeb上で動作するエディターが用意されていて、またその使い勝手も今まで利用していたものと似ていたのが、スムーズに開発を始められるきっかけになりました。

PlayCanvasを使ってみてよかったところはどんなところでしょうか？

鎌田： まずPlayCanvasエンジンが軽量なことです。Facebook インスタントゲームでは当時、アップロードするゲームのファイルは容量3MB未満という制約がありました。

このサイズはかなりシビアで、Unityを利用すると空のプロジェクトでもエンジンのみで10MBを超えてしまい、要件に合わなくなってしまいます。

PlayCanvasでは空のプロジェクトをビルドしたときに全体で800KB程度だったので、これならアセットやゲームロジックを追加しても大丈夫そうという認識につながりました。

松田：Facebook インスタントゲームは海外でも多くの地域で展開されていて、中にはいまだに2G回線が主流のような地域もありました。サイズの小さいPlayCanvas製ゲームはそんな環境でもロード時間は短く、問題なく遊ぶことができたのでよかったですね。

鎌田：開発中によかったことは、PlayCanvasの開発スタイルに起因するところが大きいですね。PlayCanvasではサーバーまで用意してもらっているため、開発から確認までのサイクルがとても早く短い工数で開発ができました。

松田：実際に「Kaburin! Ball」では、スマートフォンの傾きをつかって遊ぶゲームなのですが、PCでデバッグするだけではわからないことも多々あります。そんな時PlayCanvasで実機デバッグするときは実機にURLを渡すだけで確認ができたのでとてもありがたかったです。

鎌田：共同編集もいろいろ役に立ちました。Facebook インスタントゲームに組み込むにあたっていくつか導入しなければいけないSDKがあるのですが、開発者がゴリゴリゲーム開発をしていて、その隣で管理側が邪魔せずに構築作業をできたので、楽に進めることができましたね。

またPlayCanvasそのものがJavaScriptで記述されていることもあり、JavaScriptで記述された外部ライブラリとの親和性がとても高かったです。これがビルドしてJavaScriptが吐き出されるタイプのゲームエンジンだととても大変だったと思います。

逆に気になったところや大変だったところはどんなところでしょうか？

鎌田：もともとUnityを使ってゲーム開発をしていたこともあって、Unityと同じ感覚でPlayCanvasを使っていると所々挙動が違ったり機能がなかったりすることがありました。

松田：なかでもUI周りは特に大変で、当時はフォント周りを制御する機能がなくて、ゲームでスコアを表示するような処理はすべてビットマップフォントを用意し、ある程度staticに表示するような手法で解決していました。

鎌田：UIまわりは私も苦労しました。同じようにビットマップフォントでUI周りを作成していて、ビットマップフォントで実質ダイナミックフォントのように動作する仕組みを自前で実装したりなんかしていました。

あの頃はとても大変でしたが、最近だとスクリーンコンポーネント・エレメントコンポーネントが追加され、TrueTypeのフォントが使えるようになったみたいでとても簡単になったなと思います。
参考記事：エレメントコンポーネントとスクリーンコンポーネントが追加されました

ほかにもUIアニメーションを実現したいときに、パーティクルの機能を使ってUIアニメーションを実装したり、最終的にものすごいグラフが出来上がったり、UIに関しては並々ならぬ努力がありました。

鎌田：バージョン管理も頭を悩ませた問題の一つでした。

PlayCanvasのスピード感の代償としてバージョン管理が難しくなるのが少し辛かったですね。開発していた当時はPlayCanvasにバージョン管理する機能がなく、手動でスクリプトを全てコピーしGithubを使って自前で管理していました。次第にこの方法を続けるのは難しくなってきて、どうしようか考えていたときにプロジェクトのバックアップを取得できるREST APIがリリースされたので、Jenkinsを使って自動化できるような仕組みをすぐに構築しました。それからはだいぶ楽になりましたね。

松田：私はJavaScriptに慣れるまで少し時間がかかりましたね、もともとC,C++ときて業務ではC#でゲームを開発していたので、JavaScriptでゲーム開発をするスタイルに最初は手間取りました。逆に社内のWebに詳しいエンジニアは、生でJavaScriptを記述するのではなくTypeScript等ほかの言語を利用して書けるようになるともっといい等さまざまな意見がありました。

今回開発された「Kaburin! Ball」「Kaburin! Dodge」は御社でどのような位置づけだったのでしょうか？

鎌田：もともと「さくっと遊べるHTML5のゲームを作ってみよう」という挑戦からスタートし、Facebook インスタントゲームで配信して全世界にリリースすることをゴールにしたかなりチャレンジングなプロジェクトでした。

現在KLabでは1つのゲームに1,2年かけるような大型のネイティブゲームで、アイテム課金モデルが主流なのですが、Facebook インスタントゲームを代表するさくっと遊べるカジュアルゲームも求められているのでは？という考えもありました。

海外ではそういったカジュアルゲームにフォーカスをおいたゲーム会社もいくつか存在するため、KLabもFacebook インスタントゲームからカジュアルゲームに挑戦しようということでこのプロジェクトは始まりましたね。

松田：実際、このようなカジュアルゲームに興味を持っている人は多いと思います。Facebook インスタントゲームはSNSとつながっていることも大きいですが、「Kaburin! Ball」「Kaburin! Dodge」は2タイトルとも最初の1,2週間で100万人、現在累計で400万人以上の方々にプレイしていただけました。それぞれのゲームが2ヶ月程度の短いスパンで開発したゲームだったのですが、これだけ多くの人に遊んでもらえるのはFacebook インスタントゲームをはじめとするカジュアルゲームだからかな、と思います。

この規模のゲームタイトルがネイティブゲームのストアに並んだら、1万ダウンロードでも大成功だと思います。ですがこれらの2タイトルは400万人と、とても多くの人に遊んでいただけました。今回の経験を通して、HTML5製カジュアルゲームの「ダウンロードの必要がない」「ロードが高速で手軽に遊んでもらえる」といった強さが再確認できた気がします。

今後PlayCanvasがこうなって欲しい、こうなったらよい等の要望があれば教えてください。

鎌田：現状のPlayCanvasは3Dの機能は多くありますが、ゲームエンジンとしての要件を完全に満たすにはまだ足りないと思います。最近追加されたUI機能からさらに2Dのゲームを作れるような機能も引き続き強化していって、2D/3D問わずHTML5ゲーム開発環境としての地位を確立して欲しいですね。

松田：私はさくっと遊べるカジュアルゲームに注目していまして、最近HTML5ゲームプラットフォームも続々増えてきているので、業界とともにPlayCanvasに注目しています。

PlayCanvasの強みである「確認サイクルの速さとビルド後の軽さ」はそのままに、さらに多くの機能を追加していって欲しいです。