Akiba.jsという集まりは初めて聞いたのですが、今日はJavaScript ゲーム製作勉強会 Vol.2に出席しています。会場はリクルートさんです。
詳細はid:nakamura001 さんの撮影した動画を参照しましょう。
はじめに / @hakobera さん
ngCore の話 / @shibukawa さん
- androidは5月に、iOS上は先日「忍者ロワイヤル」
- ngCoreで何ができるかは「忍者ロワイヤル」をやるとわかりやすい
- ngCore
- ngCoreでの開発
- Build Server(node.js)が開発の中心
- BuildServerにあスマフォからアクセス
- ビルドされる。圧縮したり画像を2のベキ乗な正方形にしたり。
- ngCoreでの配信
- androidはmobage Dev site へビルドしたファイルを配置
- iOSの場合は、mobage Dev site へアップロードしてappファイルを作ってapple storeで配信
- ゲームのAPI
- ソーシャルのAPI
- 課金、プロフィール、友達情報、ブラックリスト、アクセス分析
- CommonJS準拠 (require)
- .subclass メソッドによる継承
- エントリポイントは main
- UpdateEmitter → 画面の書き換えごとにハンドラを呼ぶ。これを使って作る
- シリアライズされた命令列をV8側で作り、ゲームエンジン(ネイティブ)側に渡して実行
- イベントは逆に、ゲームエンジンから命令列をJSへ送る
- JS側とネイティブ側が鏡のような関係で動く
- パフォーマンス
- SDKは本家サイトから落としてね
- 環境
- 今後の内容
- ngBuilder : 実行環境の起動、JSのデバッガやプロファイラ、リソース管理
- 将来的にはGUI のレイアウトも
- ngGo → ライブラリ群。開発期間を1/3に
- スクリーン解像度、2Dカメラ、などなど
- まとめ
- ngCoreはマルチプラットフォームで動的・開発効率重視
- ネイティブ+JS
- 開発効率・パフォーマンスのアップに力を入れる予定
- ngCoreの弱いところ
- 趣味で個人がゲーム作るのには至ってない → DeNAへの登録が必要
- 頑張ってオープンにしたい(ただし、米国との絡みがある)
- 質疑応答
- Q. V8を選んだ理由は?
- A. iOSはWEB View。UI Web ViewのJSにはJITがない(Safariにはついてるぽい)。Appleの意向に沿っている
- Q. V8以外の選択肢は?
- A. (決定に携わってはいないが)C++さえあれば動く点が評価されたのでは
- Q. androidとiOSとの差は?
- A. 最近はandroidの方がパフォーマンスがよい。速度以外の差はない
- Q. デバグの方法は?
- A. Flash版でブラウザ上で動かし、ブラウザのデバッガを使うと楽。ngBuilderにも機能はある
- Q. ngCore以外のエンジンと比べて、ngCoreの決め手は?
- A. 使いやすさだけでなく、ngmoco:) のコンテンツ力を評価したのでは
- Q. ngCoreはユーザとしてみると使いやすい?
- A. 使えるなら趣味の開発でも使いたい。コンパイルしなくても裏でホットビルドされて動くのでストレスがない。端末の差にもノウハウが蓄積されてて強い
IMPACT - HTML5 + JavaScriptで作るゲーム開発 / @Seasons さん
- 有償ライセンス $99 円高だから8000円くらいで買えてお得!
- 2D。3Dは予定なさそう。HTML5 + JS。ゲームに特化。レベルエディタ、連携ツール。
- IMPACT。"impact javascript"でググる*1
- 購入するとライセンスキーを取得でき、サンプルやgithubのレポジトリへアクセスできるようになる
- version 1.18 → impact ライブラリ、 weltmeister(レベルエディタ)
- Animation, Entity, Collision, Soundなどの機能。
- 最近Debug 機能が追加された
- どのブラウザでも動作
- Weltmeister
- 連携するツール
- 開発環境
- textmate
- 開発フロー
- 素材作成 → Entity作成 → レベル作成 →テスト
- Entityまでできれば、レベル作成とテストをひたすら繰り返す
- IMPACTはレトロゲームを作るのに最適なフレームワーク
- ドット絵
- Entityを作る
- モジュールロード → ig.module 〜 .requires 〜 .defines
- .extend で継承。クラスの名前は Entity + ファイル名
- initで初期化、updateでフレーム処理
- draw: カスタム描画, check: カスタム当たり判定
- レベルの作成
- タイルの描画
- 関連するイベントをコネクトしたり、コリジョンサイズを変えたり
- 最終的に .js にまとまる
- ゲームデザイナとの分業
- チューニング(新機能)
- 配布
- bake.sh によってコンパイル → game_min.js を配布
- 誤ってフォルダごとアップするとIMPACTのソースが見られてまずいので注意
- iOSIMPACT
- キーパッドとゲームをiOS上に表示
- ソースがそのまま使える
- OpenGL, OpenAL, 30-60FPSをキープできる
- UIKitなどとも組み合わせられる
- OpenGL + OpenAL + JavaScriptCore を iOS上で動かす
- iOSIMPACT用のXcodeProject が配布されるので、これを使ってビルドして *.appを作る
- 作品例 → Biolab Disaster, Drop JS
- plugin 読み込みが必要
- 1.17を使うなら、 スクロールメソッドをig.game.setScreenPos(x, y) を使う必要あり
- bindTouchArea によってコントローラ部分を実装
- 解像度が複数あるので、設定のし直しが必要
- 背景描画のチャンクサイズを256にして、パフォーマンスをあげる
- サウンドはフォーマットを変更する必要あり → afconvert する
- サウンドは512KBを境に、OpenALを使うか使わないか決まる。
- Software Design 9月号と10月号にIMPACTの連載あるよ!
- デモ
- 10分くらいでiOSに移植ができる
スマホ向けCanvasゲームの作り方 / @chikathreesix さん
- 関連作品 → 海賊トレジャー、住み着き妖精セトルリン
- ブラウザゲーを作る
- Canvasとは? → 画像描画のためのHTML要素
- canvas.getContext().drawImage 的な使い方
- 座標はdrawImageに直接指定するか、translateにて指示
- 拡大縮小はdrawImageに直接指定するか、scaleにて指示
- 回転はrotateで指示。変換行列は残るので、.saveと.restore と合わせて使った方がよい
- アニメーション
- setIntervalにてclearRect + drawImage → 処理が遅いと指定した秒ごとには呼ばれないので注意
- FPS → 1秒間にsetInterval(描画)が何度走るか
- iPhone4遅い(iPhone3GSよりも) → ディスプレイに描画するところが遅い(イベントループの周りが遅くなる)
- Canvasの高速化
- drawImageで拡大すると重い → すでに拡大されてる画像を使う。または、予めcanvasに拡大してdrawImageしてき、それを使う
- 縮小は問題ない。拡大を避ける
- 座標に小数を使わない ~~(0.001)
- Android 2.1 のキャンバスのバグ
- scale, rotate, translate あたりの挙動がおかしい → 回転はあきらめる
- アニメーション
- 環境によってFPSが変わってしまう
- タイムベースでフレームを呼ぶ (描画を省く)
- currentTime で時刻を取得して、その値から変化量を算出する
- Canvasフレームワークを作った
- AS3ライク、表示ツリー、イベント伝播モデル、アニメーション
- デモ : 実記の物をカメラで投影。iPhone3GSで気をつけて作れば30FPSくらい出る
- 質疑応答
*1:impactjs でも出た