0
JavaScript                                            	  Vol.2	 (2011/8/23)	                •                             ...
TwiQer:	  @shibukawa	                                                                       •                   	         ...
•  Android                                          iOS               ngCore               	     Copyright	  (c)	  1999-­‐...
•  JavaScript                                                                                                             ...
•  JavaScript                                                                                                             ...
•  JavaScript                                                                                                             ...
Build	                                                                      Server	                                       ...
•                          	                                                                             	  	  	          ...
•                                               1   js                                 	                                  ...
•                 	                                                                      •                 	              ...
mobage	                                                                      Dev	  site	                                  ...
•      Bake                                 	                                                 •                           ...
•    mobage                                 	                                                                             ...
mobage	                                                                      Dev	  site	                                  ...
•      Bake                                   	                                                 •      iAP                ...
•      Appstore                    	                                                                                 •    ...
•                                                        	       –                                                        ...
•                                       	       –  Box2D                                         	  •                     ...
•          	  •                                          /                                       	  •                     ...
var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageLi...
var GL2 = require(“./NGCore/Client/GL2”).GL2;                                                 •    CommonJS       	  var C...
var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageLi...
var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageLi...
var GL2 = require(“./NGCore/Client/GL2”).GL2;var Core = require(“./NGCore/Client/Core”).Core;var MainLoop = Core.MessageLi...
                                                                                        	                                 ...
new	  GL2.Sprite();	                                                                                                     i...
new	  GL2.Sprite();	                                                                                                     i...
new	  GL2.Sprite();	                                                                                                     i...
“71818741285187013897431”	                                                                                      EmiQer    ...
•           •           • Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   30/35
•                                                      SDK                                      	  •                      ...
Copyright	  (c)	  1999-­‐2011	  DeNA	  CO.,Ltd.	  All	  rights	  reserved.	   32/35
•                                                                                                            	       –    ...
•                   (Flash/Android                                                                 emu/iOS	  Sim)	  •  Jav...
•  ngCore                                                                                                                 ...
•  ngCore                                            	       –                                                            ...
Upcoming SlideShare
Loading in...5
×

JavaScriptゲーム制作勉強会

3,943

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,943
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
18
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "JavaScriptゲーム制作勉強会"

  1. 1. JavaScript  Vol.2 (2011/8/23) •    •    •  SG SP   •  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 1/35
  2. 2. TwiQer:  @shibukawa •    –  →DeNA   –    •    –  SphinxUsers.jp   •    –  XP   –  Python ( )   •    –  IT   ( )   –  Python   ( )   –    ( )   –    ( )   :   web Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 2/35
  3. 3. •  Android iOS ngCore Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 3/35
  4. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 17. •    –  API   –  2D → 3D   –   •    –  BGM/SE  •  UI   –  WebView  etc  •    –  XHR   Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 17/35
  18. 18. •    –  Box2D  •    –  Key/Value  •    –    –  Observer   –  MD5/SHA  •    –    Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 18/35
  19. 19. •   •  /  •   •   •  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(); •  UpdateEmiQer   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({ •  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. 25.       ( ) (V8/JavaScriptCore) Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 25/35
  26. 26. new  GL2.Sprite();   i.setImage();   i.setPosion();       ( ) (V8/JavaScriptCore) Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 26/35
  27. 27. new  GL2.Sprite();   i.setImage();   i.setPosion();       ( ) (V8/JavaScriptCore) “71818741285187013897431” Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 27/35
  28. 28. new  GL2.Sprite();   i.setImage();   i.setPosion();         ( ) (V8/JavaScriptCore) “71818741285187013897431” Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 28/35
  29. 29. “71818741285187013897431” EmiQer   (Box2D) onUpdate  {             }       ( ) (V8/JavaScriptCore) Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 29/35
  30. 30. •  •  • Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 30/35
  31. 31. •  SDK  •  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 31/35
  32. 32. Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 32/35
  33. 33. •    –    –  3D HTML5  •    –  ngServer   •  JavaScript   –  ngBuilder   •    –  ngGo   •    Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 33/35
  34. 34. •  (Flash/Android emu/iOS  Sim)  •  JavaScript  •   •  GUI  Layout Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 34/35
  35. 35. •  ngCore   –  ngCore 1/3  •    –    –  2D   –    –  Texture  Packer 9   –  Flash   –    –  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 35/35
  36. 36. •  ngCore   –    –   •    –  +JS   –   •  Copyright  (c)  1999-­‐2011  DeNA  CO.,Ltd.  All  rights  reserved. 36/35
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×