JavaScriptゲーム制作勉強会

  • 3,744 views
Uploaded on

 

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
3,744
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
17
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. JavaScript  Vol.2 (2011/8/23) •    •    •  SG SP   •  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 1/35
  • 2. TwiQer:  @shibukawa •    –  →DeNA   –    •    –  SphinxUsers.jp   •    –  XP   –  Python ( )   •    –  IT   ( )   –  Python   ( )   –    ( )   –    ( )   :   web Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 2/35
  • 3. •  Android iOS ngCore Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 3/35
  • 4. •  JavaScript  •    –    •  Android iOS   •  Flash HTML  5   –    •  /app,apk   –  API   •  XNA API   –  API   •  iOS/Android   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 4/35
  • 5. •  JavaScript  •    –    •  Android iOS   •  Flash HTML  5   –    •  /app,apk   –  API   •  XNA API   –  API   •  iOS/Android   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 5/35
  • 6. •  JavaScript  •    –    •  Android iOS   •  Flash HTML  5   –    •  /app,apk   –  API   •  XNA API   •  JavaScript   •  –  API     •  •  iOS/Android   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 6/35
  • 7. 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. 7/35
  • 8. •            •  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. 8/35
  • 9. •  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. 9/35
  • 10. •    •  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. 10/35
  • 11. mobage   Dev  site   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. 11/35
  • 12. •  Bake   •  mobage   Dev  site   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. 12/35
  • 13. •  mobage   •    •  mobage   Dev  site   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. 13/35
  • 14. mobage   Dev  site   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. 14/35
  • 15. •  Bake   •  iAP   •  APP   → appstore mobage   Dev  site   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. 15/35
  • 16. •  Appstore   •  mobage   Dev  site   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. •    –  API   –  2D → 3D   –   •    –  BGM/SE  •  UI   –  WebView  etc  •    –  XHR   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 17/35
  • 18. •    –  Box2D  •    –  Key/Value  •    –    –  Observer   –  MD5/SHA  •    –    Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 18/35
  • 19. •   •  /  •   •   •  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 19/35
  • 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. 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. 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. 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(); •  UpdateEmiQer   Core.UpdateEmitter(loop, loop.onUpdate);  } Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 23/35
  • 24. var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageListener.subclass({ •  inialize/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.       ( ) (V8/JavaScriptCore) Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 25/35
  • 26. new  GL2.Sprite();   i.setImage();   i.setPosion();       ( ) (V8/JavaScriptCore) Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 26/35
  • 27. new  GL2.Sprite();   i.setImage();   i.setPosion();       ( ) (V8/JavaScriptCore) “71818741285187013897431” Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 27/35
  • 28. new  GL2.Sprite();   i.setImage();   i.setPosion();         ( ) (V8/JavaScriptCore) “71818741285187013897431” Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 28/35
  • 29. “71818741285187013897431” EmiQer   (Box2D) onUpdate  {             }       ( ) (V8/JavaScriptCore) Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 29/35
  • 30. •  •  • Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 30/35
  • 31. •  SDK  •  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 31/35
  • 32. Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 32/35
  • 33. •    –    –  3D HTML5  •    –  ngServer   •  JavaScript   –  ngBuilder   •    –  ngGo   •    Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 33/35
  • 34. •  (Flash/Android emu/iOS  Sim)  •  JavaScript  •   •  GUI  Layout Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 34/35
  • 35. •  ngCore   –  ngCore 1/3  •    –    –  2D   –    –  Texture  Packer 9   –  Flash   –    –  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 35/35
  • 36. •  ngCore   –    –   •    –  +JS   –   •  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 36/35