Games Design: Utilizando o Design Thinking para desenvolver o seu game.

O foco do post de hoje é falar sobre o planejamento estratégico para desenvolvimento do seu game. Normalmente no desenvolvimento de um produto é usado as ferramentas de Design Thinking para sua elaboração, do qual você pode saber mais em: Clique Aqui. Resumindo, o Design Thinking é um conjunto de métodos e processos utilizados para identificar e abordar problemas, com o qual se gera um pensamento criativo e que pode ser usado na criação de games ou aplicativos para o nosso caso, afinal eles são voltados para os usuários ou para resolução de suas problemáticas.

Usaremos como base o Game Design Canvas no nosso processo criativo de hoje, no qual o arquivo fonte encontra se no seguinte link do GDrive: Clique Aqui.

Como podemos ver acima, em cada um desses campos são explicitados pontos chaves com algumas perguntas ou problemáticas que você deve responder e que posteriormente irão nortear o desenvolvimento do seu game:

• Nome do Game: esse é o campo para colocar o nome do jogo que está sendo desenvolvido. Esse nome pode mudar por diversas vezes.
• Equipe: aqui são inseridos os integrantes da equipe que está desenvolvendo o projeto.
• Ícone do Game: todo aplicativo (game) tem um ícone característico que é desenvolvido em uma ferramenta de desenho, sendo esse o espaço para o seu.
• Data: data de realização do preenchimento do Game Design Canvas.
• Versão: qual a atual versão em que se encontra o seu jogo? Ou atual versão do planejamento?
• Jogabilidade: basicamente é a definição de que tipo de jogo você irá construir: um FPS, um MOBA, um MMORPG, um jogo de esportes, dentre outros. Deve ser analisado se irá ter um plano de fundo com história que devem ser escritas usando um diagrama.
• Plataforma: é muito importante definir qual a plataforma em que seu jogo irá ser implementado. É preciso pensar bem a escolha da plataforma, pois pode gerar um árduo trabalho caso ela seja mais complexa, não conseguir executar o que você precisa caso ela seja simples demais ou ainda não dar conta de atender o público-alvo caso ela rode apenas em uma plataforma e que seu público-alvo prefira outras.
• Linguagem: qual a linguagem de programação utilizada para a construção do seu jogo?
• Preço: quanto custará o seu jogo para o público? Gratuito ou com opção de monetização?
• Orçamento: quanto a equipe irá gastar para produzir o jogo? Considere horas utilizadas pela equipe como despesas também.
• Games Existentes: quais outros jogos já existentes fazem o que está sendo proposto ou algo parecido? Existe alguma inovação presente no jogo da equipe?
• Conceito: é um esboço de um roteiro que seu jogo terá onde devem estar presentes alguns parágrafos sobre a história, os personagens, o cenários, a jogabilidade, dentre outros elementos que irão dar um resumo sobre o que o seu jogo irá oferecer. Você pode usar a possibilidade da jornada do herói (está em anexo no GDrive) que é uma fórmula usada em roteirização de histórias para guiar o desenvolvimento de um personagem.
• Personagens: basicamente deve ser descrito tudo referente ao(s) personagem(ens), como é controlado, ele é único ou pode ter mais do que uma opção, quais suas atividades e funções dentro do game.
• Fluxo do Jogo: você deve preencher como será a evolução do personagem, quais desafios ele terá, quais as recompensas que ele irá obter e se terá um sistema de pontos, conquistas, dentre outras possibilidades.
• Controle: obviamente nesse campo você vai definir tudo relacionado ao desenvolvimento do controle, seja ela para um PC, console ou celular. Será feita a ligação com a movimentação do jogador no game e a possibilidade de movimentos ou poderes especiais.
• Interface: aqui deve ser construído um geral relacionado a interface do game, disposição de informações, minimapas, tudo relacionado aos planos de fundo e músicas de ambiente e ação.
• Cutscenes, bônus material Comps: em um game é muito utilizado a opção de cutscenes que são cenas que mostram o desenrolar de uma ação que não é executada pelo jogador. Elas tem o carácter mais informativo ou transitório e devem ser bem planejadas para não quebrar o fluxo do game. Ainda é necessário pensar em como prender o jogador para que ele jogue novamente o game, podendo adicionar novas rotas pro game ou mesmo alguns segredos que ainda não foram descobertos.
• Mundo do Jogo: você deve responder onde é o mundo desse game. O que nele atrai o jogador e o que tem em comum com nosso mundo ou que é totalmente diferenciado do nosso. Os diversos cenários do game devem se conectar e como isso ocorre?
• Chefe e Inimigos: Um jogador sempre estará jogando contra alguém, podendo ser um outro player (PVP) ou contra a IA do game (PVE). Em ambos os casos, é necessário ambientar bem o adversário, construir bem seus poderes e sua IA (caso seja PVE) e deixar balanceado para ele não ficar forte ou fraco demais.
• Mecânicas e Poderes: Além do balanceamento de poderes (aqui exige bastante Matemática e você pode conferir um post sobre isso: Clique Aqui), é necessário descrever como jogador obtém esse poderes, se existe uma progressão e a temática deles devem combinar com o estilo do jogador, por exemplo, se for um MMORPG, fica estranho você dar poderes da luz para um zumbi, a não ser que você escreveu um enredo focado na redenção dele.
• Ideias Descartadas: nesse campo devem ser inseridas todas as ideias que não serão utilizadas e irá funcionar como um legado. Nada impede de alguma dessas ideias descartadas voltar a ser utilizada novamente.

Se o seu grupo de trabalho conseguir responder a esses questionamentos do Canvas de Design de Games, irá notar que os direcionamentos do seu game ficarão mais claros e que ajustes no decorrer na construção do game serão menores do que se fizesse sem qualquer planejamento. Deixe nos comentários um pouco do que sentiu ao desenvolver esse planejamento e até a próxima!

Pygames: Animando o pulo do seu personagem

Continuando a sequência de posts sobre animações (https://vemfazermatematicaegames.blogspot.com/2020/06/pygames-animando-os-movimentos.html), hoje iremos abordar como inserir a opção do pulo, na programação já desenvolvida.

A primeira modificação é relacionada a repetição (while running) já construída que terá dois estados: ANDANDO (focada no personagem que se movimentar para a direita e a esquerda) e PULANDO (onde o personagem irá pular com a tecla espaço).

pressionado = 0 ANDANDO = 0 PULANDO = 1 acao = ANDANDO tp = 0.7 running = True while running: if acao == ANDANDO: for event in pygame.event.get(): if event.type == pygame.KEYUP: if event.key == pygame.K_SPACE: pulo = 2 if event.key == pygame.K_LEFT: deltaX = 0 if event.key == pygame.K_RIGHT: deltaX = 0 if event.type == pygame.KEYDOWN: if event.key == pygame.K_SPACE: acao = PULANDO t = 0 deltaX = 0 if event.key == pygame.K_LEFT: deltaX = -5 pressionado = 1 if event.key == pygame.K_RIGHT: deltaX = 5 pressionado = 2 if event.type == pygame.QUIT: running = False xpos = xpos + deltaX ypos = y0 if xpos < -25: xpos = WIDTH -1 if xpos > WIDTH: xpos = 0 if deltaX != 0 : itera = itera + 1 elif acao == PULANDO: t = t + 1 if t >= tp*FPS: acao = ANDANDO ypos = y0 - tp*FPS*t + t*t)

Observando o código acima, temos que a ação normal é estar ANDANDO (if) que executa as programações já vistas anteriormente. Porém, quando a tecla e Espaço é apertada, a ação é modificada para PULANDO (elif) que irá executar a programação do pulo. Note que com essa construção, o personagem pode só pular ou só andar, nunca as duas coisas ao mesmo tempo.

A programação do PULANDO possui uma fórmula adaptada da física (fórmula do lançamento oblíquo no eixo Y), que pode ser vista abaixo:

Essa fórmula física foi adaptada para o contexto do game, já que em um game é o programador que define qual a velocidade do personagem e qual a gravidade existe no modelo. Por isso temos valores baseados em tp (tamanho do pulo) e no FPS, pois existe uma relação entre a atualização de frames e os valores obtidos na equação. Você conseguiria descobrir o que é? Uma dica é que temos uma equação de 2º grau e que suas raízes tem influência na posição do pulo do personagem. 

t = t + 1 if t >= tp*FPS: acao = ANDANDO ypos = y0 - tp*FPS*t + t*t

Finalizando, você deve ter notado que o loading das imagens foi simplificado, ficando apenas as imagens em uma direção (direita) e ao usar o comando "pygame.transform.flip" é possível rebater a imagem como em um espelho, conseguindo-se a sequência de imagens para o lado esquerdo também.

screen.fill(GRAY) indexImg = int(itera/int((6*FPS)/60))%9 if deltaX > 0: screen.blit(imagesdireita[indexImg], (xpos,ypos)) elif deltaX < 0: screen.blit(pygame.transform.flip(imagesdireita[indexImg], True, False), (xpos,ypos)) elif deltaX == 0 and pressionado == 1: screen.blit(pygame.transform.flip(imagesdireita[indexImg], True, False), (xpos,ypos)) elif deltaX == 0 and pressionado == 2: screen.blit(imagesdireita[0], (xpos,ypos)) pygame.display.flip() clock.tick(FPS)

Com isso finalizamos esse post e o código aqui apresentado pode ser encontrado em: https://drive.google.com/drive/folders/1dC7GSPAVSizvtDhA1HMEHrkXSIbHz8UP?usp=sharing. Agora é a sua vez de customizar esse código para o seu game e adicionar novas funcionalidades. Seria possível um personagem andar e pular ao mesmo tempo? E se tivermos mais do que um personagem? Nos comentários abaixo conte um pouco da sua experiência e até a próxima!

Pygames: Animando os movimentos direcionais de um personagem

No post anterior (https://vemfazermatematicaegames.blogspot.com/2020/06/pygames-criando-animacoes.html) construímos uma animação pautada em diversas posições de um personagem que ficam se repetindo. Hoje iremos acrescentar as setas direcionais (direita e esquerda) para controlar o movimento desse personagem animado. Você pode conferir os arquivos e a programação aqui utilizados na seguinte pasta do GDrive: https://drive.google.com/drive/folders/18Tr4eOVSye8fzX8lNzHH_eqG_J9-DL8_?usp=sharing.

O primeiro detalhe é que precisamos duplicar as imagens do personagem que andava para direita e agora, temos de ter a opção para a esquerda (isso pode ser realizado usando o InkScape com a opção "inverter objetos horizontalmente [tecla H]). Na programação teremos o loading com os seguintes códigos:

imagesdireita = [] imagesdireita.append(pygame.image.load("direita1.png")) imagesdireita.append(pygame.image.load("direita2.png")) imagesdireita.append(pygame.image.load("direita3.png")) imagesdireita.append(pygame.image.load("direita4.png")) imagesdireita.append(pygame.image.load("direita5.png")) imagesdireita.append(pygame.image.load("direita6.png")) imagesdireita.append(pygame.image.load("direita7.png")) imagesdireita.append(pygame.image.load("direita8.png")) imagesdireita.append(pygame.image.load("direita9.png")) imagesesquerda = [] imagesesquerda.append(pygame.image.load("esquerda1.png")) imagesesquerda.append(pygame.image.load("esquerda2.png")) imagesesquerda.append(pygame.image.load("esquerda3.png")) imagesesquerda.append(pygame.image.load("esquerda4.png")) imagesesquerda.append(pygame.image.load("esquerda5.png")) imagesesquerda.append(pygame.image.load("esquerda6.png")) imagesesquerda.append(pygame.image.load("esquerda7.png")) imagesesquerda.append(pygame.image.load("esquerda8.png")) imagesesquerda.append(pygame.image.load("esquerda9.png"))

Para fazer que o personagem se movimente utilizamos as opções já vistas em post anteriores (event.type == pygame.KEYDOWN e event.type == pygame.KEYUP) com o uso do deltaX igual a zero quando a tecla está levantada e valor igual 5 ou -5 (direita e esquerda) para fazer o personagem deslizar pelo eixo X (Y está fixo nesse exemplo) e o "xpos" faz o calculo do quanto foi deslocado pelo eixo X:

for event in pygame.event.get(): if event.type == pygame.KEYUP: if event.key == pygame.K_LEFT: deltaX = 0 if event.key == pygame.K_RIGHT: deltaX = 0 if event.type == pygame.KEYDOWN: if event.key == pygame.K_LEFT: clock.tick(FPS) deltaX = -5 pressionado = 1 if event.key == pygame.K_RIGHT: clock.tick(FPS) deltaX = 5 pressionado = 2 xpos = xpos + deltaX ypos = ypos + deltaY

A seguir temos uma sequência de "if" (se) que delimita algumas situações:

if deltaX != 0 : itera = itera + 1 if xpos < -25: xpos = WIDTH -1 if xpos > WIDTH: xpos = 0 screen.fill(GRAY) indexImg = int(itera/int((6*FPS)/60))%3

O primeiro "if deltaX != 0" significa que se o deltaX é definido como zero", então ele inicia o cálculo de iterações responsáveis pelas animações (fica correndo direto) e tem ligação direta com o "indexImg" (fórmula para iteração das imagens que foram carregadas). Temos dois "if" (xpos maior e menor do que o tamanho da tela) responsáveis por delimitar o máximo que o personagem anda na tela. Agora vem a parte mais importante, a sequência de casos possíveis de deslocamento na tela e o que fazer em cada situação, que estão escritas no código abaixo:

elif deltaX < 0: screen.blit(imagesesquerda[indexImg], (xpos,ypos)) elif deltaX == 0 and pressionado == 1: screen.blit(imagesesquerda[0], (xpos,ypos)) elif deltaX == 0 and pressionado == 2: screen.blit(imagesdireita[0], (xpos,ypos)) pygame.display.flip() clock.tick(60)

Quando temos o valor do delta maior ou menor que zero (estritamente) significa que estamos apertando as teclas direcionais e movimentando o personagem para direita ou esquerda, por isso logo em seguida temos o código do "screen.blit" responsável pelas imagens da direita ou da esquerda, conforme a tecla que foi apertada. Mas quando for zero, significa ausência de tecla apertada e temos duas possibilidades: ter uma imagem específica carregada na posição de frente ou um contador de estado que guarde qual foi a última tecla utilizada (esse é a situação que utilizaremos no nosso exemplo). Com os dois "elif deltaX == 0 and pressionado == " temos além da verificação do deltaX igual a zero, a verificação do estado "pressionado", que se observamos no código das teclas acima, quando o valor de "pressionado" é igual a 1 era na tecla esquerda e 2 na tecla da direita, o que permite que se guarde essa memória e, exiba na tela o "screen.blit" de acordo com a posição correta que acabou de ser teclada. 

Agora é a sua vez, procure inserir novas imagens de outros personagens e tente fazer as adaptações. E se precisar utilizar outras teclas, como proceder? Deixe nos comentários suas descobertas e até a próxima.

Pygames: Criando animações

Animações são uma parte essencial do repertório de quem pretende construir um game e nisso está embutido uma série de quesitos, que você pode conferir no vídeo a seguir feito pela RIOT (desenvolvedora do League of Legends):

O vídeo acima tem diversos cuidados a se ter com a construção de uma animação que devem ser levadas em conta, mas vamos nos focar em um pequeno recorte desse mundo vasto da animação. No post de hoje vamos tratar de como inserir um conjunto de imagens para formar uma animação em Python (biblioteca Pygames).

A primeira ação é obter uma sequência de imagens (de preferência em PNG para poder sobrepor o cenário de fundo), que quando organizadas em um loop (repetição) possam dar a sensação de movimento (animação). Veja o exemplo abaixo, no qual temos a disposição um personagem em diversas posições, cuja animação irá resultar em uma caminhada:

O produto final você pode encontrar no seguinte link: https://drive.google.com/drive/folders/18SZCn-IYdvgMIRLNZDHc-SaSdFCfMts7?usp=sharing. Ao observar a programação, percebemos que além das programações que já costumam ser usadas, tivemos o acréscimo de novas, a começar pela responsável pelo carregamento das imagens, que é a "images.append(pygame.image.load("nomedoarquivo.extensão"))" (destacada em verde abaixo). Ela aparece várias vezes para cada imagem a ser carregada e na ordem que deve aparecer. Além disso, é necessário ter uma iteração baseada no contador "itera" que irá permitir o loop das imagens uma após a outra (destacado em vermelho) para gerar o movimento. E por fim, o comando "blit (nomedoarquivogenérico, (posiçãoX, posiçãoY))" para mostrar na tela a animação (destacado em azul).

Você pode usar esse layout de programação para sua animação, bastando apenas adaptar a quantidade de imagens carregadas e o valor na fórmula de iteração (substituir o %8 pelo valor correspondente a quantidade de imagens) para a nova situação. Bora testar isso? Conte nos comentários abaixo quais foram sua dificuldades e como conseguiu resolver. Até a próxima!

Pygames: Construindo um game PVP com timer.

Em primeiro lugar, caso você não saiba o que é PVP, a sigla significa Player versus Player e se refere a uma modalidade de jogos eletrônicos multijogador na qual jogadores enfrentam-se mutuamente (em português Jogador contra Jogador JxJ). Vamos construir um game em Python usando o modelo construído no post anterior (http://vemfazermatematicaegames.blogspot.com/2020/05/pygames-construindo-inimigos-com.html) e o tornando um game PVP acrescentando dois elementos: teclas de entrada extras pro segundo jogador e um game over com contador de tempo. O objetivo do game será de que dois jogadores, cada um com seu personagem e por turnos, possam "caçar" o outro. Vence quem ficar mais tempo sem ser caçado (colisão no game).

Vamos ao primeiro elemento, para acrescentar teclas do teclado para um segundo personagem basta replicar os códigos já construídos modificando a entrada final dos comandos, como por exemplo "pygame.K_LEFT para pygame.K_a" (destacado em azul abaixo), onde setamos a tecla a para executar alguma ação. Outro detalhe é acrescentar os pontos X e Y iniciais diferentes do outro personagem (destacado em verde abaixo) pois se eles começarem sobrepostos teremos game over automático (esse valor de coordenada devem ser inserido na definição dos X e Y dos personagens). Além disso, vai ser necessário replicar alguns códigos referentes ao movimento e a colisão, conforme imagem abaixo:

Agora a novidade, vamos implementar um contador de tempo de modo que ele apareça na tela quando houver um Game Over (ele acontece quando um dos personagens colide contra o outro). O código responsável por isso, você confere abaixo:

while not fgExit: segundos = (pygame.time.get_ticks()-cronometro)/1000 for event in pygame.event.get(): if colidiu(): tela.fill((0,0,0)) tela.blit(textoperdeu, (150,300)) tela.blit(textoperdeu2, (150,350)) rsegundos = fonte.render(str(segundos), True, (255,0,0)) tela.blit(rsegundos, (150,400)) pygame.display.update() time.sleep(4) pygame.quit()

Como vemos acima, temos uma definição do segundos logo após o "while" que será o contador por meio da fórmula que vai gerando os valores do cronômetro (os valores vão sendo mostrados no shell do Python por meio do comando "print"). Na parte do código responsável pela colisão, existe o código "fonte.render" responsável por tornar esses valores numéricos como texto, para em seguida ser expresso pelo comando "tela.blit". Caso não faça essa renderização, o Python não consegue expressar na tela o valor numérico do contador. 

Com isso finalizamos o post de hoje, no qual você pode encontrar o código-fonte em: https://drive.google.com/drive/folders/1IzRBVFoil3PL1GMbhwj2Yh3L10Cbz48K?usp=sharing. Existe diversas possibilidades de ir melhorando essa versão de um game PVP, a citar exibir em tempo real o cronômetro e inserir a possibilidade dos turnos entre jogadores automaticamente sem que o jogo feche e que ao final mostre automaticamente quem venceu, dentre outras possibilidades. Agora é com você, construa seu game com a modalidade PVP incluída e compartilhe entre seus amigos. Até a próxima!