Um roteiro pra te ajudar a guiar o aprendizado de uma criança em tecnologia, usando Scratch.
Módulo: 1 - Mais Scratch
Atividade: 3 - Drum Star
Projeto pronto: contém spoilers
Chegamos em outra atividade musical! Essa em particular me deixa muito feliz por que bateria é meu instrumento favorito!
Vamos aprender a clicar um jogo “clicker”: onde a jogabilidade envolve cliques de mouse pra ganhar pontos, comprar melhorias e aumentar seus ganhos.
Criaremos um jogo no qual nosso jogador está numa jornada pra ser uma estrela da bateria.
O jogo começa num cenário de treino, com uma bateria de uma peça só.
Conforme nosso jogador toca, ele ganha pontos a cada batida e pode usar esses pontos pra comprar mais partes de bateria, que por sua vez dão mais pontos pro jogador.
Acesse a seção “What you will do” do material original pra ver um exemplo do jogo funcionando.
Nosso astro começa pequeno: apenas praticando em seu quarto. Adicione um cenário que se parece um lugar de praticar bateria no início da carreira. No meu projeto, vou usar o Bedroom 3 (Quarto 3)
.
Se quiser, use o editor de cenários pra pintar e modificar seu quarto pra deixar ele mais sua cara.
Agora, a gente quer começar o jogo perguntando qual nome da pessoa que está jogando pra poder exibí-lo no canto da tela. Pra armazenar esse nome na nossa memória, vamos utilizar Variáveis
.
Vou colocar uma explicação breve sobre variáveis aqui, mas caso você queira se aprofundar, clique aqui pra abrir uma explicação mais detalhada.
Você já precisou anotar algo no papel só pra não esquecer depois? Um telefone, uma lista de mercado, uma palavra secreta.
Os computadores fazem algo parecido: guardam dados na memória pra lembrarem depois.
O Scratch também nos permite guardar coisas na memória RAM do computador através de Variáveis
.
Variáveis são como gavetas, mas são gavetas peculiares, nas quais você só pode guardar um objeto de cada vez:
Se quisermos lembrar do nome do jogador do nosso jogo, precisamos guardar esse nome na nossa gaveta (variável):
E essa é exatamente nossa missão de início de jogo: quando o jogo começar, queremos perguntar o nome do jogador e armazenar em uma variável.
Pra fazer essa pergunta, vamos usar o bloco sensor pergunte ... e espere
. Esse bloco é feito pra ser usado em conjunto com outro bloco, que vai dizer pra gente o valor da resposta
:
O bloco pergunte ... e espere
vai mostrar uma caixa de texto pro jogador. Assim que o jogador terminar de escrever, o código continua.
O bloco arredondado resposta
vai conter o texto que o jogador digitou.
Agora queremos colocar a resposta
dentro de uma gaveta no Scratch. Pra fazer isso, vá na seção variáveis
do blocos e clique em Criar uma variável
. Digite “nome do jogador” no nome e clique em “OK”.
Agora nossa gaveta está criada e possui um nome: nome do jogador
:
Pra mudarmos o conteúdo da gaveta, vamos usar o bloco mude <variável> para ...
combinado com o bloco resposta
da pergunta anterior.
O código do cenário fica desse jeito:
Agora clique na bandeira verde e digite seu nome. Percebeu que ele está aparecendo no canto superior da tela?
Você pode mudar ele de lugar, e até mesmo mudar o tipo de exibição:
Sempre que nosso jogo começar, precisamos apagar o nome do último jogador que jogou. Além disso, queremos que nosso cenário sempre comece sendo o quarto, então vamos adicionar dois novos blocos pra garantir que o jogo sempre começa do mesmo jeito: mude cenário para ...
e mude <nome do jogador> para ???
:
Nosso baterista vai começar sem dinheiro e apenas com uma parte da bateria: o chimbal. Adicione um novo ator e procure pelo modelo Drum-highhat
. Note que esse ator já tem fantasias de “fazendo som”.
Existe uma forma de adicionarmos funcionalidades ao Scratch através de Extensões
. No canto inferior esquerdo da tela, clique no quadrado roxo com ícone de bloquinhos brancos, e clique na extensão Música
.
Agora nós temos uma nova seção de blocos: Música
.
Experimente com o bloco toque instrumento ... por ... batidas
pra ver quais instrumentos pode usar.
No nosso bloco, quando ele for clicado
, vamos trocar pra fantasia drum-highhat-b
, tocar o som de chimbal, e voltar pra fantasia drum-highhat-a
:
Teste seu chimbal e, se estiver tudo funcionando, vamos começar a contabilizar as batidas.
Usaremos outra gaveta (variável) pra guardar a contagem de batidas:
Pra criar sua variável, vá pra seção “Variáveis”, clique em “Criar nova variável”. Dessa vez, não se esqueça de marcar “Para todos os atores”:
Como na imagem da gaveta ali em cima, nossa contagem de batidas deve começar em zero, por isso, no código do palco
, vamos adicionar o bloco mude <batidas> para <0>
:
Pra números, essa gaveta é especial: ela nos permite incrementar o conteúdo da gaveta.
No código do chimbal, queremos contar as batidas e vamos usar um novo bloco pra isso: adicione ... a <variável>
:
Chegou a hora de dar um upgrade na nossa bateria. Vamos adicionar agora uma “caixa”, que só vai estar disponível para compra quando o jogador tiver 10 batidas.
Primeiro, vamos escolher o ator drum-snare
na lista de atores. Depois de adicionar, você pode selecionar o ator do chimbal
e arrastar seu bloco de código pro ator da caixa:
Depois de arrastar, troque os valores dos blocos pra ficarem de acordo com o novo ator:
2
drum-snare
Tarol (1)
O código da sua caixa deve estar assim:
Mas como vimos antes, esse ator não vai estar disponível quando o jogo iniciar, então temos que esconder
o ator da caixa quando a bandeira verde for clicada
:
Agora, vamos criar o botão que nos permite comprar a caixa. Adicione um novo ator e escolha a aparência do botão - pro nosso exemplo, vou usar o Button 3
.
Pra não confundirmos no futuro, coloque o nome do ator do botão pra “caixa”.
Vamos estilizar o botão com a imagem do instrumento que ele desbloqueia: vá para a fantasia da caixa, use a ferramenta seta pra selecionar a caixa e clique no botão copiar. Depois, cole-a no botão da caixa. Aproveite pra escrever o custo do instrumento (10 batidas):
Agora, escolhar um lugar pro seu botão de caixa ficar - o canto da tela pode ser um ótimo lugar.
Com tudo arrumado no lugar certo, vamos fazer o código de compra no ator do botão da caixa.
Quando o jogador clicar no botão, ele deve verificar se o jogador já possui 10 batidas pra poder comprar o instrumento. Pra isso, vamos usar um bloco se ... senão
.
Com esse bloco, queremos comparar a variável batidas
pra saber se ela é maior que 9
, se sim, o instrumento será comprado. Se não, vamos avisar o jogador que lhe faltam batidas:
O bloco se ... senão
é parecido com o bloco se ... então
, a diferença é que ele possui 2 encaixes.
Enquanto o bloco se ... então
só se preocupa com a verdade, o se ... senão
vai fazer uma coisa caso seja verdade, ou outra caso seja mentira.
No nosso caso, se for verdade (o jogador possui 10 ou mais batidas), queremos esconder o botão e subtrair 10 batidas do jogador, e se for mentira, queremos avisar o jogador que ele não possui as 10 batidas ainda:
Ainda falta uma coisa: o ator da caixa precisa saber se o botão foi clicado pra poder aparecer. Pra isso, vamos usar o bloco transmita ...
.
Esse bloco vai transmitir uma mensagem chamada comprou caixa
:
E nosso ator da caixa vai ficar de olho na mensagem (quando eu receber <comprou caixa>
) pra poder aparecer:
Quando a caixa for comprada, também queremos mudar o cenário. Adicione um novo cenário pro palco (escolhi o Metro
no exemplo) e mude para ele quando o palco receber comprou caixa
:
Pra firmar o conhecimento, vou te mostrar como duplicar os atores que temos pra criar mais instrumentos, assim você consegue fazer sua própria orquestra.
Adicione um novo ator pra ser a nova adição da bateria - vou escolher o Drums Tabla
no meu exemplo.
Agora, vá no ator Drum snare
(o segundo instrumento que adicionamos) e arraste os três blocos de código pro novo ator e atualize os blocos. Não se esqueça de mudar:
Duplique o botão da caixa e faça o mesmo processo, mudando o seguinte:
E por último, adicione um novo cenário ao palco para o próximo show, eu escolhi o Spotlight
.
Adicione o bloco quando eu receber ...
com a mensagem do novo ator, trocando para o novo cenário escolhido. O código final do palco vai ficar assim:
Pra finalizar, posicione os seus instrumentos e botões onde preferir, lembre-se que eles devem ficar bem-posicionados em todos os cenários. Caso tenha dificuldades, escolha 3 cenários que possuem o “chão” no mesmo lugar.
Agora jogue seu jogo e melhore ele com mais instrumentos conforme desejar! Vejo você na próxima atividade!
Variáveis são uma forma de guardarmos algo na memória pra não esquecermos.
Você já precisou anotar alguma coisa pra não esquecer? Nosso computador precisa fazer isso o tempo todo!
Uma variável no Scratch é como uma gaveta, mas é uma gaveta peculiar, já que ela só guarda uma coisa de cada vez.
Essa coisa pode ser um número ou texto, e podemos mexer nessa gaveta desde que sigamos a única regra: cada gaveta só guarda uma coisa:
Pra criar uma variável no Scratch, basta ir até a seção Variáveis
e clicar em Criar uma variável
:
Quando criar, você deve escolher um nome pra ela, e esse nome é como se fosse uma etiqueta que colamos pra identificar o conteúdo:
No exemplo acima, temos uma variável com o nome nome do jogador
e nela está guardado o nome Natalia
O Scratch nos permite gerenciar nossas gavetas com os seguintes blocos:
mude <variável> para ...
: substitui o que está dentro da gaveta por um valor novo;adicione ... a <variável>
: acrescenta (ou subtrai, com valores negativos) um valor ao número que está na gaveta;mostre/esconda a variável ...
: exibe ou esconde as variáveis no painel do jogoAs variáveis podem ou não ser vistas pelo jogador. Você pode usar os blocos de mostrar/esconder acima, ou interagir com as variáveis diretamente pelo painel. Experimente clicar com o botão direito sobre uma delas:
Você já deve ter visto alguns blocos ou encaixes com o formato de hexágono:
Nós chamamos esses blocos de condições, e essas condições podem ser mentira ou verdade.
Os encaixes hexagonais são como detectores de mentira: eles recebem uma condição e escolhem o que vão fazer com ela.
O bloco se ... então
, por exemplo, abraça seus blocos-filho e só os executa quando a condição for verdade. Ele é como uma mamãe-coruja protegendo seus filhos das mentiras do mundo.
No exemplo abaixo, temos uma condição com esse bloco, e os blocos de dentro só vão ser executados caso a tecla espaço esteja pressionada:
Ao longo das atividades, vamos ver juntos outras formas de usar nossos blocos detectores de mentira pra controlarmos a lógica dos nossos jogos.
Além disso, o Scratch também possui operadores lógicos, que nos ajudam a combinar condições ou manipular verdades.
O operador não ...
, por exemplo, transforma uma mentira em uma verdade:
Essa é a lista de operadores lógicos nas condições:
Operador | Descrição |
---|---|
não ... | Inverte uma condição |
... ou ... | Verdade se ao menos uma das condições forem verdade |
... e ... | Verdade apenas se ambas as condições forem verdade |
O Scratch tem um relógio interno que começa a contar quando você clica na bandeira verde pela primeira vez.
O valor desse cronômetro pode ser usado em inúmeros lugares em seu formato arredondado, na seção de “Sensores”:
Perceba o formato dele: esses cantos arredondados nos permitem colocá-lo em qualquer lugar onde podemos digitar um número ou texto.
Além disso, também podemos usar o bloco Zerar cronômetro
pra voltar o contador pra zero. Lembre de sempre adicioná-lo após o Quando a bandeira verde for clicada
.
Existe também um bloco de início (topete) que ativa blocos de código a partir de um determinado tempo: Quando ... > ...
Ele está na seção de “Eventos” e pode estar configurado para “ruído”.
Atores são todas as pessoas e objetos com algum tipo de comportamento dentro do jogo. Sem eles, nosso jogo seria apenas um palco vazio.
Os atores são feito de três coisas:
Um ator pode ter múltiplas fantasias e sons, e através do código, você pode manipulá-los da forma que quiser, por exemplo:
Código é o que dá vida a tudo. Ele serve para trocarmos de fantasia ou cenário - Também pode nos ajudar a emitir sons e movimentar atores.
Ele é composto por blocos de diferentes tipos, listados no painel esquerdo da aba código.
Blocos podem ser encadeados formando trechos de código (ou scripts), que são executados em sequência, de cima para baixo.
💡 Todos os trechos de código vão começar a partir de um bloco do tipo evento que começa com
quando...
.
Você pode testar o funcionamento de blocos ou trechos de código clicando sobre eles.
Fantasias são os visuais dos atores, que por sua vez, podem ter múltiplas fantasias.
Elas são gerenciadas através da aba fantasias, onde você pode criar, remover, editar e renomear fantasias.
Você vai precisar delas quando for fazer coisas como:
Esses são os blocos relacionados com fantasias de um ator:
mude para a fantasia
: troca a fantasia do ator para a fantasia selecionada. Você pode nomear fantasias pra facilitar o uso desse bloco;próxima fantasia
: troca a fantasia do ator para a próxima fantasia na sequencia de fantasias, seguindo a ordem. Pode ser útil para animar um ator;mude ... ao efeito ...
: aumenta ou diminui intensidade ao efeito de uma fantasia. Efeitos são como filtros de imagem de redes sociais e são controlados por intensidade, um valor de 0 até 200;defina o efeito ... como ...
: Ao invés de aumentar ou diminuir, define o a intensidade do efeito da fantasia selecionadoçremova os efeitos gráficos
: Remove todos os efeitos gráficos da fantasia💡 O ator sempre usará a última fantasia selecionada na aba fantasias, portanto, é uma boa prática você usar o bloco
mude para a fantasia [fantasia inicial]
pra garantir que o ator sempre terá a fantasia correta no início do jogo.
Sons representam todo o tipo de voz, barulho, efeito ou música que um ator ou cenário podem emitir.
São gerenciados através da aba Sons, onde podem ser adicionados, removidos, editados e renomeados.
Os sons são úteis quando você quiser fazer coisas como:
Esses são os blocos que controlam os sons:
toque o som ... até o fim
: Toca um som e aguarda até o fim antes de passar para o próximo bloco;toque o som ...
: Toca um som, mas ao invés de aguardar até o fim, passa imediatamente para o próximo bloco;pare todos os sons
: Para de tocar todos os sons que estão tocando imediatamente;mude ... no efeito ...
: Adiciona ou diminui a intensidade de um efeito no som. Efeitos de sons são controlados assim como os efeitos de fantasias;mude o efeito ... para ...
: Define a intensidade do efeito do som, de 0 até 200;remova os efeitos sonoros
: Remove todos os efeitos sonoros do som;mude o volume em
: Aumenta ou diminui o volume dos sons;mude o volume para ...%
: Ao invés de aumentar ou diminuir o volume, define para um valor de 0 até 100%.💡 O volume individual de um som pode ser alterado na aba sons. Se achar que os sons de seu jogo estão altos de uma forma geral, utilize o bloco
mude o volume para ...%
no início do jogo para um valor mais agradável.
A principal parte da nossa peça de teatro é o palco. Sem ele, não haveria lugar para os atores existirem.
Assim como atores, Palcos possuem:
Todos os jogos possuem um palco, mesmo que ele tenha apenas um cenário em branco.
A primeira coisa importante sobre cenários é que eles são exatamente como fantasias.
Como palcos não usam fantasias, usamos o nome cenário.
Você pode ter vários cenários em um palco para fazer coisas como:
Todos os atores o Scratch possuem uma posição. Ela diz qual lugar do palco nosso ator está.
Pra posicionar o ator horizontalmente, usamos o x
. Verticalmente, usamos o y
.
Quanto maior o x
, mais o ator fica à direita
Quanto maior o y
, mais o ator sobe
Pra facilitar o entendimento, podemos comparar esse conceito com outros jogos que usam o plano cartesiano:
y
e as letras são o x
;y
e os números são o x
;💡 Pensem em alguns
x
ey
e adivinhe onde eles ficariam no quadro acima
Alguns blocos de código que controlam o posicionamento:
mova ... passos
: anda passos na direção que o ator está olhandová para x: ... y: ...
: teletransporta o ator pra uma posição exatavá para ...
: teletransporta o ator pra outro ator, mouse ou aleatoriomude x/y para ...
: teletransporta o ator em apenas um eixoadicione ... a x/y
: acrescenta ou diminui a posição de apenas um eixoAtores podem ficar na frente ou atrás de uns aos outros, e esse comportamento pode ser controlado.
Um ator pode ser trazido pra frente (mais perto da câmera), ou enviado pra trás com os blocos do tipo Aparência:
vá para a camada ...
: coloca um ator em frente a tudová para ... ... camadas
: move camadas pra trás ou pra frenteOs atores não precisam sempre olhar pro mesmo lado, desde que a gente controle sua direção.
A direção de um ator pode ser controlada manualmente pelo painel de atores à direita, ou através de códigos.
Quando a direção é alterada, o ator vai mudar sua orientação de acordo com o estilo de rotação:
rotação completa
: o ator vai girar como se fosse o ponteiro de um relógioesquerda/Direita
: o ator não gira, ele apenas olha pra um lado, ou para outronão gire
: nada acontece ao mudar a direção💡 Você pode alterar o estilo de rotação com os ícones logo abaixo do círculo de controle da direção
Esses são os blocos de código relacionados à direção:
Dentro do código de atores, é possível usar um recurso de controle chamado repetição ou loop.
Esse bloco nos permite repetir trechos de código sem precisarmos adicionar mais blocos do mesmo tipo:
Além de simplificar nosso código, esse bloco também nos permitirá repetir blocos sem precisar inicialmente saber a quantidade de repetições a serem feitas.
Animações em jogos são feitas da mesma forma que animações eram feitas em papel:
As linhas do desenho se mexem um pouco de cada vez, nos dando a impressão de que estão em movimento.
Pra simular esse mesmo comportamento utilizando Scratch, vamos usar blocos de repetição.
Dentro dos blocos de repetição, vamos colocar blocos que fazem nosso ator se mover, por exemplo:
mova ... passos
adicione ... a X
próxima fantasia
Quando estiver animando, você pode controlar os valores dos blocos de repetição e movimento pra testar diferentes velocidades e distâncias:
O número no bloco mova ... passos
vai dizer a velocidade da animação. Se multiplicarmos os dois números, temos a distância total que o ator vai se deslocar.
Em algumas situações, você pode preferir definir o destino do movimento diretamente ao invés de repetir um movimento rapidamente. Nesses casos, use os blocos deslize por ... segs. até ...
.
Com ele, você pode escolher um destino através de coordenadas, ou até mesmo a posição de outro ator.
Esse bloco não exige o uso de blocos de repetição.
Há um tipo de bloco especial que determina o começo de um script (conjunto de blocos). Nós os chamamos carinhosamente de “Blocos de topete”.
Esses blocos têm um desenho especial curvado na parte de cima, identificando que não há outro bloco que ficará acima dele.
Eventos servem pra iniciarmos scripts quando coisas acontecem, por exemplo:
O evento de início de jogo (quando bandeira verde for clicado
) deverá aparecer em todos os jogos que você criar.