Vamos Criar um Jogo?

O Game Loop é o que permite que o jogo continue sendo atualizado e renderizado a cada frame. Seria como um batimento cardíaco, que a cada batida realiza um conjunto de operações de atualização e renderização. A melhor forma de visualizar isso é através de um fluxograma, veja a Imagem 1 . Imagem 1 Perceba na Imagem 1 que entre início e fim temos operações a serem realizadas, essas operações podem ser de atualização e/ou renderização ou outra qualquer. Ao chegar ao fim, começa tudo de novo, realizando as mesmas operações de atualização e/ou renderização ou outra qualquer. A Listagem 1   mostra uma implementação de Game Loop em JavaScript. Esta implementação conta com três métodos, loop , update e render , sendo que os mesmos serão invocados "infinitamente". Listagem 1 Note que na Listagem 1   requestAnimationFrame é quem fará o trabalho de invocar o método loop , que por sua vez invocará os métodos  update e render , respectivamente. Em cada ...

Frames Per Second(FPS) é um termo utilizado para determinar a quantidade de quadros ou animações renderizados em um segundo. Em jogos digitais, 60FPS é uma boa taxa de renderização, sendo 30FPS um mínimo aceitável para manter uma qualidade razoável no jogo. Um jogo que opera a uma taxa de 60FPS implica que a cada segundo temos 60 frames renderizados. Ao dividirmos 1 por 60, obtemos aproximadamente 0,0166666, isso significa que cada frame precisa ser renderizado em apenas 0,0166666 de segundo, é um tempo muito pequeno, então para facilitar a vida é melhor trabalhar com uma outra unidade de tempo, o milissegundos. 1 segundo equivale a 1000 milissegundos, o que significa que 0,0166666 de segundo é aproximadamente igual a 16,666666 Milissegundos, basta multiplicar 0,166666 por 1000. Então podemos afirmar que em um jogo a uma taxa de 60FPS tem aproximadamente 16,66666 Milissegundos para renderizar cada frame. A Listagem 1 mostra a implementação de FPS em JavaScript. Listagem 1 ...

Bounding Box conhecido como bbox é uma técnica em que é feito o uso de retângulos para detectar colisões. Nos jogos 2D, essa técnica consiste em delimitar a área dos objetos do jogo através de retângulos, conhecido como retângulos de colisão. Existem dois tipos de bbox , o orientado e o alinhado aos eixos. O primeiro conhecido como obbox(Oriented Bounding Box) trata de colisões em que o objeto esteja rotacionado. Já o segundo tipo, conhecido como aabb(Axis-Aligned Bounding Box) trata de colisões em que o objeto não está rotacionado. Nesse artigo trataremos do aabb . A Imagem 1 mostra um cenário em que o jogador tenta coletar uma moeda. Imagem 1 criada através das imagens disponibilizadas por kenney , surt e por Tio Aimar . Acesso em 07/12/2017. Note a presença dos retângulos de colisão no personagem e nas três primeira moedas. Na maioria das vezes, um objeto com apenas um retângulo de colisão será suficiente, mas quando não for, poderá ser utilizado mais retângu...