Desenvolvimento de Jogos: Uma pequena abordagem lógica

Quem que já tem uma certa bagagem na área de desenvolvimento de softwares sabe que desenvolver um sistema vai muito além do código.

Decorar comandos e aprender conceitos básicos de uma linguagem de programação é a parte 'fácil' da jornada.

A situação começa a se tornar realmente desafiadora quando se trata de aprender algorítimos, regras de negócios, design patterns, estruturas de dados, entre outros conceitos e padrões mais avançados.

Partindo de um princípio lógico, o desenvolvimento de jogos, por mais simples que sejam, é uma porta de entrada para se aprender e compreender diversas técnicas e aprofundar em conceitos de uma determinada linguagem (No caso deste artigo, o Javascript).

Participando do Bootcamp "Potência Tech iFood - Desenvolvimento de Jogos" tive o primeiro desafio: Desenvolver um jogo baseado no icônico "Detona Ralph".

Fiquei bastante empolgado com o projeto e dediquei algumas horas na implementação de algumas funcionalidades além do projeto base apresentado pelo professor Felipe Aguiar (Sem querer 'puxar sardinha', mas, um excelente professor).

Este projeto teve uma importância muito grande no meu aprendizado com relação à lógica, e uso de recursos de HTML, CSS e Javascript.

Pude aprofundar um pouco mais na interação de Javascript com elementos de HTML e, nas transições de telas, manipulação de CSS com JS.

Abaixo seguem alguns prints de telas do jogo:

A tela principal conta com um botão de opções para controlar o volume da trilha sonora e do efeito de som do jogo.

Há uma trilha sonora que toca quando a página do jogo é aberta. Acontece que nem sempre o auto-play funciona devido á uma limitação do Google Chrome.

Esta limitação foi colocada propositalmente devido ao abuso de alguns ADs que abusavam do auto-play de audio sem o consentimento do usuário. Mais detalhes sobre esta limitação podem ser encontrados aqui.

Tela de opções:

Na tela do 'Game Play' foram feitas pequenas implementações com relação a 'perda de vidas' quando se erra o clique.

Ao perder as 3 'vidas' disponíveis o jogo exibe uma tela de 'Game Over' mostrando o total da pontuação

Fiquei bastante empolgado com este projeto, ainda que seja bem simples.

Pude aprender um pouco mais sobre HTML, CSS e JS.

Pretendo continuar trabalhando neste game em um futuro próximo e implementar um esquema de níveis de dificuldade e alguma outra ideia que surgir até lá.

O código completo se encontra no Github: https://github.com/diegojunio/game-detona-ralph-javascript.git

Uma breve história

Minha curiosidade, se tratando de desenvolvimento de jogos, vem de décadas atrás. No entanto, lá no início, o acesso à internet era bem escasso, além de custoso.

Cheguei a arriscar algo programando em MS-DOS no velho QBasic, uma versão melhorada do, ainda mais antigo, Basic (Só os vovôs do T.I. saberão do que estou falando [risos]). Mas, infelizmente, não tinha um norte.

Pra dificultar ainda mais, tudo era feito via linha de comando (lines, circles, dots, etc). Não havia interface gráfica como hoje em dia.

Me lembro de uma ocasião em que, pra desenhar uma pequena nave utilizei dezenas de linhas de códigos usando os comandos gráficos que o QBasic dispunha, juntando tudo nas devidas coordenadas até formar a figura da nave.

Depois de feito era preciso usar alguns comandos (que já nem me lembro) para 'salvar' os gráficos em uma área da memória de vídeo e fazer uma call na hora de desenhar na tela do jogo (era um trabalho bem árduo... 😥)

Hoje muito se fala em Alta Definição (HD). No QBasic o modo gráfico que oferecia uma maior gama de cores (256 cores) rodava em 320x240.

Uma amostra da tela do QBasic:

Apesar dos desafios em me divertia bastante. Foi uma época em que dei meus primeiros passos na área de programação.