Faça seu próprio jogo Mario! Scratch Basics para crianças e adultos

Faça seu próprio jogo Mario! Scratch Basics para crianças e adultos
Este guia está disponível para download em PDF gratuito. Baixe este arquivo agora . Sinta-se à vontade para copiar e compartilhar com seus amigos e familiares.

Você sabia que qualquer pessoa pode fazer um videogame sem programação? Embora existam várias linguagens para iniciantes, você não precisa gastar meio ano aprendendo Java ou C ++ para construir um jogo. Você pode escolher entre muitas ferramentas para vários tipos de jogos, mas uma ótima opção para crianças (e adultos) é o MIT grátis Arranhar .





Scratch é uma ferramenta que permite arrastar e soltar ativos para criar jogos ou animações. É fácil de entender, mas ensina os blocos de construção da programação no processo. Vamos ver o que você pode criar no Scratch e, em seguida, percorrer as etapas para criar um jogo Mario simples.



Conheça o Scratch

Para começar com o Scratch, vá para a homepage . Você deve criar uma conta imediatamente para que possa salvar suas criações. Clique no Junte-se ao Scratch botão no canto superior direito da janela. Crie um nome de usuário e uma senha, insira sua data de nascimento e sexo e o sistema solicitará o endereço de e-mail de um dos pais. Digite o seu, se tiver um, e confirme seu endereço para que possa comentar sobre outros projetos e compartilhar o seu.





Agora você pode começar imediatamente. Clique Crio na barra de ferramentas superior para iniciar o editor Scratch. Se preferir, você também pode baixe o editor offline para trabalhar sem uma conexão com a Internet.

Elementos na tela

Ao iniciar o editor, você verá a janela abaixo. Vamos decompor seus elementos (veja a imagem em tamanho real se a pequena abaixo não estiver clara):



  1. Estágio - Mostra um rápido resumo do seu jogo. Todos os sprites ativos e o plano de fundo escolhido aparecerão aqui. Você pode mover sprites se quiser. Dê um nome ao seu projeto no campo acima.
  2. Pano de fundo - Aqui, você pode selecionar um plano de fundo para o seu jogo. Escolha da biblioteca do Scratch, pinte o seu próprio ou importe um arquivo. Você também pode obter uma imagem da câmera do seu PC, embora a maioria das pessoas provavelmente não precise dessa opção.
  3. Sprites - O centro de todos os sprites em seu projeto. Como panos de fundo, você pode adicionar os padrões, criar seus próprios ou fazer upload de imagens. Clique no pequeno azul eu ícone em um sprite para renomeá-lo, alterar seu ângulo ou ocultá-lo.
  4. Área de trabalho - Onde ocorre a maior parte do seu trabalho no Scratch. Use as guias acima (rotuladas Scripts , Fantasias , e Sons para mudar o que você está trabalhando.
    1. Scripts é para adicionar blocos de código, que abordaremos em breve.
    2. Fantasias permite que você crie poses adicionais para seus sprites. Esta guia mudará para Cenários se você tiver um selecionado na área 2 , e de volta para Fantasias quando você seleciona um Sprite na área 6 . Um editor de imagens básico permite que você faça alterações nos gráficos do jogo. Você também pode renomear ativos aqui.
    3. Sons , sem surpresa, é o centro para adicionar e editar sons.
  5. Blocos - Dependendo de qual das três guias você selecionou, esta área alternará entre blocos de código, fantasias / cenários de sprite e clipes de som.
  6. Botões de controle - A bandeira verde inicia o jogo, enquanto a forma do sinal vermelho de parada termina. Você os usará para teste.

Usando Blocos

Agora que você já se familiarizou com o editor do Scratch, vamos falar sobre uma das partes mais importantes da ferramenta - os blocos de código. Em vez de digitar código real, esses blocos permitem definir o comportamento de seus elementos. Eles se encaixam como LEGOs, tornando mais fácil ver como eles afetam um ao outro.

Clique em um sprite da lista à esquerda e certifique-se de selecionar o Scripts guia para começar a arrastar blocos para esse elemento. Observe que os blocos são codificados por cores e têm bordas como um quebra-cabeça para mostrar como eles se encaixam. As dez categorias e o que elas fazem são:



  • Movimento - Faça o sprite dado se mover, seja por etapas, em direção a outro objeto ou por meio de coordenadas diretas.
  • Visual - Permite que o sprite se esconda ou se mostre, troque de roupa, mude de tamanho ou se mova entre camadas.
  • Som - Reproduza sons, altere o volume ou ajuste o andamento.
  • Caneta - Desenhe com um marcador e mude sua cor e forma.
  • Dados - Permite criar suas próprias variáveis. Isso é extremamente útil para elementos que o Scratch não possui embutido.
  • Eventos - Critérios para iniciar outras ações, como quando você clica na bandeira verde ou pressiona a barra de espaço. Você precisa desses blocos para todos os outros blocos realmente fazerem alguma coisa!
  • Ao controle - Loops para repetir uma ação, executar uma instrução if-else ou parar algo.
  • de detecção - Coloque esses blocos em outros para realizar ações quando um sprite está tocando outro elemento ou o usuário está segurando uma tecla.
  • Operadores - Elementos matemáticos que permitem realizar operações aritméticas ou booleanas básicas em variáveis.
  • Mais blocos - Faça seus próprios blocos se estes não forem suficientes!

Um exemplo simples

Vamos dar um exemplo simples para ilustrar como esses blocos se encaixam, passo a passo. Faremos o gato Scratch chutar uma bola de futebol para o gol e emitir um som quando ela entrar.

Primeiro, você precisa de um cenário de futebol legal. Vá para o Pano de fundo seção no canto inferior esquerdo e clique no ícone da imagem para escolher um dos cenários do Scratch. Tem um chamado Meta 1 isso funcionará perfeitamente. Em seguida, clique no ícone do sprite para adicionar um novo sprite pré-fabricado. Você deveria ver o Bola de futebol na lista - clique duas vezes nele para adicioná-lo aos seus sprites.



Agora que os gráficos estão prontos, você precisa começar com alguns blocos. Selecione o gato, já que é ele quem está fazendo a ação. Lembre-se que o Eventos guia contém muitos dos blocos iniciais? Dê uma olhada e você verá um que dispara quando você clica na bandeira verde. Esse é um ponto de partida perfeito - arraste-o para o Scripts área de trabalho.

Depois de começar, você quer que o gato corra e chute a bola, certo? Isso soa como algo que cairia no Movimento aba. Você tem várias opções para fazer o gato se mover, como o Mover X passos bloquear. Mas não podemos garantir quantos passos o gato levará para chegar à bola. Há um bloco melhor para isso - tente o Deslize X segundos para bloquear. Um segundo é um bom momento, e você precisa clicar no botão azul eu ícone da bola de futebol para ver suas coordenadas. Insira-os no bloco e sua primeira ação estará concluída!

Chutando a bola

Assim que o gato tocar a bola de futebol, ele deve voar para o gol. Então, selecione a bola de futebol para que possa adicionar algumas ações a ela. Lembre-se de que toda ação deve começar com um Evento - a bandeira verde é adequada para esta instância. Agora, você não quer que a bola de futebol se mova até que o gato a toque. Dê uma olhada no Ao controle categoria para um bloco que nos permite limitar seu comportamento. o Espere até bloco de sons mais ou menos certo!

Observe como o Espere até bloco tem uma forma de hexágono alongado dentro dele. Muitos dos de detecção blocos se encaixam nessa forma, então dê uma olhada neles para encontrar o certo. Veja o comovente bloco no topo da lista? Você pode arrastar isso para dentro do buraco dentro Espere até . Altere a caixa suspensa para Gato ou o nome que você deu ao sprite do gato.

Agora você só precisa fazer a bola de futebol voar para o gol. o Deslize X segundos para bloco no Movimento categoria que usamos anteriormente para o gato funcionará bem. Encaixe aquele bloco embaixo espere até e coloque o ponteiro do mouse sobre a rede do gol. Você vai ver X e E coordenadas embaixo do palco - conecte-as ao Deslizar bloquear. A bola deve se mover muito rapidamente quando chutada, então vamos tentar 0,5 segundos para o tempo.

E a multidão enlouquece

A última etapa é adicionar som! Selecione os Sons guia acima da área de trabalho para adicionar uma nova. Clique no ícone do alto-falante em Novo som para pegar um da biblioteca do Scratch. Tem um chamado Alegrar debaixo de Humano categoria, o que é perfeito. Clique duas vezes para adicionar e volte para a área de trabalho da bola de futebol.

As configurações de suspensão do Windows 10 não funcionam

Você encontrará um bloco rotulado Tocar música debaixo de Som categoria. Encaixe isso sob o deslizar bloco e pronto! Clique na bandeira verde para reproduzir sua animação. O gato corre até a bola e, ao tocá-la, a bola voa para o gol e a multidão aplaude.

[video mp4 = 'https: //www.makeuseof.com/wp-content/uploads/2017/04/Scratch-Soccer-Example-Video.mp4'] [/ video]

Isso não foi muito difícil! Agora que investigamos como os blocos se relacionam e se encaixam, vamos ver como você pode construir um jogo Mario usando o Scratch.

Criação de um jogo básico de Mario

O exemplo simples de futebol acima mostra como você pode usar blocos para controlar sprites, mas não tem jogabilidade, animações ou música. Vamos entrar mais nisso e criar um jogo Mario simples. Poderíamos gastar milhares de palavras em todos os aspectos da criação de um jogo, então nos limitaremos ao básico.

Observe: Como não sou um artista, para os fins deste tutorial estou copiando os sprites do Mario da web. Os gráficos do Mario são propriedade da Nintendo e você não deve publicar nenhum jogo usando sprites protegidos por direitos autorais. Isso é apresentado apenas como exemplo.

Importar gráficos

O primeiro passo é importar seus sprites e fundos para o Scratch. Como estamos usando imagens da web, vou baixá-las e depois carregá-las no Scratch. Criar uma lógica para que Mario possa pular sobre os inimigos para derrotá-los, mas morrer ao tocar em seus lados é muito avançado para este tutorial, então vamos pedir que ele colete moedas.

No final do tutorial, fornecerei um arquivo ZIP com os recursos finais que usei. Se você usá-los, não terá que se preocupar com as instruções de manipulação de imagens no tutorial. Se você quiser fazer o download de tudo sozinho, continue. Aqui estão os sprites que baixei:

Scratch tem um Blue Sky 3 fundo, que funcionará bem para as nossas necessidades.

Editar fantasias de Sprite

Como há dois sprites que compõem a animação de corrida de Mario, você precisa adicioná-los como trajes separados. Use um editor de imagens como o Paint.NET para salvar os dois frames do Mario como arquivos separados - você pode ignorar o terceiro. Carregue o primeiro sprite do Mario, selecione-o e use o Fantasias guia para carregar o outro sprite como sua segunda fantasia. Dê-lhes nomes distintos, como Mario-1 e Mario-2 . Adicione o sprite de salto como outra fantasia para Mario.

Use um editor de imagens para extrair a nuvem da imagem fornecida acima e carregue-a como um novo sprite. Não é animado, então você não precisa adicionar uma fantasia separada.

Para o solo, você precisará de muitos blocos, já que Mario corre ao longo deles. Use o Paint.NET para pegar os seis blocos no meio do Blocos de Terra imagem e, em seguida, salve-os como um arquivo separado. Você precisará de cerca de 12 blocos para cobrir toda a parte inferior da tela depois de reduzi-los a um bom tamanho. Assim, você deve colocar duas cópias desses seis blocos lado a lado para o seu Chão sprite. Faça o upload e faça duas duplicatas de sprites terrestres no Scratch.

A moeda é um GIF animado, então é um pouco diferente. Sempre que você fizer o upload, Scratch criará fantasias para cada quadro da animação. Esta imagem tem 11 frames no total, mas infelizmente também tem uma borda branca em torno dela, que se destaca contra o fundo azul. Você terá que abrir cada fantasia para a moeda dentro do editor Scratch. Use a ferramenta pipeta para selecionar a cor de fundo azul e, em seguida, use a ferramenta balde de tinta para alterar as bordas brancas da moeda para azul claro.

Você precisará redimensionar sprites usando o Crescer e Encolher botões na parte superior da tela, logo acima do botão com a bandeira verde. Clique em qualquer um dos botões e, em seguida, clique no sprite que deseja alterar no palco à esquerda. Isso irá redimensionar todas as fantasias também. Estimule-os por enquanto; você pode ajustar mais tarde.

Importar sons

Assim como os sprites, vamos pegar alguns sons para dar corpo ao nosso jogo. Vá em frente e baixe-os e, em seguida, carregue-os usando o Sons aba. Enquanto você está nisso, analise adicionando-os como toques legais para o seu telefone .

Anime as moedas

Agora que todos os ativos estão prontos, é hora de começar a fazê-los ganhar vida. Começaremos pelas moedas, pois são fáceis. Selecione o sprite moeda e o Scripts aba. Como nossas moedas são GIFs animados, podemos usar uma série de blocos para rolar constantemente por suas fantasias de forma que pareçam se mover.

Um script de animação se parece com isto:

Resumindo, este script configura a moeda para seu estado padrão quando você clica na bandeira verde. Em seguida, ele percorre os quadros indefinidamente, a uma velocidade que você define como FPS variável no Dados aba. Brinque com esse número se você não gosta da velocidade.

Desmarque a caixa ao lado de Coin-FPS no Dados guia (esta é uma variável personalizada que você cria) para que não apareça na tela.

Fazendo Mario se mover

Agora, para a parte difícil. Muitos passos estão envolvidos para fazer Mario se mover, e na verdade é um truque que rola os blocos de chão para dar a aparência de movimento. Em vez de tentar explicar cada loop de bloco, fornecerei capturas de tela de blocos de código e explicarei seus destaques.

Primeiro, você precisa fazer quatro variáveis ​​no Dados aba. Todos os quatro são Para todos os sprites exceto por Velocidade , que é apenas para Mario:

  • Gravidade é uma constante que puxa Mario de volta ao chão quando ele pula.
  • No chão controla se Mario está tocando o solo ou não.
  • ScrollX mede o movimento horizontal da tela.
  • Velocidade (Somente Mario) controla a velocidade com que Mario pula.

Animando o chão

Você já fez duas cópias do seu Chão sprite clicando com o botão direito e escolhendo Duplicado . Arrastar Ground-1 na extremidade esquerda da tela, de modo que seu bloco mais à esquerda toque a extremidade esquerda da tela. Em seguida, arraste o (s) outro (s) sprite (s) terrestre (s) à direita do primeiro. Alinhe as bordas e parecerá que o solo é uma peça sólida.

Aqui está o bloco de código que você precisa para cada Chão sprite:

Isso coloca o solo na parte inferior da tela e, em seguida, simplesmente rola os blocos à medida que Mario se move. ScrollX é a posição dos blocos; 0 é a posição padrão que inicia quando você clica na bandeira verde. Você notará que não pode mover para a esquerda imediatamente após começar.

Para o segundo (e mais) blocos de solo, incremente o 0 dígito em ScrollX + 480 * 0 por um para cada novo pedaço de solo. Isso irá compensá-lo para que role suavemente.

Lógica de Mario

Isso é tudo o que é preciso para os blocos, mas Mario tem muito mais blocos de código. Aqui está o que cada um deles faz, com um breve resumo:

Este bloco de código muda o ScrollX variável quando Mario se move. Sempre que você pressiona para a esquerda ou para a direita, Mario se vira na direção apropriada e dá um passo, incrementando ScrollX por 3. Se você achar que Mario vira de cabeça para baixo quando você move para a esquerda, clique no botão azul eu em seu sprite e certifique-se de que o Estilo de rotação é definido para a segunda opção. Isso o fará girar para a esquerda e para a direita, em vez de em um círculo.

O botão do controlador do Xbox One não funciona

Aqui vemos o código que lida com as mudanças de roupa de Mario. Quando Mario não está no chão, ele tem a fantasia de salto. Sempre que você se move para a esquerda ou para a direita, Mario alterna entre os quadros a cada décimo de segundo. Solte as teclas de seta e o padrão de Mario é seu frame padrão.

Um simples pedaço de código que descobre o No chão variável. Se ele está tocando um dos blocos de solo, No chão é igual a 1 (verdadeiro). Quando ele está pulando, No chão é 0 (falso).

Esses dois blocos de código controlam a velocidade de salto de Mario. À esquerda está um bloco que garante que Mario não terá impulso se ele estiver no chão. Se ele está no ar, sua velocidade é gradualmente reduzida pela gravidade, que é um valor constante. O bloco certo faz Mario pular sempre que você pressiona a barra de espaço. Seu som de salto é reproduzido e a velocidade o impulsiona no ar até que a gravidade assuma o controle.

Nosso último bloco de código para Mario está todo configurado. Quando você clica na bandeira verde para começar, a música começa, todas as variáveis ​​são definidas para seus valores padrão e Mario aparece no meio da tela.

Coletando moedas

Vamos voltar às moedas. Precisamos ter certeza de que, quando Mario agarra um, ele faz um som e desaparece. Vamos fazer um script separado para isso - separar scripts por função é uma prática importante na programação. Uma grande confusão de blocos torna mais difícil descobrir o problema quando algo dá errado.

Este é o nosso script de coleção de moedas:

É muito fácil: sempre que Mario toca em uma moeda, o som da coleção é reproduzido e a moeda se esconde. No código de animação da moeda, colocamos um Mostrar bloqueie para que as moedas reapareçam quando você reiniciar.

Moedas e nuvens de rolagem

Você está quase lá! Uma vez que Mario não se move, mas o solo rola, precisamos nos certificar de que as moedas rolar também para que Mario possa coletá-las. É assim que funciona:

Isso coloca a moeda em um E valor (que é a posição vertical da tela) onde Mario pode pegá-lo facilmente. Em seguida, ele usa uma lógica semelhante aos blocos de solo para rolar em direção a Mario. Observe que aumentamos a taxa de rolagem para 0,75 para que as moedas se movam em direção a Mario rapidamente. Para a segunda e terceira moedas, aumentamos o definir y para campo para -40 e -vinte então eles estão um pouco mais altos e mais difíceis de serem agarrados por Mario. No Defina x para bloquear, aumentar o 150 * 1 para 150 * 3 e 150 * 5 para a segunda e terceira moedas, posicione-as mais à direita, fora da tela.

As nuvens usam um bloco de código quase idêntico:

Novamente, isso coloca uma nuvem em uma altura específica e, em seguida, rola à medida que Mario se move. Para uma segunda nuvem que está na frente de Mario em vez de atrás dele, altere o definir x para bloquear para (ScrollX * 0.1) + (150 * 1) , assim como as moedas.

Adicionar Fronteiras

Por causa da maneira como implementamos o solo e as moedas, você verá as moedas presas na borda da tela até que rolarem para a tela. Isso é feio, então você deve criar um sprite de borda rápida que seja da mesma cor do fundo para esconder isso nos lados esquerdo e direito.

A maneira mais fácil de fazer isso é clicar com o botão direito do mouse no cenário e clicar Salvar imagem do palco . Abra-o no Paint.NET e use a ferramenta pipeta para selecionar a cor de fundo azul. Adicione uma nova camada usando o diálogo inferior direito. Em seguida, use a ferramenta retângulo para desenhar um retângulo azul preenchido em cada lado da tela. Cubra cerca de metade de cada bloco e, em seguida, exclua a camada de fundo.

Salve isso como um arquivo PNG e carregue-o como um novo sprite chamado Fronteira . Como você desenhou as bordas bem sobre a tela, pode alinhá-la perfeitamente.

Então, você só precisa de alguns blocos para que a borda fique sempre na frente:

Expandindo seu jogo

Experimente o produto final aqui !

Configuramos apenas o básico de um jogo Mario juntos. Você pode adicionar muitos elementos ao seu jogo a partir daqui. Tente adicionar Super Mushrooms para energizar Mario, fazendo alguns buracos que Mario deve limpar ou criando uma bandeira de nível final. Com os blocos de construção que você escolheu aqui, você pode adicionar mais sprites, variáveis ​​e lógica para fazer o que quiser. Estamos ansiosos para ver o que você encontrará!

Gostaríamos de agradecer ao usuário do Scratch dryd3418, pois usamos parte do código de seu Super Mario: tutorial de rolagem e salto projeto em nosso próprio projeto para este artigo. Para obter ajuda mais detalhada, incluindo scripts que você pode copiar, verifique outro guia do usuário para fazer um jogo Mario . Se você quiser fazer um caminho mais fácil, confira o Crie seu próprio projeto de jogo Mario que permite arrastar e soltar sprites para fazer um jogo simples.

Observe que em qualquer projeto Scratch, você pode clicar Veja por dentro para abrir o projeto em um editor exatamente como você usou para seu próprio projeto. Isso permite que você tenha uma ideia dos bloqueios que alguém usou para fazer seu projeto funcionar e pode ajudá-lo quando você ficar preso. Disponibilizei meu projeto para todos, então fique à vontade para Veja isto e dê uma olhada no código se precisar de ajuda. Também compactei todos os recursos que usei neste jogo, para que você possa baixe-os para economizar algum tempo.

Interessado em dar um passo à frente? Confira Scratch For Arduino para construir projetos nessa plataforma. Se você estiver pronto para mergulhar, verifique tudo que você precisa para fazer um jogo para iPhone do 'zero'.

como emparelhar o controlador xbox com o pc

Para outras coisas divertidas que você pode fazer com seus filhos, dê uma olhada nestes sites de artesanato e projetos DIY para crianças e adolescentes.

Compartilhado Compartilhado Tweet O email Como limpar o seu PC com Windows usando o prompt de comando

Se o seu PC com Windows estiver com pouco espaço de armazenamento, limpe o lixo usando esses utilitários de prompt de comando rápidos.

Leia a seguir Tópicos relacionados
  • Programação
  • Forma longa
  • Guia Longform
  • Arranhar
Sobre o autor Ben Stegner(1735 artigos publicados)

Ben é editor adjunto e gerente de integração da MakeUseOf. Ele deixou seu emprego de TI para escrever em tempo integral em 2016 e nunca olhou para trás. Ele vem cobrindo tutoriais de tecnologia, recomendações de videogames e muito mais como escritor profissional por mais de sete anos.

Mais de Ben Stegner

Assine a nossa newsletter

Junte-se ao nosso boletim informativo para dicas de tecnologia, análises, e-books grátis e ofertas exclusivas!

Clique aqui para se inscrever