Aiming Study 6 UnityアプリのHTML5移植 勉強会レポート

初めまして、ソフトウェアエンジニアの渡部です。
本日は10月24日に神保町で行われたAiming Study 6 「UnityアプリをHTML5に移植してみた」について報告させて頂きます。勉強会当日はTwitterにてハッシュタグ#aimingstudyでリアルタイムに出た質問のいくつかに回答させて頂いていました。

今回の勉強会は直前で会場変更があったにも関わらず100人以上の方々に来て頂いて非常に大盛況の勉強会となりました。

参加して頂いた皆様、また急なお願いにも関わらず会場をお貸し頂いた株式会社インターネットイニシアティブさんありがとうございました！

勉強会のテーマについて

今回は現在リリース中のブラウザゲーム、HTML版ロードオブナイツ（Yahoo!モバゲー版）（モバゲー版）の開発について、弊社エンジニアの竹馬と岩野が発表しました。

• 竹馬「大規模Javascript その設計と実装と現実」
• 岩野「短期間＋大規模ゲーム開発でも破綻しないHTML・SCSS」

前々回の記事の中でも触れられていますが、講演者の二人と僕を含むロードオブナイツのHTML版チームのエンジニアのほとんどは元々Unity版ロードオブナイツのメンバーではなく、今回の開発はUnity版のゲーム仕様とC#コード、HTML版の新規デザインを元に進められました。

大規模Javascript その設計と実装と現実

最初に竹馬による大規模Javascript開発の発表が行われました。

ロードオブナイツはUnity版、HTML版ともにクライアント側をAiming、サーバー側を株式会社インフィニットループさんが行なっており（それについての記事）、HTML版でAimingはブラウザ上のJavascriptで動作するクライアントの開発を行いました。

スライドではJavascriptをそのまま使うのではなく、CoffeeScriptを用いてクラスベースのオブジェクト指向開発を行ったことや、Githubを用いた分散ワークフローやペアプログラミング、MVCモデルによるクライアントコードの設計、スマートフォンとPC双方を考慮したHTML5でのパフォーマンスチューニングなどについてまとめられています。

僕はAimingに入社してすぐこのプロジェクトに配属されましたが、CoffeeScriptはJavascriptに比べて冗長な記述を省略できることから可読性も高いため、スムーズに開発に入っていくことが出来ました。

短期間＋大規模ゲーム開発でも破綻しないHTML・SCSS

次に岩野によるマークアップの発表が行われました。

短期間のブラウザゲーム開発において期日のために切り捨てたことをはじめ、モバイル回線のための画像サイズ最適化、CSSの拡張言語SCSSとCSSフレームワークCompassを用いたスタイルシートの行数削減、スマートフォンとPCで別々の画像を出すに当たってのアセット管理などについてまとめられています。

僕がプロジェクトに入って最初に携わったのがマップ画面の開発だったので、当時マップ画面のスタイルが適用された時は竹馬共々すごくモチベーションが上がった事を覚えています。

発表後の懇親会

今回は都合により懇親会の時間を十二分に長くは取れませんでしたが、多くの方とお話することが出来ました。
皆さんにとっても実りある懇親会になっていたようであれば幸いです。

次回について

第6回が終わったばかりですが、次回のAiming Study 7は来週11月6日(火)に渋谷セルリアンタワーのGMO Yoursをお借りして開催いたします。

AimingStudy 7 「 ロードオブナイツ　UnityからHTML化する際のアプリの設計とアジャイル的開発管理の話」

テーマは引き続きHTML版ロードオブナイツで、Unity版とHTML版両方に携わった細田（開発リーダー）と小林（ゼネラルマネージャ）が発表致します。
今回参加された方も参加されなかった方も是非参加して頂きたいと思います！