O documento discute técnicas para desenvolvimento de jogos na web, incluindo uso de HTML5, CSS e JavaScript para criação de jogos, engenharias de jogos populares, implementação de loops de jogo, manuseio de eventos, sprites, física básica e uso de WebGL.

1. técnica de
desenvolvimento de jogos
@andrewsmedina

2. wtf is andrews medina?
cobrateam founder
admin djangobrasil
desenvolvedor globo.com

3. e vocês?

4. games x html5
html5 = css + js + html
canvas mais poderoso
css transform, transictions, animation
js mais poderoso (device orientation, etc)

5. games x web

6. engines
https://github.com/bebraw/jswiki/wiki/Game-
Engines
64+

7. games famosos?
http://chrome.angrybirds.com/

8. game loop
while (true) {
// acoes
}

9. game loop
setInterval(function(){
//acoes
}, 1000);

10. game loop
setInterval(function(){
//atualizacoes
}, 1000/12);

11. FPS
var FPS = 12;
setInterval(function(){
//atualizacoes
}, 1000/FPS);

12. eventos
tradicional
pooling

13. display, imagens e
resolução

14. tiles/sprites

15. sprites - css
background-image
background-position
http://www.alistapart.com/articles/sprites

16. layers
z-index

17. física
https://github.com/andrewsmedina/physics

18. física - velocidade
x += x_velocity;

19. física - aceleração
x_velocity *= 0.99;
x += x_velocity;

20. física - colisão
distância entre 2 pontos

21. física - colisão
detecção a partir da área de um polígono

22. física - gravidade

23. física
http://box2d.org/

24. física
http://box2d-js.sourceforge.net/

25. física
http://labs.skookum.com/demos/
barcampclt_physics/

26. bônus -webgl
http://www.chromeexperiments.com/webgl

27. técnica de
desenvolvimento de jogos
@andrewsmedina