Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.
JavaScriptゲーム制作勉強会	  Vol.2	 (2011/8/23)	    第7回ありえるえりあ勉強会    JSで大規模・エンタープライズ開発               •        株式会社ディー・エヌ・エー	      ...
最初に•  いっぱい詰め込んだので時間が足りないかも	    –  懇親会に行くので質問とかご自由に!	  •  3番目の	  @monjudoh	  さんは写真撮影すると	     呪い殺されてゾンビにされてしまうかもしれない   ので禁止で...
自己紹介:渋川よしき                                                                                                     TwiTer:	  @...
ソーシャルゲームとは?	  Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   4/35
ソーシャルゲームの定義(渋川定義)•  ユーザ間で非同期なやりとりが発生するマルチ   プレーヤー型のゲーム	   –  5キー連打がソーシャルゲームではない	   –  複数人が同時にリアルタイムでプレイする(MMO)も    ソーシャルゲー...
ngCoreのゲームのアーキテクチャ	Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   6/35
ngCoreの実例                       	  Androidでも、iOSでも配信しております!	 Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  right...
ngCoreとは?•  JavaScriptで開発可能なゲームエンジンです。	  •  特徴としては	   –  マルチプラットフォーム	     •  同一ソース(JavaScript)でAndroidとiOSに対応	     •  テスト環...
ngCoreとは?•  JavaScriptで開発可能なゲームエンジンです。	  •  特徴としては	   –  マルチプラットフォーム	     •  同一ソース(JavaScript)でAndroidとiOSに対応	     •  テスト環...
DeNAのngCore製ゲームの構成                      ゲームロジック	                         /JavaScript	                            ngCore	  ...
DeNAのngCore製ゲームの構成                      ゲームロジック	                         /JavaScript	                            ngCore	  ...
DeNAのngCore製ゲームの構成                      ゲームロジック	                         /JavaScript	                            ngCore	  ...
DeNAのngCore製ゲームの構成                      ゲームロジック	                         /JavaScript	                            ngCore	  ...
役割分担•  ngCoreのクライアント	    –  アクションシーン(スペシャルミッション)	    –  サーバ側で作ったデータの再生	  •  ゲームサーバ	    –  パラメータ保持、パラメータ変化の計算	    –  アイテムの管...
役割分担•  ngCoreのクライアント	    –  アクションシーン(スペシャルミッション)	    –  サーバ側で作ったデータの再生	  •  ゲームサーバ	              アイテム購入機能はMobage  –  パラメータ...
ngCoreの開発サイクル                                                                      Build	                                 ...
ngCoreの開発サイクル                                                                     •       端末にランタイムをインストール	                ...
ngCoreの開発サイクル                                   •      ソースコードをまとめて1つのjsファイルに	                                     •      画...
ngCoreの開発サイクル                                                                     •      ベイクした結果を端末に配信	                   ...
コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop...
コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;                                                 •    Common...
コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop...
コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop...
コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop...
ネットワークからのダウンロード•  DownloadManifestクラス	    –  配信するソースコード、画像、音声、JSONなどのデー     タのファイルをmanifest.jsonに書く	    –  ビルド時に、MD5値を計算	 ...
大規模JS開発を支えるngCore•  ソースコードレベル	    –  複数ファイルに分けてJavaScriptコードを開発	    –  複数モジュールをビルドサーバで1ファイルに統合	    –  モジュールごとの名前空間	      •...
忍者ロワイヤル	  JavaScript層のアーキテクチャ	   Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   27/35
ゲームの基本構成(1)•  階層型のシーン	   Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   28/35
シーン・フレームワーク•  シンプルなクラス群   –  Sceneクラスを継承してシーンを作る	     –  SceneDirector.push(シーンのオブジェクト);      でシーン遷移	     –  SceneDirector...
ゲームの基本構成(2)•  サーバからのリプライのディスパッチ	                                                                          スロットを回すよ!	      ...
ゲームの基本構成(2)•  サーバからのリプライのディスパッチ	                                                                      ジョブの配列+通知情報	        ...
サーバ通信のディスパッチ•  ミッションの結果などは、配列で返ってくる	   –  ミッションクリア、レベルアップ、武器壊れた、	      アイテムゲット、ボスと遭遇etc..	  •  クライアントは順番に再生しているだけ	  •  新しい...
DnLib/ngGo	    Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   33/35
DnLib/ngGo•  DnLib	     –  ゲーム開発の共通ライブラリ	     –  元はDeNAの内製チーム内で運用	     –  エンサイクロペディアというngCore情報をまとめた      ページ作成時に、一部を公開	  ...
エンサイクロペディアはSphinx製!	Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   35/35
開発Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   36/35
地球規模のJavaScript開発•  サンフランシスコ -­‐	  ngmoco:)	     –  ngBuilderの開発	     –  一部ngGoのモジュール	  •  日本	     –  ngGoのモジュール	     –  ド...
Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   38/35
ngGo/ngBuilder•  1st	  &	  3rd	  パーティーの開発をサポート	  •  シーンのフレームワークは公開してます	  •  データ駆動	      –  リリース後は開発の人数を減らしながら、イベントな       ...
開発の風景•  大きく機能で拠点を分ける	  •  でもリリースは同じ場所で	  •  Skypeのチャットが主なインフラ	     –  家で仕事することもあるよ	  :	  (	  •  gitを使う	     –  git	  flowで	...
ngCoreのデバッグ・開発環境	   Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   41/35
•  デバッグ	    –  デバッグメニューをゲームにつける	       •  パラメータ変更	       •  カットシーンを再生	    –  Android実機用のデバッガー	       •  ngBuilderからデバッガ起動。...
デバッグとテスト•  デバッグメニュー	    –  サーバにデバッグ用ページがあり、それをアクセス	  •  ユニットテスト	    –  サーバ側はTest::More	  (Perl)	    –  クライアント側はJasmine	   ...
ngCoreを触ってみるには?•  下記のサイトでSDKと、ngGo/Builderが	     ダウンロードできます	  •  日本語の開発情報も充実しています	                               https://d...
今後のngCore•  本体の機能拡張も行われます!	   –  パフォーマンスアップ	   –  3D対応、HTML5への対応	  •  開発効率の向上	   –  ngServer	       •  JavaScriptでゲームサーバ	 ...
まとめ•  大規模JavaScriptゲーム開発	    –  分割しやすい構造にして部品ごとに作りこみ	  •  地球規模JavaScript開発	    –  JavaScriptの大規模になりつつあるゲーム開発をサ     ポートする環境...
Próxima SlideShare
Cargando en…5
×

大規模JavaScript開発

9.341 visualizaciones

Publicado el

ありえるえりあ勉強会で発表した、大規模JavaScript開発の資料です。

Publicado en: Tecnología
  • (Unlimited)....ACCESS WEBSITE Over for All Ebooks ................ accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m6jJ5M }
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí
  • Download or read that Ebooks here ... ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... Download Doc Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... .........................................................................................................................
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí
  • If you want to download or read this book, Copy link or url below in the New tab ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... Download Doc Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... .........................................................................................................................
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... Download doc Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí
  • DOWNLOAD THI5 BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... Download doc Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí

大規模JavaScript開発

  1. 1. JavaScriptゲーム制作勉強会  Vol.2 (2011/8/23) 第7回ありえるえりあ勉強会 JSで大規模・エンタープライズ開発 •  株式会社ディー・エヌ・エー   •  ソーシャルゲーム事業本部ソーシャルゲーム統括部   •  スマートフォンSG部SPシステム第三グループ   •  渋川よしき Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 1/35
  2. 2. 最初に•  いっぱい詰め込んだので時間が足りないかも   –  懇親会に行くので質問とかご自由に!  •  3番目の  @monjudoh  さんは写真撮影すると   呪い殺されてゾンビにされてしまうかもしれない ので禁止ですが、僕のターンは写真撮影もTweet も自由です!   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 2/35
  3. 3. 自己紹介:渋川よしき TwiTer:  @shibukawa •  仕事   –  本田技術研究所→DeNA   –  スマートフォンと日々戯れています   •  参加コミュニティ   –  SphinxUsers.jp会長   •  翻訳ハッカソンとかを継続開催予定   –  日本XPユーザグループ代表   –  Python温泉(系)   •  昨年出した本   –  IT業界を楽しく生き抜くための   つまみぐい勉強法(技術評論社)   –  エキスパートPythonプログラミング   (アスキーメディアワークス)   –  ポモドーロテクニック入門   (アスキーメディアワークス)   –  アート・オブ・コミュニティ   (オライリー・ジャパン)   写真:  清水川webより転載 Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 3/35
  4. 4. ソーシャルゲームとは? Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 4/35
  5. 5. ソーシャルゲームの定義(渋川定義)•  ユーザ間で非同期なやりとりが発生するマルチ プレーヤー型のゲーム   –  5キー連打がソーシャルゲームではない   –  複数人が同時にリアルタイムでプレイする(MMO)も ソーシャルゲームではない   –  ケータイのゲームがソーシャルゲームではない   •  ただしケータイとの相性は良い   –  ブラウザのゲームがソーシャルゲームではない   •  ただしブラウザとの相性は良い   –  風来のシレンの風来救助隊はソーシャル   –  人生ゲームもソーシャル Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 5/35
  6. 6. ngCoreのゲームのアーキテクチャ Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 6/35
  7. 7. ngCoreの実例  Androidでも、iOSでも配信しております! Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 7/35
  8. 8. ngCoreとは?•  JavaScriptで開発可能なゲームエンジンです。  •  特徴としては   –  マルチプラットフォーム   •  同一ソース(JavaScript)でAndroidとiOSに対応   •  テスト環境としてFlashも。将来的にはHTML  5にも対応   –  複数の配信方法を提供   •  ポータルでゲームをダウンロード/app,apkを生成   –  ゲーム用API完備   •  XNAよりもシンプルなAPI   –  ソーシャル用API完備   •  同一ソースでiOS/Androidで友達情報取得とか課金とか   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 8/35
  9. 9. ngCoreとは?•  JavaScriptで開発可能なゲームエンジンです。  •  特徴としては   –  マルチプラットフォーム   •  同一ソース(JavaScript)でAndroidとiOSに対応   •  テスト環境としてFlashも。将来的にはHTML  5にも対応   –  複数の配信方法を提供   •  ポータルでゲームをダウンロード/app,apkを生成   –  ゲーム用API完備   •  XNAよりもシンプルなAPI   –  ソーシャル用API完備   •  同一ソースでiOS/Androidで友達情報取得とか課金とか   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 9/35
  10. 10. DeNAのngCore製ゲームの構成 ゲームロジック   /JavaScript ngCore Mobageサーバ サーバロジック   /Perl Apache+FCGI  iOS機/Android機 +MobaSiF ゲームサーバ By  jamisonjudd  under  CC-­‐BY Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 10/35
  11. 11. DeNAのngCore製ゲームの構成 ゲームロジック   /JavaScript ngCore Mobageサーバ ゲームロジック   /JavaScript サーバロジック   ngCore /Perl Apache+FCGI  iOS機/Android機 +MobaSiF ゲームサーバ Android  Market/App  Storeからインストール By  jamisonjudd  under  CC-­‐BY Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 11/35
  12. 12. DeNAのngCore製ゲームの構成 ゲームロジック   /JavaScript ngCore Mobageサーバ ゲームロジック   /JavaScript サーバロジック   ngCore /Perl Apache+FCGI  iOS機/Android機 +MobaSiF ゲームサーバ 追加アセット(画像・データなど)と、イベント用アセットをロード By  jamisonjudd  under  CC-­‐BY Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 12/35
  13. 13. DeNAのngCore製ゲームの構成 ゲームロジック   /JavaScript ngCore Mobageサーバ 認証/ソーシャルグラフ ゲームロジック   JSON /JavaScript サーバロジック   ngCore /Perl Apache+FCGI  iOS機/Android機 +MobaSiF ゲームサーバ サーバとクライアントでJSONを交換しながらゲーム進行 By  jamisonjudd  under  CC-­‐BY Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 13/35
  14. 14. 役割分担•  ngCoreのクライアント   –  アクションシーン(スペシャルミッション)   –  サーバ側で作ったデータの再生  •  ゲームサーバ   –  パラメータ保持、パラメータ変化の計算   –  アイテムの管理   –  ミッションスロットの出目の決定   –  ゲーム友達の管理  •  Mobageサーバ   –  モバ友情報/ブラックリスト管理   –  課金 Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 14/35
  15. 15. 役割分担•  ngCoreのクライアント   –  アクションシーン(スペシャルミッション)   –  サーバ側で作ったデータの再生  •  ゲームサーバ   アイテム購入機能はMobage –  パラメータ保持、パラメータ変化の計算   サーバにもあるので、ロジック –  アイテムの管理   をクライアントに全部移動す れば、ゲームサーバレス設計 –  ミッションスロットの出目の決定   も可能   –  ゲーム友達の管理  •  Mobageサーバ   –  モバ友情報/ブラックリスト管理   –  課金 Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 15/35
  16. 16. ngCoreの開発サイクル Build   Server   (node.js) Baked   game By  nyuhuhuu  under  CC-­‐BY By  the_toe_stubber  under  CC-­‐BY By  _m  geers  under  CC-­‐BY-­‐SA By  superstrikertwo  under  CC-­‐BY-­‐SA By  osde8info  under  CC-­‐BY-­‐SA Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 16/35
  17. 17. ngCoreの開発サイクル •  端末にランタイムをインストール        ラインタイムからサーバにアクセス   •  Or  ブラウザでアクセス Build   Server   (node.js) Baked   game By  nyuhuhuu  under  CC-­‐BY By  the_toe_stubber  under  CC-­‐BY By  _m  geers  under  CC-­‐BY-­‐SA By  superstrikertwo  under  CC-­‐BY-­‐SA By  osde8info  under  CC-­‐BY-­‐SA Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 17/35
  18. 18. ngCoreの開発サイクル •  ソースコードをまとめて1つのjsファイルに   •  画像の正方形/2のべき乗にリサイズ   •  ファイルのリスト(manifest)生成   •  暗号化とかminifyとか(オプション)   •  150kbごとに分けてzip圧縮(オプション)   etc Build   Server   (node.js) Baked   game By  nyuhuhuu  under  CC-­‐BY By  the_toe_stubber  under  CC-­‐BY By  _m  geers  under  CC-­‐BY-­‐SA By  superstrikertwo  under  CC-­‐BY-­‐SA By  osde8info  under  CC-­‐BY-­‐SA Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 18/35
  19. 19. ngCoreの開発サイクル •  ベイクした結果を端末に配信   •  ゲームを動作させてデバッグ Build   Server   (node.js) Baked   game By  nyuhuhuu  under  CC-­‐BY By  the_toe_stubber  under  CC-­‐BY By  _m  geers  under  CC-­‐BY-­‐SA By  superstrikertwo  under  CC-­‐BY-­‐SA By  osde8info  under  CC-­‐BY-­‐SA Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 19/35
  20. 20. コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageListener.subclass({ initialize: function() { this.image = mychar = new GL2.Sprite(); this.image.setImage(“Content/myimage.png”); this.setPosition(100, 100); this.x = 100; }, onUpdate: function() { this.x += 3; this.setPosition(this.x, 100); }});function main() { var loop = new MainLoop(); Core.UpdateEmitter(loop, loop.onUpdate);} Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 20/35
  21. 21. コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2; •  CommonJS準拠のモジュール  var Core = require(“./NGCore/Client/Core”).Core; システム   •  モジュールごとの名前空間   •  ファイル分割で大規模ゲームも  var MainLoop = Core.MessageListener.subclass({ 余裕   initialize: function() { this.image = mychar = new GL2.Sprite(); this.image.setImage(“Content/myimage.png”); this.setPosition(100, 100); this.x = 100; }, onUpdate: function() { this.x += 3; this.setPosition(this.x, 100); }});function main() { var loop = new MainLoop(); Core.UpdateEmitter(loop, loop.onUpdate);} Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 21/35
  22. 22. コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageListener.subclass({ •  オブジェクト指向言語に慣れた   initialize: function() { 人も安心のオブジェクト指向   サポート   this.image = mychar = new GL2.Sprite(); •  継承、シングルトンが簡単に   this.image.setImage(“Content/myimage.png”); this.setPosition(100, 100); this.x = 100; }, onUpdate: function() { this.x += 3; this.setPosition(this.x, 100); }});function main() { var loop = new MainLoop(); Core.UpdateEmitter(loop, loop.onUpdate);} Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 22/35
  23. 23. コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageListener.subclass({ initialize: function() { this.image = mychar = new GL2.Sprite(); this.image.setImage(“Content/myimage.png”); this.setPosition(100, 100); this.x = 100; }, onUpdate: function() { this.x += 3; this.setPosition(this.x, 100); }});function main() { •  main関数から始まります   var loop = new MainLoop(); •  フレームごとにUpdateEmiTer   Core.UpdateEmitter(loop, loop.onUpdate); に登録した関数が呼ばれます  } Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 23/35
  24. 24. コードはこんな感じ(イメージです)var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageListener.subclass({ •  ini_alize/destroyがコンストラクタ   initialize: function() { デストラクタの役割をします   this.image = mychar = new GL2.Sprite(); this.image.setImage(“Content/myimage.png”); this.setPosition(100, 100); this.x = 100; }, onUpdate: function() { •  毎フレームごとの処理を記述   update通知が処理の起点   this.x += 3; this.setPosition(this.x, 100); }});function main() { var loop = new MainLoop(); Core.UpdateEmitter(loop, loop.onUpdate);} Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 24/35
  25. 25. ネットワークからのダウンロード•  DownloadManifestクラス   –  配信するソースコード、画像、音声、JSONなどのデー タのファイルをmanifest.jsonに書く   –  ビルド時に、MD5値を計算   –  ダウンロード時はMD5を比較して、変更があったもの のみをダウンロードする   –  メインのManifest(最初にダウンロードされる)以外に も、サブのManifestを任意のタイミングでダウンロード できる(ただしコードはメインのみ)   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 25/35
  26. 26. 大規模JS開発を支えるngCore•  ソースコードレベル   –  複数ファイルに分けてJavaScriptコードを開発   –  複数モジュールをビルドサーバで1ファイルに統合   –  モジュールごとの名前空間   •  ただし、JavaScriptなのでグローバル空間はある   –  Javaっぽいオブジェクト指向  •  データ配信   –  差分だけを効率よくダウンロードできる仕組み Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 26/35
  27. 27. 忍者ロワイヤル  JavaScript層のアーキテクチャ Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 27/35
  28. 28. ゲームの基本構成(1)•  階層型のシーン Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 28/35
  29. 29. シーン・フレームワーク•  シンプルなクラス群 –  Sceneクラスを継承してシーンを作る   –  SceneDirector.push(シーンのオブジェクト); でシーン遷移   –  SceneDirector.pop();   で戻る –  push/pop時に、Sceneのイベントハンドラを呼び出し•  ビュー・コントローラをさくっと切り替える•  シーン単位で作りこみができる –  デバッグメニューから、カットシーンの単体実行など Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 29/35
  30. 30. ゲームの基本構成(2)•  サーバからのリプライのディスパッチ   スロットを回すよ! ゲームサーバ Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 30/35
  31. 31. ゲームの基本構成(2)•  サーバからのリプライのディスパッチ   ジョブの配列+通知情報 ゲームサーバ Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 31/35
  32. 32. サーバ通信のディスパッチ•  ミッションの結果などは、配列で返ってくる   –  ミッションクリア、レベルアップ、武器壊れた、   アイテムゲット、ボスと遭遇etc..  •  クライアントは順番に再生しているだけ  •  新しいミッションの出目を追加する時も、ハンドラ を1箇所に追加すればいい   –  ハンドラさえなければ無視   –  Androidで先に配信とかもできる  •  サーバエラーがあるとホーム画面に強制で戻る   –  端末のアプリの再起動は不要なので、デバッグが楽 Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 32/35
  33. 33. DnLib/ngGo Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 33/35
  34. 34. DnLib/ngGo•  DnLib   –  ゲーム開発の共通ライブラリ   –  元はDeNAの内製チーム内で運用   –  エンサイクロペディアというngCore情報をまとめた ページ作成時に、一部を公開  •  ngGo   –  DnLibをngCore公式のものとして作りなおす   –  しっかりしたドキュメント   –  統合開発環境ngBuilderと一緒に公開   –  数日以内に、1.1がリリース予定 Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 34/35
  35. 35. エンサイクロペディアはSphinx製! Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 35/35
  36. 36. 開発Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 36/35
  37. 37. 地球規模のJavaScript開発•  サンフランシスコ -­‐  ngmoco:)   –  ngBuilderの開発   –  一部ngGoのモジュール  •  日本   –  ngGoのモジュール   –  ドキュメント  •  パキスタン   –  ngGoのモジュール   –  サンプルのゲーム Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 37/35
  38. 38. Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 38/35
  39. 39. ngGo/ngBuilder•  1st  &  3rd  パーティーの開発をサポート  •  シーンのフレームワークは公開してます  •  データ駆動   –  リリース後は開発の人数を減らしながら、イベントな どを定期的に行う必要あり   –  パラメータチューニングしやすく!  •  Flow  Editor   –  部品を作るのは簡単   –  さらにモジュール化しやすくして、テストや分業を   簡単に!   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 39/35
  40. 40. 開発の風景•  大きく機能で拠点を分ける  •  でもリリースは同じ場所で  •  Skypeのチャットが主なインフラ   –  家で仕事することもあるよ  :  (  •  gitを使う   –  git  flowで   –  ソースコードでコミュニケーション  •  ドキュメントはSphinx   –  CommonJSドメイン作った   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 40/35
  41. 41. ngCoreのデバッグ・開発環境 Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 41/35
  42. 42. •  デバッグ   –  デバッグメニューをゲームにつける   •  パラメータ変更   •  カットシーンを再生   –  Android実機用のデバッガー   •  ngBuilderからデバッガ起動。プロファイラも。   –  Flash環境   •  ブラウザのJavaScriptデバッガが利用可能   •  一番お手頃で便利   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 42/35
  43. 43. デバッグとテスト•  デバッグメニュー   –  サーバにデバッグ用ページがあり、それをアクセス  •  ユニットテスト   –  サーバ側はTest::More  (Perl)   –  クライアント側はJasmine   •  ngCore非依存にしてnode.jsで実行とか   •  ngCore用テストランナーも作ったよ   –  ngCore本体は、node.js+Jasmine   •  実機で走らせて結果をnode.jsで集約   •  国内で発売された実機はほぼテスト   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 43/35
  44. 44. ngCoreを触ってみるには?•  下記のサイトでSDKと、ngGo/Builderが   ダウンロードできます  •  日本語の開発情報も充実しています https://developer.mobage.com Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 44/35
  45. 45. 今後のngCore•  本体の機能拡張も行われます!   –  パフォーマンスアップ   –  3D対応、HTML5への対応  •  開発効率の向上   –  ngServer   •  JavaScriptでゲームサーバ   –  ngBuilder/ngGo   •  さらに積極的に開発していきます Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 45/35
  46. 46. まとめ•  大規模JavaScriptゲーム開発   –  分割しやすい構造にして部品ごとに作りこみ  •  地球規模JavaScript開発   –  JavaScriptの大規模になりつつあるゲーム開発をサ ポートする環境づくり  •  テスト・デバッグ   –  Jasmine  +  More::Test   –  まだ改善の余地があるので改善していきます   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 46/35

×