Pong no Scratch I

Aula 1
 Pensamento
Computacional

Série: 1ª EM

Tema: Pong no Scratch I

Aula 1
Habilidades trabalhadas nesta aula:
(EMIFCG05) Questionar, modificar e adaptar ideias existentes e criar propostas, obras ou soluções criativas,
originais ou inovadoras, avaliando e assumindo riscos para lidar com as incertezas e colocá-las em prática.
(EM13MAT203) Planejar e executar ações envolvendo a criação e a utilização de aplicativos, jogos (digitais ou
não), planilhas para o controle de orçamento familiar, simuladores de cálculos de juros compostos, dentre
outros, para aplicar conceitos matemáticos e tomar decisões. EM13MAT406 - Utilizar os conceitos básicos de
uma linguagem de programação na implementação de algoritmos escritos em linguagem corrente e/ou
matemática. 2
O que vamos aprender?

Desenvolver o jogo Pong no Scratch.

Desenhar as raquetes e a bolinha do jogo

no Scratch.

Programar os primeiros movimentos das

raquetes e da bolinha no Scratch.

Acompanhe o vídeo da aula.

3
O jogo Pong
Iremos desenvolver o primeiro jogo eletrônico
lucrativo da história, um jogo de esporte conhecido
por Pong, que simula o tênis de mesa. Esse jogo foi
tão importante que deu origem ao setor de games que
conhecemos hoje.
Para entendermos como ele funciona, o jogo original
tem a imagem de dois traços que simulam as
raquetes e uma bolinha que interage com elas. Há
também uma linha tracejada no centro da tela,
identificando o meio da "quadra"; a pontuação é
exibida no topo. Cada vez que a bolinha é lançada
Acesse o artigo Pong na Wikipédia para saber mais
por uma raquete e a outra não consegue tocá-la, o sobre o jogo.
jogador que controla a primeira ganha um ponto.

4
 Durante a aula, os estudantes podem ser indagados se já ouviram falar de linguagem de programação ou do
Scratch. Se sim, solicite que compartilhem para toda a turma o que sabem. Caso indiquem que não conhecem,
informe que uma linguagem de programação é uma linguagem no qual passamos instruções ao computador de

Scratch modo que consiga executar o que é solicitado, e assim, criar jogos, programas e site. Essa linguagem é diferente da
usada comumente, mas é possível aprender.
Inicialmente, vamos desenvolver o Pong utilizando a linguagem Scratch. Desenharemos os elementos do
jogo e desenvolveremos o código, que é a maneira como damos os comandos ao computador para que
ele faça o que precisamos.
Acesse o Scratch pelo link: <https://scratch.mit.edu/>. Clique em “Inscreva-se”.

É interessante
explicar que há
diversas
linguagens de
programação.
Conhecer uma
delas, o Scratch.

5
 Pode ser que alguns estudantes ainda não tenham uma conta de um e-mail. É importante perguntar antes quem já
possui um e-mail. Explique que o e-mail é um canal de comunicação muito importante no mundo digital e, em quase
todos os casos, para realizar cadastros em sites e aplicações, é necessário ter uma conta. Caso seja necessário, antes

Scratch de criar o cadastro no Scratch, incentive-os a criarem o e-mail pessoal ou acessarem um disponibilizado pela rede de
ensino que atua.

Depois de acessar o link da página anterior, cadastre Na sequência, preencha os formulário com
um nome de usuário e uma senha: outras informações solicitadas:

6
 Primeiros passos
com Scratch

Após fazermos o login no Scratch, vamos clicar na opção "Criar":

7
 Primeiros passos
com Scratch
Após clicar em "Criar", o Scratch gera toda a estrutura da página. No ícone de "mundo" no canto
superior esquerdo da página, é possível selecionar ou alterar o idioma; em nosso caso, usamos o
"Português Brasileiro".

8
 Primeiros passos
com Scratch
Na janela do canto inferior direito, temos um "Ator1" representado por um gato alaranjado, presente, por
padrão, em todo projeto que é criado. Como não vamos utilizá-lo, poderemos removê-lo clicando no ícone
de lixeira.

9
 Desenhar a bolinha e as raquetes
Nós vamos desenhar a bolinha e as raquetes. Para isso, clicaremos na opção "Selecionar um Ator", abrindo um
menu com diversas opções. Uma delas é "Enviar Ator", que faz o upload de um desenho que já temos no
computador; a "Surpresa" é usada para criar um ator aleatório fornecido pela plataforma; usaremos a opção
"Pintar", em que criamos nossos próprios atores.

Enviar Ator

Surpresa

Selecionar
um Ator

Selecionar
10
um Ator
 Desenhar a bolinha e as raquetes
Ao clicarmos em "Pintar", será exibida uma janela com layout semelhante ao Paint, programa utilizado para fazer
desenhos digitais simples. Clicamos no círculo e faremos o desenho na área quadriculada. Quando fazemos isso, é
possível que o círculo fique com formato oval, algo que não queremos. Para mantermos o desenho com a estrutura
redonda, seguraremos o botão "Shift" do teclado enquanto clicamos e arrastamos a área.

É importante centralizarmos os nossos atores. A bolinha deve estar

alinhada com o centro da área pontilhada, representado por uma bolinha
cortada por uma cruz. Ao centralizar a bolinha, quando quisermos que o
nosso ator vá para uma posição específica, teremos o comportamento
esperado.

Arrastaremos a bolinha para o centro da área, o que

fará com que ela também seja centralizada no jogo.
A bolinha que criaremos não pode ser muito pequena,
pois isso pode causar um bug, erro em inglês, que faz a
bolinha entrar na raquete. Além disso, a bolinha
também não pode ser muito grande. Isso vale também
para a raquete. Lembre-se de deixar a bolinha
preenchida com a cor branca.
11
Desenhar a bolinha e as raquetes
Vamos desenhar um novo ator utilizando a opção "Selecione um Ator > Pintar". Se tentarmos desenhar utilizando
a reta localizada na lateral esquerda da página, teremos uma linha muito fina que não se parece com a raquete do
jogo Pong. Utilizaremos a ferramenta “Quadrilátero”, representada por um quadrado, e desenharemos um
retângulo com as proporções que desejamos. Também removeremos o contorno da raquete e a centralizaremos.
Lembre-se de deixar as raquetes preenchidas na cor branca.

Ferramenta
“Quadrilátero”

12
Cenário
O jogo original Pong tem um fundo na cor preta,
enquanto a bolinha e as raquetes estão na cor
branca. Para configurar o fundo branco, devemos
entrar no painel "Palco", no canto inferior direito do
programa.
Em seguida, devemos ir na aba "Cenários", no painel
principal, e trocar a cor de preenchimento para a cor
preta, que será a mesma cor do contorno.
Selecionando a ferramenta de quadrado, criaremos
um que ocupe todo o espaço disponível.
13
Programação dos atores
Localizado no canto superior direito da tela, há o ícone de uma bandeira verde. Ao ser clicado, ele dá início ao jogo, é
o nosso botão de play, mas se clicarmos nele vamos perceber que nada acontece, pois ainda não programamos os
atores (bolinha e raquete).

14
Programação dos atores
Para programar o jogo por meio dos códigos, vamos utilizar os seguintes blocos identificados com cores:

“Movimento” (azul)

“Eventos” (amarelo)

“Controle” (laranja)

“Sensores” (azul claro)

15
Movimento da bolinha
Para deslocar o ator “bolinha”, vamos utilizar a seção de códigos que está no canto esquerdo da tela.
Lembre-se de selecionar o ator “bolinha” e arrastar para o lado direito alguns blocos de movimento, que
são os blocos azuis.

16
Movimento da bolinha
Para o jogo iniciar, podemos colocar a condição de
“quando o ícone da bandeira verde for clicado”.
Nós podemos arrastar os blocos de “condições
iniciais”, centralizar o ator “bolinha” inserindo as
condições “x:0” e “y:0” e “apontar para a direção de
45º”.

Para dar movimento ao ator “bolinha”, vamos colocar os

comandos “sempre mova 12 passos” e “sempre que a
bolinha tocar na borda, volte”, retornando para o
adversário.
Nesse ponto, é possível relembrar os conceitos que envolvem o plano
cartesiano. A origem do sistema de referência é o ponto em que x = 0 e y =
0. Por isso, atribuímos esses valores à bolinha para que ela fique no centro
da tela. Pode ser importante retomar o conceito de ângulo. Outra ação
possível para rever conceitos matemáticos é mostrar utilizando o
movimento da bolinha, o que é um ângulo de 45º. Solicite que testem
outros ângulos para ver o que acontece. 17
Controlando a raquete
Lembre-os de que o projeto criado nessa aula deve ser guardado na
própria conta do Scratch, pois vamos dar sequência a ele na próxima aula.

Para movimentar os atores “raquetes”, eles devem ser

movimentados pelos comandos dados pelo jogador
por meio do teclado. É necessário definir qual é a
coordenada que devemos manipular para
movimentar o ator “raquete” para cima ou para
baixo, quais são as coordenadas para o jogo iniciar
e em qual região do palco podemos posicionar
a raquete.
Para posicionar o ator “raquete” para a esquerda,
devemos posicionar a variável “x” em -220;
Sempre que a tecla “seta para cima” for pressionada,
devemos aumentar a variável “y”. Se pressionarmos a
“tecla para baixo”, devemos diminuir a variável “y”,
colocando números negativos.
18
 Desafio
É a sua vez!

Depois de criar sua conta no Scratch,

personalize seu Perfil. No canto superior direito,
clique em seu nome e vá em “Perfil”, adicione
seu nome, seu e-mail, rede social ou outras
informações virtuais.

No entanto, não compartilhe dados muito

pessoais, por exemplo, número do celular,
endereço onde mora, entre outras
informações.
Espera-se que os estudantes personalizem seu próprio perfil na conta
do Scratch, adicionem uma imagem que o represente e insiram
informações a seu respeito. Incentive que coloquem informações tais
como: qual turma pertencem e nome da escola que fazem parte.

19