Super Cdrbot

 

Você já pensou em desenvolver seu próprio jogo de vídeo game? Se

a resposta foi sim, prepare-se, pois esse projeto foi feito para você. Vamos

criar o Super CDRbot.

O Super CDRbot é um jogo inspirado no Super Mario World,

famoso jogo de plataforma dos anos 90 produzido pela Nintendo. O

CDRbot é o nosso mascote, um robozinho simpático e alegre!

O CDRbot deve saltar os obstáculos até que o tijolo surpresa apareça

no cenário. Ao bater nesse tijolo, uma estrela surge piscando. Para vencer, o

CDRbot deve tocar na estrela.

Vamos controlar o salto do CDRbot com botão no Arduino. Com o

LED flash rápido, vamos indicar no mundo físico que o jogador ganhou.

 

Para desenvolvê-lo, vamos utilizar o Pictoblox, software de

programação em blocos baseado em Scratch, que permite a interação com

Arduino.

O interessante aqui é introduzir a possibilidade de unir o hardware

com o software, o que torna o aprendizado muito mais prazeroso. Divirta-

se!

 

MATERIAIS NECESSÁRIOS

 

1 x Placa UNO SMD compatível com Arduino UNO ;

1 x Cabo USB ;

1 x Protoboard ;

1 x LED flash rápido ;

1 x Botões do tipo push button ;

1 x Resistores de 220 Ω ;

1 x Resistores de 10 kΩ ;

Jumpers macho-macho ;

 

ESQUEMÁTICO DE LIGAÇÃO DOS COMPONENTES

 

Certifique-se que sua placa UNO esteja desligada e m onte

atentamente o circuito conforme a Figura 2 0 .

 

Figura 20 - Circuito para o Projeto Super CDRbot

Ao montar seu circuito na protoboard, preste atenção nos seguintes

pontos:

O botão encontra-se conectado ao pino digital 8 da placa UNO.

Esse botão será responsável por movimentar o CDRbot. Quando o

botão for pressionado, o CDRbot deve pular;

O LED flash rápido encontra-se conectado ao pino digital 9 do

Arduino. Quando o CDRbot conseguir saltar todos os obstáculos,

um tijolo surpresa surge no cenário. Ao bater nesse tijolo, uma

estrela surge piscando, indicando que o jogador venceu o jogo. Com

o LED flash rápido, vamos indicar no mundo físico que o jogador

ganhou.

 

TINKERCAD

Para melhor visualizar o circuito deste projeto, acesse o seguinte

link:

 

www.blogdarobotica.com/tinkercad-CDRbot

 

INSTALE O PICTOBLOX

 

O Pictoblox é um programa de computador gratuito que permite a

programação de jogos, animações, histórias e músicas.

A parte gráfica do nosso jogo será desenvolvida utilizando

programação em blocos no Pictoblox. Portanto, será necessário que você

instale este software em seu computador.

Em nosso blog, você encontra um guia de instalação do Pictoblox.

Acesse:

 

www.blogdarobotica.com/guia-de-instalacao-do-pictoblox

 

PROGRAMAÇÃO NO PICTOBLOX

 

Dividimos a explicação da programação no Pictoblox em etapas com

o intuito de facilitar o entendimento.

 

Etapa 1: Download dos atores e palco do projeto

 

Como o cenário e os atores (CDRbot, Obstáculos, Tijolo Surpresa,

Estrela e outros) que vamos usar em nosso projeto não se encontram disponíveis na biblioteca do Pictoblox, precisamos fazer o download. Baixe

o arquivo do seguinte link:

 

www.blogdarobotica.com/pictoblox-CDRbot

 

Este é um arquivo com extensão .sb 3 , compatível com o Pictoblox

e o Scratch 3. Após o download, abra o arquivo com o Pictoblox.

Ao abrir o arquivo no Pictoblox, você verá uma tela semelhante à

Figura 2 1 e perceberá que o cenário e os atores já se encontram

configurados no projeto.

No Pictoblox, o palc o é a área onde o ator executa as ações de

acordo com seu código. Você pode alterar o palco usando imagens,

chamamos essas imagens de cenários.

Um ato r pode ser um personagem ou um objeto capaz compreender

e realizar as ações escritas no código.

A área de programaçã o é onde agrupamos um conjunto d e blocos,

interligados entre si, para realizar uma ação.

Os bloco s são peças de encaixar usadas para criar os códigos no

Pictoblox. Os blocos se conectam como um quebra-cabeça.

Os blocos estão localizados na paleta de bloco s . Existem várias

paletas diferentes, as principais são: movimento, aparência, som, eventos,

controle, sensores, operadores, variáveis e meus blocos.

 

Figura 21 - Elementos do Pictoblox.

Etapa 2: Preparar as configurações do Pictoblox para receber e enviar

informações para o Arduino

 

A primeira tarefa que devemos fazer antes de iniciar a programação

usando o Pictoblox é configurar a versão do Arduino que será utilizada.

Para isso, clique em Placa.

 

Em seguida, a tela Selecionar Placa será exibida. Vamos clicar em

Arduino Un o para selecioná-lo.

Logo após, vamos selecionar a Porta Serial em que o Arduino Uno

foi reconhecido pelo computador. Em nosso exemplo, o Arduino foi

reconhecido pela COM 3 . Clique em Conecta r .

Caso seu Arduino não esteja sendo localizado, verifique a ligação

com o cabo USB e clique em Atualiza r .

 

Etapa 3: Carregar firmware para o Arduino

 

Clique na opção Carregar Firmwar e , localizado no canto superior

direito do Pictoblox.

 

Etapa 4: Codificação do jogo

 

Após as configurações, é hora de programar! Siga as instruções para

criar o jogo Super CDRbot.

 

A) Obstáculos

 

Vamos iniciar programando o ator Obstáculos. Para isso, clique na

miniatura do ator para acessar seu editor de código.

O ator Óbstáculos é composto por 5 fantasias ( Figura 2 2 ). Você

pode visualizá-las clicando em Fantasias . Cada fantasia equivale a um obstáculo diferente que o CDRbot terá que saltar.

 

Figura 22 - Fantasias do ator Obstáculos.

 

Iniciamos o código do ator Obstáculos escondendo-o e definindo seu

tamanho, posição e fantasia inicial.

Em seguida, vamos criar duas variáveis: Camera e Movimento . Para

isso, clique na opção Variáveis localizada na paleta de blocos. Logo após,

clique em Criar variáveis . Inicialize as variáveis com o valor zerado, ou

seja, mude Camera e Movimento para zero.

Inclua o bloco “ Repita” . Em seu espaço em branco, inclua o

número 10. Este trecho do código será responsável por criar 10 clones do

ator Obstáculos. Para que os clones possuam fantasias diferentes de forma

aleatória, usaremos o bloco “ número aleatório entre... e ...” .

O primeiro código para o ator Obstáculos ficará da seguinte maneira:

Agora, vamos criar outros dois códigos que serão responsáveis pela

 

movimentação dos Obstáculos no cenário.

Começamos o segundo código incluindo o bloco “ Quando eu

começar como clone”, localizado na paleta Controle. Em seguida, vamos

exibir o clone criado e fazer com que o clone acompanhe a movimentação

da câmera. Para isso, precisamos alterar sua posição x para o resultado da

seguinte equação: Posição x = Camera + 480 x Moviment o . Em que, 480

é a largura total do palco.

 

O segundo código do ator Obstáculos ficará da seguinte maneira:

No terceiro código, vamos decrementar a variável Camera para que

 

os Obstáculos se movam da direita para a esquerda. Vamos incluir também

uma estrutura condicional Se...Então para verificar o fim do jogo.

Se o valor da variável Camera for menor que -4900, a mensagem

Concluido será transmitida.

O terceiro código do ator Obstáculos ficará da seguinte forma:

Para testar se os códigos do ator Obstáculos estão

funcionando corretamente, clique na bandeira verde. Os Obstáculos se

movem da direita para a esquerda no palco? Suas fantasias são alteradas de

modo aleatório? Se sim, está tudo correto. Caso contrário, revise a

programação.

 

B) CDRbot

 

Clique na miniatura do nosso robozinho (CDRbot) para acessar seu

editor de código.

 

Iniciaremos o código do CDRbot criando uma animação que simule

que ele está caminhando pelo cenário do jogo. Uma animação é feita de

muitas imagens estáticas, que são reproduzidas uma após a outra. Quando

isso é feito muito rápido, simula que os personagens estão realmente se

movendo

O Super CDRbot será um jogo de rolagem lateral, também

conhecido como side-scroller, no qual o cenário e o personagem são vistos

na lateral. Por isso, nosso personagem ficará de lado enquanto caminha.

Quando o jogo for finalizado (Camera < -4900), o CDRbot ficará de

frente, seus olhos ficarão piscando e seu braço movimentará. O código para

criar esses efeitos de animações ficará da seguinte forma:

 

O segundo código do CDRbot será responsável por ler o pino digital

8 do Arduino e por verificar se o robô tocou os Obstáculos, o Tijolo

Surpresa ou a Estrela. Estas quatro tarefas deverão ser executadas durante

todo o jogo. Por isso, iniciamos este código incluindo o bloco “S empre” .

Em seguida, vamos criar a variável Leitura, que ficará responsável

por armazenar o valor lido da porta digital 8 do Arduino, em que o botão

está conectado.

Com auxílio da estrutura condicional Se...Então , vamos verificar se

o CDRbot tocou os Obstáculos. Como existem Obstáculos com plataformas

com gramado que o CDRbot pode tocar, vamos analisar se ele tocou na cor

cinza. Use o Seletor de cor ( Figura 2 3 ) para copiar a cor.

 

Figura 23 - Seletor de cor no Pictoblox.

 

Caso a condição seja verdadeira (CDRbot tocou na cor cinza), o som

Lose deverá ser tocado e a mensagem “Game Over! Tente novamente.” será

dita pelo CDRbot por 1 segundo. Em seguida, o bloco Pare todos encerra

todas as ações do jogo.

Também com o auxílio da condicional Se...Então, vamos verificar se

o CDRbot tocou o Tijolo Surpresa. Quando isso ocorrer, o som Win será

tocado e a mensagem “Você venceu” será dita pelo CDRbot por 4 segundos.

A última verificação que vamos fazer no segundo código do CDRbot

é se ele tocou a Estrela. Caso a condição seja verdadeira, o tamanho e a cor

do CDRbot serão alterados 3 vezes. Após isso, a cor deve ser definida como

zero novamente e todas as ações do jogo devem parar.

Assim, o segundo código do Ator CDRbot ficará da seguinte

 

maneira:

No terceiro código do CDRbot, vamos definir seu tamanho e posição

inicial. Em seguida, vamos criar as variáveis Pular e Pulou .

A variável Pular será usada para determinar o incremento e

decremento no eixo y, que deve ocorrer para que o CDRbot pule e volte

para o chão.

Por sua vez, a variável Pulou será usada para verificar o estado em

que o CDRbot se encontra (pulando ou não pulando).

Para evitar que CDRbot pule várias vezes seguidas ou que ele fique

flutuando, vamos criar o bloco Verificar pulo . Para criar este bloco, clique

na opção Meus Blocos na paleta de blocos. Em seguida, clique em Criar um

Bloco.

Em seguida, inclua Verificar pulo como nome do bloco e adicione

uma entrada booleana com nome alto . Marque a opção Executar sem

atualização da tela e clique em Ok, conform e Figura 2 4 .

 

Figura 24 - Criar um bloco no Pictoblox.

O bloco Verificar pulo será chamado sempre que a variável Pulou for

maior que zero.

O terceiro código do CDRbot ficará da seguinte forma:

 

Agora precisamos escrever o código do bloco Verificar Pulo . Vamos

iniciar este código incluindo o bloco de repetição controlado por lógica “

Repita até que”. O código será repetido até que o CDRbot não esteja

tocando no gramado (verde), ou seja, sempre que ele estiver no alto os

blocos dentro do laço serão repetidos.

Em seguida, vamos verificar o valor de alto. Se o valor de alto for

verdadeiro, significa que o CDRbot está subindo. Se o valor de alto for

falso, o CDRbot está descendo do pulo e a variável Pulou deverá ser

alterada para 0.

Ao final, o código do bloco Verificar Pulo ficará da seguinte forma:

 

Para testar se os códigos do CDRbot estão funcionando

corretamente, clique na bandeira verde. O CDRbot pula quando o botão é pressionado? A animação do CDRbot simula que ele está andando?

C) Tijolo surpresa

 

 

Clique na miniatura do ator Tijolo Surpresa para acessar seu editor

de código.

 

Para o tijolo surpresa, construiremos dois códigos. O primeiro define

as suas configurações iniciais.

 

O segundo código será executado apenas quando o CDRbot tiver

saltado os 10 blocos e a mensagem Concluido ter sido transmitida.

Quando Tijolo Surpresa receber a mensagem Concluido , o ator

deverá ser mostrado no palco com sua fantasia Tijolo 1 .

Após isso, vamos verificar se o CDRbot tocou o ator Tijolo

Surpresa. Se sim, a fantasia de Tijolo Surpresa será alterada e a mensagem

Estrela deverá ser transmitida.

O segundo código para do ator Tijolo Surpresa pode ser observado a

seguir:

D) Estrela

 

Clique na miniatura ator Estrela para acessar seu editor de código.

 

Quando o jogo for iniciado, a Estrela deverá estar escondida.

Portanto, em seu primeiro código vamos apenas realizar as suas

configurações iniciais, definindo sua posição no palco e escondendo-a.

Em seguida, vamos criar a variável posição , que deve ser igualada a

-6. Essa variável será utilizada para movimentação da Estrela em seu

segundo código.

Também em seu primeiro código, vamos definir o pino digital 9

como baixo. Assim, o LED flash rápido ficará desligado ao início do jogo.

Seguindo estas ideias, o primeiro código da Estrela ficará do

seguinte modo:

 

O segundo código da Estrela será executado somente quando o

CDRbot tocar no Tijolo Surpresa.

Neste segundo código, escreveremos as instruções necessárias para

que a Estrela apareça piscando e se mova no palco, bem como para o

acionamento do LED flash rápido. Essas ações indicam que o jogador

venceu o jogo e serão executadas apenas quando o ator Estrela receber a

mensagem Estrela .

Para mover a Estrela no palco, incrementamos e decrementamos a

variável posição .

 

O segundo código para a Estrela pode ser observado a seguir:

E) Chão

 

 

Clique na miniatura do ator Chão para acessar seu editor de código.

O código do ator Chão será apenas para configuração de sua posição

 

no jogo e pode ser observado a seguir:

 

F) Parede

 

Clique na miniatura do ator Parede para acessar seu editor de código.

 

O código do ator Parede também definirá apenas as suas

configurações no jogo e pode ser observado a seguir:

 

Etapa 4: Execução do projeto

Clique na bandeira verde para executar o código e testar o jogo

completo.

Os obstáculos estão se movimentando?

Os obstáculos surgem com fantasias aleatórias? Quando o botão é pressionado, o CDRbot pula? Quando o CDRbot toca o obstáculo, a mensagem “Game Over! Tente novamente” é exibida e o som Lose é reproduzido?

Quando o CDRbot salta 10 obstáculos, o tijolo surpresa aparece no palco?

O que acontece quando o CDRbot toca no tijolo surpresa? A estrela aparece piscando no palco?

O LED flash rápido é ligado quando a estrela surge no palco?

 

Etapa 5: Salve o Projeto

 

Assim que finalizar o projeto, não se esqueça de salvá-lo. Assim, você

poderá acessá-lo novamente quando desejar.

 

DÚVIDAS?

 

Ficou com alguma dúvida? Para melhor visualização e simulação,

você pode baixar o Jogo Super CDRbot em nosso site. Acesse:

 

www.blogdarobotica.com/pictoblox-SuperCDRbot

 

OceanofPDF.com

5.