quinta-feira, 20 de agosto de 2020

App Design: Utilizando o Design Thinking para desenvolver o seu aplicativo.

Já vimos anteriormente um post (http://vemfazermatematicaegames.blogspot.com/2020/06/games-design-utilizando-o-design.html) falando especificamente do design de games e hoje vamos trabalhar com o App Design Canvas que tem a proposta de resolver problemas construído um aplicativo como produto final (solução). Você pode encontrar o template do App Design Canvas em: https://drive.google.com/drive/folders/1pb4t6kbBY6x8OKBX5M6gS7y0NQeVOXd7?usp=sharing .

Como podemos ver acima, em cada um desses campos são explicitados pontos chaves que você deve responder e que posteriormente irão nortear o desenvolvimento do seu aplicativo. Esses pontos vão desde responder para o que e para quem o seu aplicativo é desenvolvido, como ele será confeccionado e como será o processo de compartilhamento do mesmo. Veja abaixo a explicação de cada um dos campos:

  • Nome do App: esse é o campo para colocar o nome do aplicativo que está sendo desenhado. Esse nome pode mudar por diversas vezes.
  • Equipe: aqui são inseridos os integrantes da equipe que está desenvolvendo o projeto.
  • Icone do App: todo aplicativo 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 Canvas.
  • Versão: qual a atual versão em que se encontra o seu aplicativo? Ou atual versão do planejamento?
  • Problema: qual a problemática que a equipe está tentando resolver?
  • Descrição do App: campo destinado ao resumo do que o aplicativo faz (resumo geralmente destinado a Playstore/App Store).
  • MVP: como vai funcionar a versão mínima (versão beta) do seu aplicativo? O que é essencial estar presente nessa primeira versão? 
  • Plataforma: em qual plataforma o aplicativo roda? Android? IOS? Outras?
  • Linguagem: qual a linguagem de programação utilizada para a construção do aplicativo?
  • Preço: quanto custará o seu aplicativo para o público?
  • Orçamento: quanto a equipe irá gastar para produzir o aplicativo? Considere horas utilizadas pela equipe como despesas também.
  • Apps Existentes: quais outros aplicativos já existentes fazem o que está sendo proposto ou algo parecido? Existe alguma inovação presente no aplicativo da equipe?
  • Como encontra o App: onde o aplicativo estará disponível para o público (Playstore/App Store/redes sociais)? 
  • Público Alvo: quem são os usuários que o seu aplicativo se destina?
  • Características do App: quais as características principais do seu aplicativo?
  • Funcionalidades do App: quais funcionalidades estão embutidas no aplicativo? Procure ser mais técnico e exprimir os códigos necessários para que essas funcionalidades ganhem vida.
  • Fatores de Sucesso: liste quais fatores podem influenciar no sucesso do seu aplicativo.
  • 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.
  • Visão: como o seu aplicativo será visto no futuro por seus usuários? Ele terá updates? Quais novidades podem ser agregadas?

Se o seu grupo de trabalho conseguir responder a esses questionamentos do Canvas de Design de Apps, irá notar que os direcionamentos do seu aplicativo ficarão mais claros e que ajustes no decorrer na construção dele 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!

quarta-feira, 12 de agosto de 2020

Pygames: Construindo a tela de entrada do seu game.

O post de hoje aborda o que é necessário para construir uma tela de entrada para seu game em Python e caso você queira usar o template que será abordado aqui, acesse: https://drive.google.com/drive/folders/1W-X02WU8iPB3URivEH1NHgTV45qKIioQ?usp=sharing.

Um layout de tela inicial padrão em jogo possui pelo menos 3 botões (Jogar, Opções e Sair) e uma interface inicial em que eles estão contidos. Na programação abaixo você confere a definição usada para a escrita do texto (draw_text) na tela inicial e nos submenus:

O próximo passo é definir a construção dos botões e as opções de quando forem clicados, qual ação deve ser executada (nesse caso usamos o comando "if click:" para redirecionar para as definições que tem os comandos de cada uma das subtelas ou subprocessos). Caso seja necessário implementar mais botões, esse é um dos campos que deve ser modificado, com a definição de um novo botão (button_x=), de um "if" a mais com a definição que será executada e de um "pygame.draw.rect" para desenhar o botão. Por fim, os "draw_text" são usados para as escritas na tela e em cima dos botões (eles são colocados por último, pois precisam estar sobrepostos ao desenho do botão, caso contrário a escrita não aparece). É necessário usar valor cartesianos para posicionar as escritas na tela, o que é um bom exercício de abstração matemática.

Tendo as ações da tela inicial construída, agora é preciso definir o que acontece quando cada botão é executado. Para os botões "Jogar" e "Opções" criamos duas definições ("game" e "options") que redirecionam para uma nova tela. No caso do definição "game" (botão "Jogar") você deve inserir o código do seu game (não faremos aqui, pois iria aumentar muito os códigos e deixaria de ser um modelo didático mas, você pode encontrar aqui no blog inúmeros post sobre produção de games e acrescentar nessa definição). A definição "options" (botão "Opções") é uma tela nova onde deve ser inseridas as opções de customização do seu game (também a ser melhorada por você). E por fim a definição "exite" (botão "Sair") apresenta apenas os códigos para fechar a janela do game, que também pode ser fechado usando a tecla "ESC" (ela é usada também para voltar).

Termina-se o post com a proposição de um desafio: melhore esse template e insira o seu game desenvolvido em Python nele! Muitas melhorias como adição de plano de fundo e música, inserção de botões para tutoriais, dentre outros são possíveis. O desafio está lançado e nos vemos em breve. Até a próxima!

domingo, 2 de agosto de 2020

Pygames: Programando falas entre personagens

O post de hoje é uma continuação direta do post: https://vemfazermatematicaegames.blogspot.com/2020/07/pygames-baloes-de-fala-de-um-personagem.html que trabalhou sobre a construção de falas em um balão para um personagem. Tendo isso como base, iremos avançar para como estabelecer um diálogo entre dois (ou mais personagens), generalizando assim a possibilidade de iterações via diálogos. O arquivo .py e seus complementos aqui utilizados podem ser encontrados no  GDrive: https://drive.google.com/drive/folders/1g20jvMDz-S5ieAMFnG5HDSa1NA_bcp7i?usp=sharing.


Para iniciar, estamos trabalhando com um exemplo com dois personagens diferentes, logo vamos precisar construir duas definições de balões, que irão se diferenciar justamente pelas coordenadas cartesianas de cada personagem (Mário com x e y, Luigi com a e b):


Assim, para cada personagem que for criado, necessita-se de uma definição nova de balão, com coordenadas referentes a ele. Agora, para a construção de falas, temos uma mudança na estrutura, na qual temos listas de falas dos personagens separadas em sequências e atreladas a contadores de iteração (itera, itera2, itera3), que estão em função do "clock.tick(30)" do jogo, que nada mais é do que a taxa de atualização de frames por segundo (FPS):


Como podemos ver acima, temos um conjunto de três "if" (se) que testam os valores do "itera", "itera2" e "itera3", com um somatório de valor 1 para cada um deles após o "clock.tick(30)". Esse valores testados nos "if" são todos múltiplos de 90, pois como o FPS está fixo em 30 frames por segundo e, como queremos que as falas do exemplo durem 3 segundos, temos 30 vezes 3 que dá os valores de 90, do qual serão utilizados os seus múltiplos em cada um dos "if" (uma fala dá o valor 90, duas falas dá o valor 180, três falas dá valor 270, e assim por diante). Caso queira mudar a duração da fala, será necessário reconfigurar esses valores, exemplificando, se for para durar 5 segundos, temos 30 vezes 5, que dá 150 e os múltiplos usados serão com base nesse valor (150, 300, 450, ...).


Agora vamos entender o funcionamento dos "if" em relação aos "itera" com a ajuda da imagem acima. Na primeira vez que entra-se na sequência de "if" (1º loop), o valor do itera é igual a zero e portanto ele executa a primeira frase da "fala1" e deixa zerado os demais "itera2" e "itera3", portanto os próximos "if" não se ativam. Ele fica nesse ciclo até atingir o valor 180, que é responsável por ter realizado 3 frases da "fala1" (são as falas do Mário). Em seguida, como ele não fica mais preso no loop do "itera", passa-se para o "itera2" (2º loop) graça ao contador +1 (valor mínimo de entrada "itera2>1") e inicia as frases da "fala2" (frases do Luigi), que sempre ao final, mantem o "itera3" zerado (até o valor máximo de 360, que corresponde a 4 frases da "fala2"). O próximo passo é o "itera3" (3º loop) e caso queira-se mais frases é necessário aumentar a quantidade de "if" e de "iteraN (N sendo valores numéricos para diferenciar os itera)". Note, que esse é um método que pode ser complicado de seguir caso exista muitas frases a serem faladas pelos personagens, por isso caso queira algo mais sofisticado, precisará trabalhar com arquivos separados para falas, afim de organizar melhor seus códigos.
Com isso finaliza-se a proposta do post e agora é a sua vez de colocar a mão na massa e dar um novo upgrade no seu game. Deixe nos comentários suas impressões e descobertas e até a próxima!

quinta-feira, 16 de julho de 2020

Pygames: Balões de fala de um personagem.

No post de hoje iremos construir uma definição para a exibição de diálogos do seu personagem em forma de balões, que é um recurso muito usado em games para contar histórias. Você pode acessar o layout que será desenvolvido nesse post no GDrive: https://drive.google.com/drive/folders/1QUgJUVskPBowRY244pmsmWMfSt3xRilY?usp=sharing.


Se você observar o código, temos uma definição para o desenho da função balão (def balao(screen,text, x0,y0)) com entradas de desenho de tela, texto a ser inserido e coordenadas X e Y. Dentro da definição temos uma série de parâmetros para configuração de fonte, coloração formato e tamanho do balão de fala, dentre outros. A ideia é que você altere esses parâmetros e vá testando novas possibilidades:
   

Para que as falas aconteçam e sejam exibidas na tela, os parâmetros da definição balão devem ser satisfeitos. O primeiro é a "screen" que é exibida com o uso do "game_display" que é basicamente é o desenho do balão na tela. O segundo parâmetro são as falas, que são acionadas via clique do mouse. Para isso acontecer, temos uma listagem de falas já construídas (definição falas = ['texto']) e que por meio do contador "itera = itera + 1" na função clique, temos essa sequência de frases sendo mostradas na tela (dentro do balão). E por fim o posicionamento do balão em relação ao personagem realizado por meio das variáveis "tx" e "ty" que são atreladas ao x e y do plano cartesiano. Inclusive, nessa opção das variáveis "tx" e "ty" você pode fazer o melhor ajuste do balão em relação ao seu personagem.


Com esse post abre-se uma nova gama de possibilidades com relação a enredos e diálogos dentro do seu game. É possível ainda implementar vozes gravadas, mudar o estilo de balões, fazer o balão desaparecer depois de alguns segundos da fala, usar diferentes inputs para acionar as falas (como se fosse um filme), dentre outras possibilidades. Então mãos na massa e hora de aprimorar o seu game!

segunda-feira, 13 de julho de 2020

Pygames: Coordenando múltiplos arquivos .py

No post de hoje vamos trabalhar com a integração de múltiplos arquivos de pygames (.py), pois a medida que os códigos começam a crescer, não basta apenas organização no arquivo de programação usando-se diversos class ou definições, afinal a programação começa a ficar muita extensa e de difícil leitura. Nesse caso, podemos criar arquivos .py secundários para cada um dos personagens executáveis pelo jogador, os controlados pela IA do game (NPC), bem como diversas customizações em separado e ao final, unir tudo em um único arquivo .py principal a ser executado. O exemplo que vamos utilizar está disponível no GDrive: https://drive.google.com/drive/folders/1U-_SQhtXz0Hpq1O4UYvK1plPOW3MGcya?usp=sharing e trabalha com quatro arquivos diferentes de personagens que são gerenciados pelo arquivo "jogo.py". Além disso, a grande maioria dos códigos aqui utilizado já foram vistos nos posts anteriores e podem ser acessados usando a tag "Pygames" do blog.

Vamos usar como exemplo de uma arquivo secundário o "morcego.py". Sua estrutura é baseada na que foi construída no post sobre construção de sprites e pode ser conferida em: https://vemfazermatematicaegames.blogspot.com/2020/07/pygames-usando-o-modulo-pygamesprite.html. Se você observar os comandos na figura abaixo, irá ver que foram retirados diversos comandos responsáveis pela execução da classe Morcego, que por sua vez estão presentes no arquivo principal "jogo.py" (esse é o arquivo que une os demais). Veja as diferenças na figura abaixo:


Na comparação acima dos arquivos "sprite" (versão com um único arquivo) e do "morcego" (versão com mais de um arquivo), pode ser constatado que comandos relacionados a iniciação, execução de loop (repetição) e finalização da programação não estão mais presentes. Eles serão adicionados no arquivo geral "jogo.py" que é responsável por carregar todos os arquivos auxiliares pygames (morcego,  quadrado, caramujo, caminhante).
Agora vamos focar no arquivo principal "jogo.py" e ver um pouco da sua programação. Nos comandos de inicialização (que não estão presentes nos outros arquivos secundários) temos a presença da definição "all_sprites =  pygame.sprite.Group"  que é o módulo que será responsável pela adição de cada um dos arquivos ''.py''. Em seguida, cada um dos arquivos é carregado via uma definição (exemplificando, "cami = caminhante()", nesse caso é o arquivo "caminhante.py" que está sendo definido como "cami") para em seguida com o comando "all_sprites.add(nome da definição do arquivo)" ele seja adicionado a linha de execução de comandos. Veja abaixo o que acabamos de explicar:



No decorrer do arquivo temos os comandos relacionados a repetição (loop), entrada do teclado (inputs) e desenho execução na tela, que já foram vistos em outros post com a tag Pygames (volte neles se for necessário uma revisão). Único ponto de atenção, é a forma como o Pygames executa todos os updates gráficos de todos os arquivos. Lembra da definição "all_sprites"? Ela retorna no fim do arquivo para fazer as atualizações (all_sprites.update) e execuções na tela (all_sprites.draw), fechando o ciclo da programação:



O post de hoje encerra-se com essa incrível possibilidade de construir diferentes arquivos e unir toda a execução dele em apenas um arquivo, facilitando a organização e leitura dos códigos, afinal, quanto maior a proposta do game, maior será o tamanho do código construído. Até a próxima!

terça-feira, 7 de julho de 2020

Pygames: Usando o módulo pygame.sprite

A biblioteca Pygames da linguagem Python, tem como função trazer uma série de módulos prontos que podem ser utilizados para a construção de uma game. Hoje iremos conhecer o módulo "pygame.sprite" cuja função é reunir todas as configurações e comandos de manipulação de um objeto para a execução do mesmo dentro de um game. Basicamente nos posts anteriores já fizemos isso, mas de maneira mais simples e, a partir de agora teremos um novo grau de sofisticação que poderá substituir quando necessário os conhecimentos anteriores. Vamos usar como exemplo a animação do personagem que se move para a direita e esquerda (já construído no post: https://vemfazermatematicaegames.blogspot.com/2020/06/pygames-animando-os-movimentos.html), mas que ganha uma nova sofisticação que você pode encontrar o arquivo em: https://drive.google.com/drive/folders/1Hn5KWPGezHxi62a_rN0T5sz--86ON762?usp=sharing.


Em primeiro lugar vamos focar apenas na nova programação do módulo "pygame.sprite"(no arquivo existe um comentário com # que mostra onde inicia a parte do módulo "pygame.sprite"), pois os demais comandos já foram vistos nos posts anteriores. O módulo "pygame.sprite" está dentro de uma classe (class Caminhante) que basicamente é um organizador de um conjunto de definições que dão a identidade do sprite (isso permite criar diversas classes que poderão interagir entre si). Todas as definições são compostas de linhas de código e servem justamente para modificar alguma característica do Sprite correspondente a definição e a melhor forma de entender é justamente mudar os valores e ver o que acontece.
Na definição abaixo temos as opções correspondentes a inicialização do Sprite, tais como: adicionar imagens para a animação, posição em X e Y do sprite, ângulo e escalonamento de tamanho do sprite, dentre outras possibilidades:



Na definição abaixo temos os comandos relacionados a forma de fazer a atualização das imagens em função do FPS (formula) e com um contador (itera). Além disso, estão mostrados os comandos "xpos" e "ypos" que são relacionados a movimentação no plano cartesiano e que podem ter ligação com inputs externos ou outras programações fora da definição:



A definição abaixo é exclusiva para carregar as imagens e fazer elas aparecerem na tela:



Na definição abaixo temos os comandos relacionado ao movimento em função do "xpos" e "ypos":



A definição a seguir é relacionada a como as imagens da animação são modificadas:



Mais uma definição de carregamento (loading) de imagens que faz a checagem do arquivo:



Você não precisa mudar todos os comandos aqui listados, a grande maioria pode usar pronto e só modificar as entradas numéricas e textuais que se adequem a situação que você preferir. Existem ainda outros tipos de módulos voltados para games, como por exemplo o "sprite.group", do qual você pode entender um pouco mais acessando a documentação do Pygames: https://www.pygame.org/docs/ref/sprite.html.
Espero que esse post tenha aberto novas possibilidades para o seu projeto e até a próxima!

segunda-feira, 29 de junho de 2020

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!

Como não perder nenhum compromisso: Meu App Agenda

No nosso dia a dia a agenda é um instrumento de grande importância que as pessoas utilizam para fazer anotações de compromissos ou informaçõ...