Como criar um jogo para computador educacional para crianças jogar, fazer videogame para não Techies e iniciantes

1. Introdução: Bem-vindo ao primeiro de uma série de tutoriais que analisam como fazer jogos de computador educativos para as crianças brincarem. E eu deveria legendar isso o não-jogo fazer seu guia para fazer jogos. Esta é uma aula para não-tecnologia ECE que gostaria de aprender a fazer alguns jogos educativos simples e divertidos para crianças. Não se preocupe, não vamos aprender a fazer a próxima quinzena e que você não precisa de habilidades super técnicas para poder participar neste curso. Fazer seus próprios jogos educativos é divertido e gratificante, seja para seus próprios filhos, para a sala de aula, para estudar em casa para compartilhar com outros ou até mesmo para vender. E o melhor de tudo, jogos educativos simples não são difíceis de fazer e podem ser desenvolvidos e uma série de maneiras diferentes. Quando fazemos nossos jogos educativos para crianças, não precisamos nos preocupar com eles encontrando conteúdo inapropriado ou inotrope-o. Anúncios protrusos. Podemos criar tipos de jogos que queremos que eles joguem. Estaremos usando ferramentas fáceis de usar e gratuitas. E novamente, fazer a plataforma que estamos usando, que é a construção três, funciona em seu navegador. Portanto, não há arquivos de mecanismo de jogos enormes para baixar e instalar. E quando terminarmos, mostrarei como você pode colocar o jogo finalizado online para compartilhar com outras pessoas, novamente, de graça. Eu também forneci os gráficos e o áudio que você vai precisar com o objetivo de tornar esta uma ótima maneira sem custo para tentar sua mão na tomada de jogos. Este é um aprender fazendo aula. Você vai acompanhar como nós fazemos este jogo de contagem simples e aprender algumas habilidades básicas chave de criação de jogos, bem como seguir ao longo, você pode baixar o arquivo fonte. Você deve querer dar uma olhada nas vogais acabadas? O jogo que estamos fazendo é ideal para ajudar os jovens a praticar a contagem de um a 10. No entanto, mais importante, eu projetei este jogo especificamente para ensinar algumas das habilidades básicas que precisamos para fazer jogos simples que podemos usar para construir e criar jogos mais complexos mais tarde. Espero que gostem do curso. 2. VAMOS COMEÇAR!: Este é o jogo que vamos fazer. É um simples jogo de contagem para crianças, e é chamado de gangues de cenoura. E é assim que funciona. Primeiro lugar para começar. E vemos uma fileira de cenouras. E quando clicamos em um número, o coelho saltou para esse número. E ouvimos uma voz dizendo o número. O Paul. E o número no fundo aqui muda acordo com a cenoura que o bungee jump logo. Então, neste tutorial, vamos aprender como criar este jogo a partir do zero usando software livre. E eu forneci todos os gráficos para você. Vamos aprender a criar animações simples, vai aprender os fundamentos da jogabilidade. E com as técnicas e habilidades que você aprende neste tutorial, seremos capazes de continuar em futuros tutoriais para fazer diferentes chuvas, diferentes tipos de jogos educativos em uma variedade de estilos. Então esta é a plataforma de criação de jogos que vamos usar. Chama-se Construct três, e é um motor de tomada de jogos 2D muito bom. E é adequado para iniciantes, bem como para criadores de jogos mais avançados. E é uma ótima maneira de aprender o básico da criação de gangues. Outra coisa boa sobre a teoria da construção é que ela tem um nível livre. E ainda melhor do que isso, nem precisamos nos registrar para começar a usá-lo. Então vamos em frente, vá para construct.net. E, em seguida, se clicarmos em Experimente agora. E há detalhes do julgamento que estamos usando. E então, se clicarmos em Iniciar nove, você verá que o editor do jogo se abre em uma nova janela. Agora outra característica do construtor é que ele é realmente baseado em navegador, então não precisamos se preocupar em baixar e instalar qualquer software em nosso computador. Uma das coisas a notar quando estamos usando a edição gratuita. Neste caso, estamos usando a edição gratuita e não foram registrados que o número de eventos que podemos usar para tornar nosso jogo um limitado. Então, como não temos registrado no site, foram limitados a 25 eventos, embora eu tenha projetado este jogo, então ele cai dentro dos limites livres, então não precisamos se preocupar lá. Se nos inscrevermos e verificarmos o seu e-mail, temos até 50 eventos, o que nos dá mais flexibilidade novamente. E depois há muitos planos dolorosos que realmente abriram tudo para nós. Mas por hoje, temos tudo o que queremos dentro deste plano gratuito. Portanto, a primeira coisa que precisamos fazer agora é criar um novo projeto. Então, se clicarmos em Novo Projeto, dar ao projeto um nome, eu estou chamando-o de contagem de caracteres. E vamos deixá-lo para que se defina na paisagem 16 por 9. O tamanho da viewport deve ser 1920 por 1080. E vamos deixá-lo para que ele definido na paisagem e folha de eventos. Podemos mudar estes, estes detalhes mais tarde quando o jogo, se quisermos, mas temos que configurar agora. Então, clique em Criar. E este é o editor que usaremos para criar nosso jogo. Então vamos falar um pouco sobre, um pouco sobre o que realmente estamos vendo aqui. No lado direito, estamos vendo os detalhes do projeto. Então este é todos os diferentes objetos e elementos que compõem o projeto feito na parte inferior aqui temos camadas e que vamos estar usando duas camadas para fazer este jogo, mas vamos configurar a segunda camada mais tarde. E, no lado esquerdo, está o painel Propriedades. E é aqui que ele dá detalhes sobre o que realmente está acontecendo dentro de cada um dos objetos. Agora, se reduzirmos um pouco para podermos realmente ver mais do que está acontecendo. Na página. Você vai ver que temos uma linha pontilhada cinza ao longo daqui. E então temos espaço fora para a linha pontilhada cinza. E a razão para isso é porque nós poderíamos fazer um jogo onde nós rolamos de lado a lado, mas nós não vamos estar trabalhando novamente que rola de um lado para o outro. A janela de exibição atua como uma janela. Portanto, queremos que os viewports e o layout do jogo sejam do mesmo tamanho. Então, primeiro de tudo, se nós formos e clicarmos na contagem de cenouras no topo aqui. E então, se olharmos para o painel de propriedades, você verá que definimos o tamanho da janela de exibição para 1920 por 1080, que é o que queremos. Então agora precisamos mudar o layout, que é o bit que está fora da linha pontilhada cinza para o mesmo tamanho. Então, se clicarmos no layout um, você verá no momento que o tamanho do layout é, é duas vezes maior que o tamanho da janela de exibição. Então, se mudarmos isso para 19, 20 e 1080. E agora nosso layout é exatamente o mesmo tamanho que o tamanho da janela de exibição. 3. Como salvar e abrir o arquivo: Antes de ir mais longe, vamos tomar um minuto para falar sobre como abrir e salvar arquivos em construir chuva. Se formos para o projeto de menu e, em seguida, salvar , como você verá, temos uma série de opções aqui. Podemos Cloud Save ou podemos dizer para um único arquivo, estes são os dois principais que estamos olhando. Salvar na nuvem. Esta é a opção que eu uso pessoalmente e isso me permite salvar o projeto no Google Drive ou Dropbox. E como construir três é baseado em navegador e podemos abri-lo em qualquer dispositivo, isso significa que eu posso abri-lo, por exemplo, no meu tablet. Se eu quiser dar uma olhada no projeto no meu tablet, isso significa que eu não preciso me preocupar em transferir arquivos. A outra opção é salva como um único arquivo, e isso salvará um arquivo cpp ponto no seu computador. E, em seguida, como você passar pelo projeto que podemos continuar a salvá-lo e ele irá atualizar. E quando você quiser abri-lo, esse será o arquivo que você abre. Agora, quando se trata de abrir um arquivo, vamos fechar este momento. Então projete, feche o projeto. Se formos para o menu, projeto aberto e, em seguida, temos aberto um arquivo recente, Nuvem aberta. Então, se você salvou em algo como Dropbox ou Google Drive, é aqui que você clicará para abrir o arquivo lá, ou abrir um arquivo local, que é o arquivo que você baixou para o seu computador. Agora, eu forneci um arquivo fonte, que é o projeto completo com os diferentes eventos nele, que você pode abrir e comparar com o seu enquanto você avança, se quiser. Então, para abrir isso, esse é o caso de clicar em abrir arquivo local. Vá para onde você salvou o arquivo que você baixou e basta clicar duas vezes sobre isso. E isso vai abrir na janela para você. Então, isso é tudo o que há para salvar e abrir arquivos e lembre-se de clicar nele. Ele vai salvar ícone aqui em cima como nós passamos pelo projeto para ter certeza de que você salvar tudo. 4. Adicione imagens: Então vamos começar a criar. A primeira coisa que faremos é trazer a imagem de fundo. Agora, há uma série de maneiras que podemos criar imagens dentro do anel de construção. E um dos mais fáceis é simplesmente arrastar a imagem de uma pasta no seu computador. Então, se você abriu a pasta que eu forneci com os gráficos do jogo, se você tem isso aberto no seu computador, procure a imagem de fundo e simplesmente arraste isso para o lugar. E você verá que ele criou a imagem no lado direito na seção do projeto e tipos de objeto, ele irá, quando importamos uma imagem desta forma, ele irá automaticamente trazer o nome do arquivo. Então, se o nome do arquivo não significa nada para você e se não é um, você sabe, se é apenas um monte de números ou algo assim, se você clicar no texto aqui, você pode realmente renomeá-lo para algo que é mais significativo. A seguir, vamos trazer as cenouras. E para fazer isso, faremos as mesmas maneiras que compramos em segundo plano. Então, se formos para a pasta com as imagens de personagens nele, selecione as cenouras 1 a 10, e arraste-as para os layouts. Temos uma cenoura, então precisamos duplicar isso. Temos 10 cenouras na página. Então, para fazer isso, podemos clicar com o botão direito do mouse nas cenouras, certificar-se de que está selecionado e clicar em Copiar e depois Colar. Ou podemos usar atalho de teclado, que é Controle C e, em seguida, Controle V, e, em seguida, clique para criar uma nova cenoura. Precisamos de dez quilates na página. Então eu só vou rapidamente agora passar e colocar o resto das cenouras. Ok, então eu tenho minhas 10 cenouras no lugar, mas você vai ver que todas dizem número um, que é claro que não é o que nós queremos. Então vamos para o objeto cenoura que você verá sob alturas de objeto no lado direito e clique duas vezes em cenouras. E aqui você vê as diferentes sequências que compõem a imagem das cenouras. Temos um e depois temos 10. É óbvio que não queremos isso. Então, se clicarmos no número 10 cenouras, podemos arrastar isso para a posição correta. É um pouco confuso para fazer. Vamos tentar de novo. Então agora as cenouras estão na ordem correta. Então, se fecharmos essa janela, não precisamos salvar quando estamos no editor de imagens. Então podemos fechar esta janela. Então o que temos é que temos um objeto com dez quadros diferentes, e cada quadro é um número diferente que acabamos de ver. Então, se agora clicarmos em uma cenoura e ir para o painel Propriedades no lado esquerdo, podemos realmente ver o número inicial do quadro. Então aqui, o número do quadro inicial é 0. E como vimos quando olhamos para as cenouras em um editor de imagens, número 1, 0, contagem de quadros número 2, quadro número um. Então precisamos passar e alterar o número de quadro dessas transportadoras. Então quadro inicial para este seria o número 2. Clique nas próximas cenouras. Assim, número 3. Faça deste um número 4. Moldura inicial. Eu vou rapidamente passar agora e alterá-los para que eles estão mostrando o número de quadro correto. Então aqui temos nossas cenouras agora corretamente numeradas de um a 10. Então vamos visualizar isso e ver se está correto. Para visualizar. Clique neste pequeno botão Play no topo aqui. Então, clique em pré-visualização. E você diz, ou varchar, sugere entreter. Agora, por que é feito isso? A razão pela qual isso é feito, vamos fechar esta janela, é porque se clicarmos no objeto cenoura, você verá que ele tem propriedades de animação e tem uma velocidade de cinco. Então o jogo acha que estamos realmente animando essas cenouras. E está tentando nos apresentar uma animação, mas nós realmente queremos que as cenouras não se movam. Não queremos que nada aconteça. Então vamos mudar a velocidade para 0. Agora, se jogarmos, já viram os números ficarem onde estão. Não há animações que aconteceram, então isso é bom. Então, no próximo vídeo, veremos a adição de controles de toque para que possamos realmente começar a fazer as coisas acontecerem dentro do jogo. 5. Adicione controles de jogos: Agora vamos adicionar o controle de toque. O toque é outro objeto. Então, para adicionar um objeto ao jogo, se clicarmos com o botão direito do mouse no layout, qualquer lugar nos layouts, clique com o botão direito do mouse, Inserir novo objeto. E estamos procurando o toque porque há tantas opções diferentes que temos aqui. A maneira mais rápida de encontrar um tipo de objeto é começar a digitar e, em seguida, clique duas vezes para adicioná-lo. Então, agora adicionamos se olharmos para a propriedade no projeto desculpe, na seção do projeto no lado direito, você verá que adicionamos o objeto de toque. Nós também adicionamos os objetos de áudio, e isso é o que vamos jogar os números quando começamos com o jogo. Então insira novo objeto, e desta vez estamos procurando áudio. Eu gostaria disso. Também adicionaremos som ao nome do jogo. Então, se nós rolar para baixo o menu no painel do projeto onde ele diz sinais, se clicarmos em sinais, clique mouse e importar sinais, em seguida, importar áudio. Temos os arquivos de áudio na pasta que você tem e baixou e vamos baixar. São todos estes, incluindo a fanfarra. Então nós temos os 10 números diferentes e nós temos o arquivo fanfarra e clique para adicionar coisas. Está processando os arquivos. E, em seguida, se clicarmos em Importar, você verá que eles apareceram agora na mesma seção aqui no lado direito. Então nós temos nosso controle de toque, nós temos nosso áudio, nós temos nossos mesmos arquivos. Então agora é hora de realmente fazer algo começar a acontecer. Antes de avançarmos, vamos apenas clicar para salvar. Então, clique no pequeno ícone de salvar e o jogo está salvando. Até agora, temos trabalhado nos layouts. Então, você poderia chamá-lo de palco. Isso é realmente o que o jogo parece. Agora queremos ir para as folhas de eventos. E é aqui que adicionamos os eventos ao jogo, que é realmente o que faz as coisas acontecerem. Então, clique nas folhas de eventos e ela está aberta no momento. Vamos adicionar um evento. Então, se clicarmos no evento, um evento é feito de duas partes. A primeira parte é a condição. Então, por exemplo, estaremos dizendo que quando um personagem é tocado, queremos que algo aconteça. Então a primeira parte do evento é a condição. Então, neste caso, vai ser um evento de toque. Então, se clicar duas vezes no toque e queremos dizer ao jogo que quando um objeto é tocado, quando um objeto é tocado. Então, estamos clicando em desvirar objeto próximo. E queremos que aconteça quando a cenoura for clicada. Então, clicamos duas vezes nas cenouras e adicionamos isso. Então agora estamos dizendo para o jogo, quando a cenoura é tocada ou tocada, vamos adicionar uma ação apenas para testar isso por enquanto. Queremos a cenoura que definiu um ângulo de 25. Realmente não importa. Isto só para fins de teste. Agora vamos ao Play e ver o que acontece. Então, clicamos na cenoura e muda de ângulo. Então isso parece bom até agora. Então dissemos que quando um personagem é tocado, queremos que o ângulo mude. Mas vamos olhar para isso de novo. No momento. As cenouras mudam, ângulo. É aleatoriamente, que não há nada que diga que tem que ser clicado em sequência. Então nós realmente queremos que as crianças usem este jogo para aprender a praticar, para contar em ordem. Então queremos que eles sejam capazes de clicar em 12345 e nós clicar aleatoriamente sobre as cenouras. Então, se fecharmos isso, aqui é onde precisamos introduzir algo chamado variável global. Agora, uma variável global é simplesmente algo que contém um pedaço de informação. E neste caso, está segurando o número da cenoura que queremos que alguém clique. Então, se clicarmos com o botão direito do mouse e adicionarmos uma variável global, vamos chamar a variável global g count, porque é para isso que vamos usá-la. Queremos que seja um número, que temos algumas opções aqui, mas queremos que seja um número. E vamos apenas pressionar Ok. Então, agora, quando um personagem é contá-lo, nós realmente queremos que esta variável global conte o número de cenouras que foram clicadas. Então, se adicionarmos uma ação aqui, sistema, e se descermos para onde diz variáveis globais e locais, você vê que temos uma opção adicional. Clique nisso. E estamos dizendo que toda vez que um personagem é contado, queremos que um seja adicionado a essa variável global. Então vamos usar isso para ter certeza de que as cenouras são clicadas em sequência. E que nós vamos adicionar outra condição aqui, que irá verificar se o número das cenouras é o mesmo que o número da variável global aqui. Então, para fazer isso, se clicarmos com o botão direito no toque, adiciona outra condição. Queremos que isto seja condicionado com base nas cenouras. Então clique duas vezes em cenouras. E se olharmos aqui, podemos realmente pedir ao jogo para comparar o quadro com outra coisa. Então é isso que queremos. Queremos ter certeza de que o número do quadro é o mesmo que o número de contagem de variáveis globais. Então, se clicar duas vezes sobre isso e estamos dizendo que queremos comparar quadro. Queremos que o número do quadro seja o mesmo que g count. Então, quando as cenouras são clicadas, se o número de cenoura é o mesmo que uma variável global, número de contagem g, então o ângulo é alterado para 25 graus e o sistema adiciona um à contagem g. Então isso vai continuar progredindo à medida que as diferentes correntes são contadas. Então vamos ver como isso funciona. Vou pressionar a pré-visualização 1, 2, e nada acontece se eu tentar clicar fora de ordem. Então está tudo funcionando corretamente. Variáveis globais, parece um pouco confuso agora, mas eles são realmente um recurso muito, muito útil para nos ajudar a gerenciar nossos jogos. Então eu vou pressionar Salvar para que nós temos isso salvo. E vamos adicionar os arquivos de áudio nesta fase. Então essa é outra ação que queremos que aconteça quando as cenouras são tocadas. Então, vamos clicar em Adicionar ação. Desta vez, queremos selecionar áudio. Temos uma série de opções diferentes aqui. Queremos selecionar a peça pelo nome. Então, reproduza áudio pelo nome. Ele vai reproduzir áudio da mesma seção, o que está correto. E queremos adicionar o nome do arquivo. Nós também vamos usar a variável g count para garantir que o arquivo correto seja reproduzido. Então, uma coisa que precisamos fazer agora é fazer com o nome do arquivo de áudio mude automaticamente conforme o número da contagem G muda. Então, para fazer isso entre as aspas aqui, vamos colocar um 0 porque precisamos seguir a estrutura do nome do arquivo que podemos ver aqui, que é 0, 1, 0, 2, 0, 3, e então traço S. Então temos 0. E então vamos adicionar um E que acrescenta um número. E agora vamos colocar g count. E então nós vamos, eu só vou colocar um espaço. E então eu vou colocar, e novamente porque nós queremos anexar o traço S. Então no traço, oops, nós colocamos estes entre aspas também. Então abra aspas, traço S maiúsculo, feche aspas. Então isso é replicar os números que vemos nos nomes de arquivos aqui. Então 0, Jie conte. Então digam, contagem é 11, traço S e pronto. Então eu vou clicar feito. E agora vamos jogar. E espero que isso ouça um barulho de macaco chimpanzé. Voz de macaco, desculpe, lendo os números enquanto passamos. Então vamos ver como isso vai correr. Certo, então se fecharmos isso, vamos salvar isso. E no próximo vídeo, vamos olhar para adicionar alguns sinos e assobios como o que é o coelho para o jogo? 6. : Antes de adicionarmos o coelho ao jogo, vamos mudar a forma como a cenoura se comporta. No momento. Nós o definimos para que quando o personagem é clicado, as cenouras mudem seu ângulo para 25 graus. Vamos mudar isso para que faça algo um pouco diferente. Então, se nos certificarmos de que o personagem está selecionado no painel do projeto e, em seguida, vá para o painel Propriedades no lado esquerdo. E vocês verão aqui que temos algo chamado comportamentos. E os comportamentos fazem exatamente isso. Eles mudaram a forma como o objeto se comporta. Vamos clicar nisso e adicionar um novo comportamento. E vocês verão que temos uma variedade de comportamentos diferentes que podemos adicionar ao nosso objeto. Estamos à procura de uma coisa chamada “tween”. Então é o mesmo que é quando adicionamos um novo objeto, é mais rápido começar a digitá-lo e selecionar a partir daqui. Então, se clicarmos duas vezes para selecionar interpolação, e isso agora é adicionado ao nosso objeto. Interpolação é uma forma de animação e interpolação e objeto entre dois estados. Assim, por exemplo, que ele pode interpolar um objeto entre 100% de opacidade e 0 ou positivo, ou pode interpolar Um objeto, movê-lo entre dois pontos na página. Vamos fechar isso e colocar isso em prática. Vamos deletar a ação das cenouras que temos no momento. Então clique com o botão direito do mouse e exclua e adicione uma cenoura de ação. Estamos à procura da interpolação. Vamos intercambiar uma propriedade. Vamos selecionar Opacidade. E quando é clicado, queremos que ele se torne mais transparente. Então vamos mudar isso para 50. 50. Então isso será 50% de opacidade. E queremos que seja preciso, digamos 2.5º para fazer isso. Então isso é 2.5º. E queremos que seja parcialmente transparente e, em seguida, volte a ter capacidade total novamente. Então queremos que seja pingue-pongue. Então vamos selecionar Sim aqui e ele vai ping-pong de transparência total, opacidade total, desculpe, ligeiramente transparente e volta novamente. Vamos dar uma olhada nisso na prática. Está me dizendo que isso é outra coisa boa sobre construir longe. Ele não vai deixar você colocar em comandos que não fazem sentido. E eu esqueci de colocar um 0 na frente de meio segundo. Então me avise do meu erro. Então 0.5 feito. E agora vamos pressionar Play. E podemos ver que a cenoura , tem uma boa animação acontecendo. Toda vez que é clicado. Vamos trazer os coelhos farão isso exatamente da mesma maneira que fizemos antes. Então, se formos para as folhas de layout e abrirmos a pasta com os gráficos, e teremos Bunny. Então vamos abrir isso. Vamos trazer os gráficos do coelho, mas não aquele dele piscando. Então, destaque os que queremos trazer e arrastá-lo para a posição no momento. Não se preocupe sobre onde ele vai, porque nós realmente só queremos ter certeza que a animação está funcionando corretamente neles. Então vamos dar uma olhada no editor de imagens do coelho. Temos nossas imagens diferentes aqui. E ao contrário das cenouras, nós realmente queremos que a animação ocorra aqui, e queremos que ele se mova um pouco à medida que o jogo passa. Então vamos mudar a velocidade aqui para sete. E queremos que ele faça um loop. Queremos que a animação continue. E queríamos fazer ping-pong, que significa que queremos que ele vá para a frente e depois para trás para a sequência da animação para correr para a frente e depois para trás. E então vamos fechar isso. Vou salvar antes de ir mais longe. E então vamos ver como é o coelho. Então ele tem um pouco de movimento acontecendo lá. E estou muito feliz com a velocidade. Se eu quisesse que ele fosse mais rápido ou mais lento, eu mudaria esse número no editor de imagens e mudaria isso de Sete para outra coisa. Se eu quisesse que fosse diferente, queremos que os coelhos se movam pelas cenouras. Então eu vou apenas mudar o tamanho dele um pouco. Então isso é só um caso de pegar uma das alças e mudar o tamanho dele. E então nós queremos que ele realmente comece o jogo fora dos layouts. Queremos que ele salte para o número um. Nós somos o número um é clicado. Então queremos adicionar um comportamento ao encerramento que realmente o mova. Então, vamos nos certificar de que o objeto coelho esteja selecionado. Se formos para comportamentos, adicione um novo comportamento. E que você vai ver que nós realmente temos um comportamento chamado mover para. Então, se escrevermos em movimento, há o movimento para o comportamento. Então agora podemos programar isso para que o coelho se mova para as cenouras que acabaram de ser tocadas ou tocadas. Então, vamos voltar para a folha de eventos e adicionar uma ação. E esta é uma ação que queremos ter lugar no coelho. Vamos procurar movimento. Movido para a posição. Clique duas vezes sobre isso. Então queremos que o coelho se mude para o lugar que acabou de ser explorado. Então, se alguém for apanhado na cenoura número três, queremos que o coelho mude para a cenoura número 3 para onde acabou de ser tocado. Então vamos colocar em contato ponto x e toque ponto y. oops. Ok. E isso é dizer ao coelho para se mudar para o lugar que foi tocado pela última vez. Então vamos, eu só vou mover isso para o topo. E vamos pressionar Play e ver como isso funciona. Está a mudar-se para o sítio certo, mas está a ocultar o número. E eu não quero que ele faça isso. Quero que os jovens quando estiverem jogando este jogo possam ver o número que está sendo clicado. Então vamos fechar isso. Vamos clicar duas vezes sobre isso para abri-lo. Então, no momento, a posição y, que vai para cima e para baixo na página. Então ele vai para onde acabou de ser tocado. Quero que ele vá para, digamos, 200 pixels acima desse ponto de contato. Então, nesse caso, eu quero colocar em menos 2000 é o topo da página. 1080 é a parte inferior da página. Então, se colocarmos em contato menos uma figura, ele irá acima onde algo foi tocado, toque mais uma figura que irá abaixo. Então vamos colocar menos 200. Isso vai ser uma espécie de tentativa e erro até que tenhamos trabalhado o número que queremos fazer parecer certo, então vamos tentar isso. Está bem, é adivinhar, mas não é perfeito. Então eu vou mudar isso para 300. E vamos jogar isto. Bem, agora ele está pairando acima do número. Assim, os jovens podem realmente ver o número. Como você pode ver enquanto ele está passando, ele está indo em um ângulo às vezes não. Eu gosto muito disso. No entanto, se você realmente preferir que ele esteja indo bem, então ele está sempre em pé. Podemos realmente mudar isso. Três. O que faremos se você quiser, você pode pular esta etapa se quiser. Estou indo em um ângulo. Vamos adicionar um novo evento. E nós vamos adicionar um evento que diz que é um tick de eventos do sistema. Queremos que algo aconteça. Cada carrapato e um carrapato é uma fração de segundo. Então constantemente queremos que o coelho seja colocado em direitos. Não queremos que ele caia num ângulo como vimos. Então, se clicarmos em cada carrapato, adiciona um coelho de ação e temos o ângulo definido. Então ajuste ângulo para 00 é sua posição de ações. Vamos clicar em Concluído. Então agora a cada carrapato, cada fração de segundo durante o jogo, a posição dos coelhos vai ser ajustada para vertical. E agora os coelhos, esse preço como ele se move através dos diferentes Carol. Ok, então vamos fechar isso. A próxima coisa que vamos fazer é adicionar um piscar de olhos ao coelho, uma animação piscando ao coelho, então ele pisca aleatoriamente pelo jogo. Então, para fazer isso, precisamos abrir o editor de imagens. Então, se clicar duas vezes sobre o objeto coelho e precisamos adicionar uma nova animação. A primeira coisa que faremos é mudar o nome disso. Para o primeiro a ficar ocioso. E então, se clicarmos com o botão direito do mouse e adicionarmos Alana, adicione uma animação e altere isso para piscar para adicionar uma nova imagem. Se formos para o ícone em segundo lugar à esquerda, clique sobre isso e selecione o coelho piscando, o coelhinho piscando. E vamos trazê-lo. Vamos deixar a velocidade para 5 porque não queremos configurá-la para 0, porque queremos que o jogo acredite que é uma animação, mesmo que seja apenas um quadro. Para que possamos fechar isto. E então se adicionarmos um evento, vamos dizer ao sistema que queremos que o sistema escolha a frequência que o coelho pisca. Então sistema a cada, porque nós vamos obter seus judeus a cada segundo. Então, se escrevermos, escolha o colchete aberto 0, não, não 0, 1, 2 ou 3, vamos deixá-lo escolher mudar a animação para que ela pisque a cada 12 ou três segundos, feito e adicionar uma animação ao coelho. Então selecionamos coelho, definimos animação e que queremos definir a animação para piscar. Então entre aspas, digite o nome da animação, e isso tem que ser exatamente o mesmo que digitamos no editor de objetos. Então, se capitalizarmos isso, devemos capitalizá-lo, etc. Então, isso é o mesmo feito. Agora vamos pressionar Play e ver como isso parece. Certo, bem, funcionou em tantas doenças piscando, mas ele está fazendo um piscar de olhos, que não é o que queríamos. Então, agora queremos dizer que quando essa animação terminar, queremos que algo mais aconteça. Então, adicione um evento, selecione animações coelho em terminou. Então, quando qualquer animação terminar, ele só tem uma. Então, vamos apenas selecionar isso. Nós o selecionamos novamente e queremos definir a animação de volta para ocioso. Assim que ele piscar, queremos voltar para a animação ociosa. Então, entre aspas, vamos digitar ocioso e pronto. E vamos dar uma olhada e ver como isso está acontecendo. Então podemos ver agora que o coelho está piscando e tem um pouco de piscar aleatório acontecendo lá. Então, para mim, isso parece bom. Então eu vou fechar isso e eu vou salvar. Então eu mencionei que iríamos adicionar um pouco de brilho ao nosso jogo, e isso vai fazer isso no próximo vídeo. 7. Adicione faíscas: Vamos adicionar um pouco de brilho ao nosso projeto, e vamos fazer isso usando um recurso chamado partículas. Então, para fazer isso, precisamos ir para o layout, clicar com o botão direito do mouse e inserir novo objeto. E estamos procurando os objetos de partículas. Então, se começarmos a digitar isso, aqui vamos nós com partículas. Se agora clicarmos em algum lugar nos layouts, ele abrirá o editor de imagens. E eu vou usar branco, mas você poderia usar a paleta de cores para criar qualquer cor. E eu vou criar pequenos círculos. Vou desenhar três ou quatro círculos dentro deste quadrado aqui. Isso vai, isso vai servir. E eu vou fechar isso. Eu vou mover esse maldito. Eu tenho sub-sites. E se olharmos no painel de propriedades, temos a partícula selecionada. Você verá que estamos olhando para as propriedades das partículas. E você verá aqui que temos uma série de configurações. Então, o cone de pulverização no momento está ajustado para 60. Então, 60 graus, eu vou ajustá-lo para 350. A taxa é de 50 e vai mudá-la para 80. É um spray contínuo. Não queremos continuar com um spray. Só queremos um tiro único. Nós queremos que quando a cenoura é clicada, nós só queremos um pouco de, de brilho. Então vamos selecionar um tiro. E a velocidade e o tamanho mudarão o efeito disso. Então voltamos e ajustamos isso mais tarde. Vamos voltar para a folha de eventos e realmente fazer os brilhos acontecerem. Então vamos para as folhas de eventos e o que queremos é quando a cenoura é coletada, é coletada. Então, quando a cenoura é tocada, queremos que as partículas apareçam. Então vamos adicionar uma ação. Queremos que as cenouras criem os brilhos. Então vamos clicar em cenouras e vamos procurar esporte. Queremos que a cenoura crie outro objeto. E neste caso queríamos gerar as partículas. Então, clique duas vezes para adicionar isso. Estamos à procura de partículas. Queremos que isso aconteça na camada um ponto de imagem exatamente como é. E eu vou apenas clicar em Concluído. Agora, se jogarmos, veremos o que realmente acontece. E ali estão os nossos brilhos. O Paul. Agora, isso parece bem. Talvez eu os queira um pouco maiores e talvez eu queira adicionar um pouco de aleatorização lá dentro. Então eu vou fechar isso de novo para mudar o tamanho para 40. Vou mudar a velocidade para 300. E eu vou mudar o randomizador de velocidade para 100 e a taxa de crescimento para 100. Este é o tipo de coisa que você pode brincar e ver que tipo de efeito você gosta. E é uma espécie de tentativa e erro. Então vamos dar uma olhada e ver como isso funciona. E eu gosto disso. Então eu vou manter isso como está e salvar. No próximo vídeo, vamos olhar para adicionar em gráficos de reprodução para o jogo. 8. Fim dos gráficos e botão de jogo novamente: Neste vídeo, vamos adicionar gráficos de fim de jogo para o jogo. Nós não queremos que o jogador chegue até o final do jogo e que ele apenas pare e que ele não seja capaz de fazer nada. Queremos parabenizá-los por terminar e dar-lhes a opção de repetir o jogo. Então, para fazer isso, vamos para o layout novamente e vamos adicionar a imagem é da mesma maneira que ouvimos imagens até agora. Então vamos arrastar as imagens para dentro da pasta de imagem. Tenho uma imagem de peça de novo que vamos usar. E há também um botão play que vai usar que começa com a reprodução novamente imagem. Queremos que isto caia. Quando o jogador atinge a 10ª cenoura. Queremos que chegue a esta posição. E esta posição. Sabemos que o centro nas coordenadas X que está indo largura sábia é 960. Então vamos definir isso para 960. Ops, clique para realçá-lo novamente. E vamos fazer este 390 para que seja fácil de lembrar. Então queremos que o gráfico apareça em 916 e 390 para baixo quando o jogador chegar à 10ª cenoura. Então, vou mudar isso agora. Então não pode ser visto quando começa. Vamos verificar se está na metade da página novamente. Então mude isso para 916. Está bem. E o que faremos antes de avançarmos é adicionar o comportamento de interpolação a isso. Então adicione nova interpolação de comportamento. E se formos para as folhas de eventos, vamos adicionar um sistema de eventos. A maneira como isso iria funcionar no jogo é quando o jogador recebe duas cenouras número 10. Então essa é a variável de contagem. contagem G será o número 10. Este texto suspenso será exibido. No entanto, como estamos testando, não queremos ter que passar por clique, clique, clique, clique, clique, clique em todas as cenouras diferentes para chegar a ele para testar. Então vamos testá-lo usando g count para, por exemplo. Então vamos comparar a variável. Queremos que o sistema faça essa ação quando g é igual a dois. Devemos lembrar de mudá-lo para 10 quando os jogos estiverem prontos para serem jogados. Mas isto é para testes. Então, no GKE é igual a 2. Queremos que o texto final seja gêmeo. Nós configuramos a interpolação. Queremos que o Y vá para o 390. E digamos que queríamos tirar um segundo para chegar lá. Feito. E vamos dar uma olhada e ver como isso se parece em ação. Dois. E aqui está o nosso jogo de jogadores. Isso foi muito lento, ele descendo. Então vamos mudar isso para nada 0,5. E aconteceu um pouco rapidamente que não tivemos a chance de realmente perceber que tínhamos feito isso com sucesso, que o último personagem tinha sido clicado com sucesso. Então vamos realmente fazer isso acontecer depois de um atraso. Então vamos esperar. Então espere por um segundo. Parece bom para mim. Eu não vou arrastar isso acima da ação de texto. Agora estamos dizendo que quando g contagem é igual a dois, vamos esperar um segundo. E então o texto vai descer esperançosamente um pouco mais rápido do que da última vez. Então, vamos pressionar Play. Então 1, 2, e jogar gráfico. Isso parece bom. Está bem, vou guardar isso. E queremos agora fazer uma coisa semelhante com o botão Iniciar. Então clique para destacar que estamos olhando para as propriedades das estrelas. Quer adicionar o comportamento de interpolação veio. E se formos para os layouts, e queremos isso, isso parecia a posição certa. Então é por isso que podemos ver onde podemos ver onde ele ouve em 921. Vamos colocar isso fora da tela para que não possa ser visto. Mudamos o x para 960, então está exatamente na metade da página. E vá para os eventuais meios. O que podemos fazer aqui é duplicar. Estes últimos textos, um que nós fizemos. Então basta Control-C, Control-V ou selecionar Copiar e Colar. Agora, se clicarmos nisso, temos a opção de substituir o objeto, substituído o objeto. Então queremos que isso aconteça, não no livro didático, aconteceu no botão Iniciar. E não queremos que termine em 390, caso contrário, estaria atirando para o topo da página. Queremos que acabe. Acho que era 1920 onde estava antes. Mesma hora. É apenas uma maneira rápida de mudar ou adicionar uma nova ação. Vamos ver como isso se parece. Paulo 2. E nós temos o jogo do jogador e o botão Play entraram no lugar. Então isso parece bom. Então, no momento, vamos voltar um momento. Então, no momento, se clicarmos no botão Play, nada acontece. Então precisamos marcar outro evento. Então adicione evento. E isso é semelhante a como nós definimos quando colocamos as cenouras, onde serão eventos de toque. Então, quando um objeto é tocado, Oops, eu posso voltar atrás. Quando objeto, estou selecionando o botão Iniciar. Então, quando o botão Iniciar é tocado, vai adicionar uma ação. Vamos usar o sistema e queremos esperar um pouco para que não aconteça de repente. Então vamos esperar, esperar por nada, 0,2 segundos. Vamos adicionar outra ação. E nós vamos dizer, depois que ele é ponderado zero 0,2 segundos, queremos que o jogo seja reiniciado, então o sistema reinicie o jogo. Então reinicie e reinicie o layout. Isto é o que queremos que aconteça. E então a outra coisa que queremos que aconteça é fazer jogos é sempre bom para um jogador saber que lá, se eles clicaram ou eles tocaram em algo que queremos saber que o jogo foi registrado lá, clique ou seu toque. Assim poderia fazer uma areia, o objeto se mover um pouco. Ou o que eu gosto de fazer é mudar um pouco a opacidade. Então eu vou adicionar outra ação aqui no botão Iniciar. E eu vou usar o recurso de interpolação entre ir interpolá-lo para 50% de opacidade. E porque temos um atraso de 0,22 zero, não adianta fazer isso mais do que isso. Então eu vou mudá-lo. Então é interpolação para 50% de opacidade em nem 0,2 segundos. Preciso arrastar isso acima do peso. Então acontece enquanto esperamos. E agora vamos dar uma olhada e ver como isso funciona. Paulo 2. Temos de jogar outra vez. Agora, a razão pela qual isso está acontecendo é porque nós não dissemos ao jogo para redefinir g count para 0 quando o jogo é reiniciado. Então ele acha que ainda estamos na contagem G 10, ele ainda pensa errado cenoura 10. Então vamos fechar isto. E eu quero adicionar um novo evento. É um evento do sistema e seu OnStart de layout. Então, no início desse layout, no layout de inicialização, eu vou arrastar isso para o topo. Então sequencial, nós realmente não precisamos fazer isso porque o motor do jogo sabe que este comando está dizendo a ele para fazer algo no início do layout onde quer que ele esteja na página. No entanto, eu gosto de ter coisas para que eu possa ver que ele rapidamente e logicamente quando eu estou visualizando a folha de eventos. Então eu coloquei no topo da página. Então, no início do layout, adicione um sistema de ação. Queremos que o sistema defina o valor de q0 Gantt como 0. Então agora não vai pensar que estamos em dez no final da página quando nós, quando reiniciar o jogo, e ele vai reiniciar o jogo corretamente. Então vamos dar uma olhada e ver como era este lugar. Para clicar. E acabamos com o jogo de novo. Precisamos descobrir por que esse botão está atirando para o outro lado. Mas há outra coisa que quero te mostrar enquanto estivermos aqui. Se você ficar de olho aqui em baixo, neste canto esquerdo, você vai ver que temos um pouco de espumante acontecendo aqui que nós não queremos. Está ali na esquina. E isso é porque se formos para o layout, partículas objeto está realmente sendo executado quando a página é carregada e que estamos vendo isso no canto aqui. Então eu acabei de mover isso para fora do caminho para que não vejamos mais isso agora vamos voltar para as folhas de eventos. Certo, então por que está indo para o lado? Ele está indo para o lado porque eu defini seu, eu queria que isso mudasse a opacidade e eu iria configurá-lo para x. Então eu quero que ele altere a opacidade 50, NÃO x 50. Então ele estava realmente alterando-o para a coordenada x, que é longe à esquerda. Então, agora vamos dar uma olhada nisso. Isso deve estar correto. Então você tem Paul 2. Não temos nenhuma espumante acontecendo no fundo aqui. Reiniciamos a página perfeitamente e que o jogo Paul começa. Então vamos fechar isso e salvar. E no próximo vídeo, vamos criar uma página inicial para o. 9. Início a página e toques de acabamento: Agora vamos criar uma página inicial para o jogo. Muito disso vai ser muito familiar para você. Se formos até a camada, queremos criar um novo layout para a página inicial. Então, se clicarmos e, em seguida, clicar com adicionar um layout, queremos adicionar um layout, e também queremos folhas de eventos. Então clique em configurá-los e você verá que ele criou um novo layout e uma nova aventura para nós. Agora temos dois desses. Vou mudar os nomes para que seja fácil ver o que estamos olhando. Então o layout um é o jogo. Então eu vou mudar esse jogo de sublinhado L. E a camada 2 será o começo. Então L sublinhar começar. E, eventualmente, é uma folha dobrada. Vou usar a mesma convenção de nomes. Então sublinhar jogo e, em seguida, folha para sublinhar pára. A outra coisa que precisamos fazer é quando configuramos o jogo, configuramos com um layouts. Então o jogo acha que vai começar na página do jogo. Agora criamos uma página inicial. Nós realmente queríamos começar na página inicial. Então, se subirmos e clicarmos na contagem de cenouras, e então nas propriedades, se formos até onde diz inicial, e você verá que temos a oportunidade de escolher qual layout queremos começar e queremos começar o layout Iniciar. E também podemos mudar o, o que as pessoas vêem como o jogo está carregando. Vou deixá-la na página inicial da construção três. Agora, se formos para o layout, os layouts iniciais, você verá que temos a mesma situação que tivemos quando montamos o jogo. Onde me deixe ampliar ou diminuir o zoom. Onde temos as viewports é menor do que o layout. O layout tem o dobro do tamanho da janela de exibição. Então faremos exatamente o mesmo que fizemos então. Vamos mudar a largura para 1920, e vamos mudar a altura 1080, 1920. Isso deve ficar bem. E agora podemos ver que a viewport é do mesmo tamanho que o layout. Então, queremos adicionar o fundo a isso. Bem, nós já adicionamos a imagem de fundo, então é apenas um caso de arrastá-la para a posição aqui. E nós já adicionamos o botão Iniciar para que possamos arrastar isso para a posição aqui. Não queremos fazer nada chique com ele se movendo. Só queremos colocá-lo em uma boa posição. Sabemos que 960 é zona central. Só vou mudar isso para 960. Nós queremos, eu só vou fazer isso um pouco maior do que o layout só para não termos nenhum espaço em branco. E vamos adicionar o título à página. Então, um caso de arrastar isso para dentro e o título atual conta, arraste isso para a posição. E isso deve ser 960 também. Você poderia fazer isso de vista, mas porque eu sei que 1960 na metade do caminho horizontalmente, é tão fácil apenas digitá-lo. Tudo bem, parece bem, mas é um pouco chato, então vamos adicionar o coelho a ele. Então, arrastamo-lo para a posição. E vamos adicionar um par de cenouras para que os jogadores tenham um pouco de uma idéia do que o jogo é suspenso. Temos o mesmo problema é que tivemos quando montamos as cenouras na mesma página, precisamos mudar o quadro de animação. Então está mostrando o que queríamos dizer. Quero que diga 1, 2, 3. Então apenas mudou os quadros de animação animal de acordo. Agora, se jogarmos, temos o coelho em movimento, mas não podemos sentar. Não se passa muita coisa aqui e acho que podemos tornar isto um pouco mais interessante. Então, vamos adicionar um efeito de animação ao título e ensiná-los ao botão chamado atribuir. Agora, isso está sob comportamentos. E vamos procurá-lo, assine. E se olharmos sob comportamentos agora adicionamos o comportamento do sinal. Se tivermos uma olhada nas opções de movimento, nós temos que ajustá-lo para horizontal no momento. Então ele vai se mover de um lado para o outro. Ele se move para cima, para baixo, para frente, para trás, muda de largura. Alterar altura, alterar tamanho, mudar ângulo. Vou mantê-lo na horizontal. Vou mudar o período para oito porque não houve um movimento lento e gentil. 50 é uma loucura. Vou te mostrar que é só a imprensa. Podemos ver o que 50 parece como um movimento é bastante de um lado para outro. Vou mudar isso para 13, 25. E eu vou fazer o mesmo com o botão Play. Então eu cliquei no botão play novamente para adicionar ao comportamento. E novamente isso adiciona o comportamento de sinal novamente. E desta vez, em vez de o ter na horizontal, vou fazê-lo mudar o ângulo. Então eu vou mudar novamente o período para oito. E vamos dar uma olhada no que parece. Eu tenho 50 anos. Como se isso fosse demais. Então eu vou mudar a magnitude, eu acho que para 20. E vamos dar uma olhada e ver como isso se parece. Ok, eu acho que isso parece bom. Então agora precisamos ir para a folha de eventos. Então, não está aberto no momento. Então clique duas vezes em e, comece a abrir a folha de eventos. E queremos adicionar um evento, e queremos dizer o mesmo de antes. Quando o botão Iniciar for tocado ou tocado. Queremos ir para os layouts do jogo e queremos que o jogo comece. Portanto, a condição é quando um objeto é tocado e queremos que o objeto seja o objeto de inicialização. A ação que queremos que aconteça. Eu vou colocar em um atraso novamente sistema. Espere. Quero esperar 0,2 segundos. Então 0.2. E eu vou intercalar de novo. Então, comece a interpolação da mesma forma que fizemos no botão de repetição. Quero que a opacidade vá para 50. E eu quero que não leve 0,2 segundos. E depois de ter ponderado 0,2 segundos, eu quero que ele vá para o layout. Então, se escrevermos layouts, vá para Layout. E nós queremos, temos a escolha de layouts e queremos que ele vá para o layout do jogo. Então, isso está feito. Então, agora vamos pressionar Play e ver o que acontece. Então eu clico aqui que estamos no jogo. Paul, pronto para jogar. E é claro que está terminando em, então devemos lembrar de mudar essa variável global em um minuto. Então vamos fechar isto. Uma coisa importante a notar agora é que agora temos duas lâmpadas. Quando visualizarmos o jogo, ele irá realmente pré-visualizar o último layout que olhamos. Então, se quisermos realmente visualizar todo o projeto, precisamos selecionar todo o projeto, pré-visualizar o projeto. Eu só vou pré-visualizar o projeto novamente. Porque uma coisa que veio à mente é o fato de que no final, porque nós configuramos o comportamento do sinal no botão play, ele está realmente se movendo na tela de reprodução novamente também. Então vamos para os eventos do jogo, e vamos começar de layouts. Quando o jogo começa como um evento, isso como uma ação, desculpe, queremos desligar o comportamento de sinal. Então, se descermos e procurar sinal onde diz Set habilita, queremos que ele desativa feito. Agora, vamos dar uma olhada no fim do jogo e que não temos nenhum movimento lá. Claro que, se você quiser fazer o movimento lá, então não há realmente nenhuma razão para parar isso, mas eu acabei de pará-lo. No momento. A transição da tela inicial para a página do jogo é uma ocorrência de bits. Não é muito sutil. Então eu vou adicionar um pequeno recurso de desvanecimento para o jogo, e isso é bastante simples de fazer. Então vamos para o layout Iniciar. E eu vou adicionar um novo sprite. Então nova imagem. Então clique com o botão direito do mouse, Inserir novas sprites Eu mesmo vou criar isto. Então eu vou apenas clicar. Se formos para essas duas setas, este exercício, quero que preencha toda a cena, o layout, então vou configurá-lo para 1920 por 1080. Ok. E eu vou fazer isso um verde muito escuro. Então eu vou usar a ferramenta de preenchimento de balde e isso criou o efeito verde. Eu vou renomear isso porque no momento ele vai ser chamado de sprites, o que vai ser confuso se eu tiver muitos sprites. Então eu vou mudar isso para fader porque é isso que é. Essa é uma função que vai jogar. Eu vou adicionar um comportamento e eu vou adicionar interpolação sobre isso também. Eu vou colocá-lo em posição como esta. E eu vou definir a opacidade para 0. Agora, uma das desvantagens de ter este fader sobre todos os layouts é o fato de que quando eu tentei clicar em algo, eu clico no fader. Então eu vou adicionar uma nova camada no topo, e eu vou fazer isso a camada fader. Então adicione a camada na parte superior. Vou mudar o nome disto para fader. Vou clicar no objeto fader no painel do projeto. E se formos até Propriedades, você verá camadas. Vou mudar a camada para fader. E eu vou torná-lo invisível. Então eu não posso ver. Ele ainda está funcionando, mas isso só significa que eu não preciso me preocupar não ser capaz de clicar em nada agora eu posso clicar sobre as coisas muito felizes. Vá para o início do evento. E com um gesto de sapateado. Queremos que o fader entre. Queremos que ele vá para a capacidade máxima. Então adicione um fader de ação. Estamos procurando entre a interpolação uma propriedade. Opacidade. Queria ir para Vamos fazê-lo ir para 80, não ir para a capacidade total. E queremos que aconteça em nada 0,2 segundos. Então 0.2. E se você se lembra, temos uma série de opções no fundo aqui, e uma delas é destruída. Para conseguirmos que ele se destrua quando terminar, porque não precisamos mais dele. Então, vamos fazer isso. Agora. Vamos dar uma olhada e ver. Eu quero que isso aconteça, obviamente antes de irmos para o layout do jogo. Caso contrário, as pessoas não vão ver e eu quero que aconteça antes dos pesos. Então vamos colocar isso na posição correta. Agora queremos que o fader aconteça. Queremos a opacidade da interpolação. Queremos que não espere 0,2 segundos, e então queremos ir para o jogo. Então vamos dar uma olhada. E temos o fader que acontece antes de irmos ao jogo. Mas é claro que isso está indo apenas em uma direção, o fader quando de nada para 80 e, em seguida, para nada na página do jogo. Então, queremos reverter isso. Então, se formos para os layouts do jogo e vamos fazer o mesmo. Então vamos adicionar uma camada no topo. Vou chamar isso de fader. Verifique se a camada de fader está selecionada e arraste o fader. E mude a opacidade desta vez para 80. E vamos fazer o mesmo que fizemos na outra página, vamos desligar, certificar-nos de que o aluno 0 está selecionado e podemos clicar nas coisas novamente. E vamos às folhas de eventos para o jogo. E no início do layout. Então, queremos adicionar uma ação, então adicione fader. Queremos que seja interpolação. Deseja interpolar a opacidade para 0. Queremos que isso não leve 0,2 segundos. Então nada 0,2. E queremos destruí-la no final. Não vai servir a nenhum propósito. Ok, então agora vamos dar uma olhada. Vamos jogar o projeto. Olhe para a coisa completa. Então clique para começar, tem o fader entrar e o fader sai. Sutil, mas apenas quebra as instâncias de mudança de um layout para o outro. Enquanto adicionamos um tipo de sinos e assobios para o projeto. Você notará na pasta de imagens que havia um par de nuvens e uma imagem filho. Então, podemos adicioná-los ao, para a página. Então vamos começar com o jogo vai ganhar layouts. E vamos trazer o sol. Isso é um pouco pequeno. Então eu vou fazer isso um pouco maior. E vamos trazer as nuvens. Então, há duas imagens para os clientes. Vou juntá-los, juntá-los . Vou fazer isso um pouco maior. Vou selecionar a imagem das nuvens, abrir o editor. E eu vou mudar a velocidade para 0. E eu não quero que ele faça loop. Não há animação deles. Não quero que nada aconteça. Vou copiar e colar. Então, em um par de nuvens e mudar o tamanho para que eles em uniforme. E eu entro para mudar o quadro inicial de um deles para o quadro de animação número 2, só para que pareça um pouco diferente. Agora nós poderíamos realmente colocar as nuvens se movendo um pouco que pudéssemos usar o comportamento do sinal para isso. Então, quando o comportamento ADA no novo comportamento no sinal. Então isso é o mesmo que fizemos antes, e vamos fazer o sinal, então é vertical. E também se move horizontalmente, desculpe, vai mudar, vai fazer isso para que eles se movem em diferentes velocidades cada. Então vamos fazer este movimento ao longo de um período de oito e uma magnitude de 20. Este vai mudar. Então ele muda ao longo de um período de nove e tem uma magnitude de t. E este vai mudar, então é um período de 10. E faremos a magnitude 15. E vamos ver como isso se parece. Ok, então nós temos um pouco de movimento de nuvens acontecendo lá. E vamos fazer o mesmo com o sol, e isso vai colocar o sol para que ele tenha um ângulo. Então ele se move em um ângulo, gira ligeiramente. Então precisamos aumentar o comportamento. Então adiciona sinal é este objeto aqui. Então o sinal é adicionado e eu vou mudá-lo. Então ele se move em uma base angular. Eu não quero que ele se mova muito rápido, então eu vou mudar o período 28, e eu vou mudar a magnitude para 25. Ok, agora vamos dar uma olhada. Ok, então isso parece bom. Uma coisa que precisamos estar cientes é se jogarmos e conseguirmos, que no momento ainda está em dois, então devemos lembrar de mudá-lo. Jogar novamente gráfico está descendo atrás das nuvens. E isso porque a ordem zed ou a ordem em que os itens são empilhados, o item adicionado mais recentemente, a imagem adicionada mais recentemente vai para cima, automaticamente vai para cima. Então, porque adicionamos os clientes, eles foram os últimos objetos que adicionamos. Eles estão no topo do jogo novamente imagem. Então precisamos ir para os layouts do jogo, que é onde estamos. Se selecionarmos Nuvens, todas as nuvens salvas serão selecionadas. Então, se clicar com o botão direito do mouse e vamos para a ordem Zed, queremos enviar as nuvens para a parte inferior da camada. Agora nós os enviamos para a parte inferior da camada, o que significa que eles estão agora atrás do plano de fundo. Então, se selecionarmos o fundo e ir para a ordem zed novamente, oops, e enviado para a parte inferior da camada. Agora vamos jogar isto. O Paul. E nós temos o gráfico de pragas caindo no topo das nuvens. Só precisamos fazer o mesmo com o coelho. Então, se escolhermos o coelho, clique com o botão direito do mouse e vamos movê-lo para o topo. Então a ordem Zed envia o topo da camada. Agora ele saberá quando ele se move que ele estará na frente da nuvem e do filho, e ele obviamente estaria na frente do gráfico do jogo, o jogo novamente gráfico. Mas isso não importa porque... Naquele palco, ele estará deste lado. Então vamos dar uma olhada rápida e ver como isso se parece. Então, os coelhos no lugar certo, temos os botões no lugar certo. Está parecendo bom. Então vamos guardar isso. E antes de avançarmos, porque estou feliz com a aparência. Vou mudar os gráficos finais, que temos aqui. Então, quando a contagem G é igual a dois, que é como nós tivemos para testes. E vai mudar isso de volta para dez. Ok, vamos para os layouts de início e vamos fazer o mesmo aqui. Vamos adicionar o sol. Não precisamos nos preocupar em configurar as animações porque isso já está feito. Isso já está acontecendo. Vamos adicionar as nuvens. Começa. Um par de clientes, coloque um aqui. As nuvens têm na frente do título. Então eu cliquei no título, clique com o botão direito do mouse zed mais velho, enviado para o topo da camada. Então isso é agora na frente das nuvens. E vamos jogar. Ok, então isso está bom. Então, isso é muito bom. Vamos fechar isto. Uma coisa que não fizemos é fazer lá, como um padeiro assinado quando o jogador terminar o jogo. Então vamos ao jogo. Eventualmente, é quando g contagem é igual a 10. Vou mudar isso de novo para, para testes. Certo, queremos adicionar uma nova ação. Vamos adicionar uma ação de áudio. E queremos selecionar Jogar. Queremos que ele toque o arquivo de fanfarra. Então vamos procurar por fanfarra. Clique para selecionar isso. Não queremos isso em loop. Podemos deixar todas as outras configurações como estão. Então, selecione. E nós temos isso. Então aparece na parte inferior. Então o sistema vai esperar por 10 segundos antes de fazer essas ações. E isto é, isto é bom. Queremos ouvir a voz dizer o número dez. E então nós queremos pesos, e então nós queremos que a fanfarra para tocar. Então há outra coisa muito importante que precisamos fazer, e é aí que realmente queremos que isso aconteça. Só uma vez. Queremos que a fanfarra seja acionada apenas uma vez e não se repita. Então, para garantir que isso aconteça, vamos adicionar outra condição. Então adicione uma condição e queremos que o sistema ative esta. Então estamos procurando o gatilho, gatilho uma vez que é verdade. Agora vamos tocar isso e ver como soa. Então, Preview 1, Paul 2. Então isso soa bem. E há outra coisa que podemos fazer e que é colocar no painel de números na parte inferior. Assim, o número que a palavra do número mudará toda vez que o próximo caractere selecioná-lo. Então, para fazer isso, vamos para os layouts de jogos e vamos adicionar os números da mesma forma que adicionamos os outros gráficos. Então vamos selecionar números um a 10, e vamos arrastar isso para o lugar. E queremos que isso seja no meio. Então por volta de 960. Isso parece bom para mim. Vamos clicar duas vezes para abrir o editor e veremos que 10 está no lugar errado novamente. Então vamos mover o dez, então está no lugar certo. Então 1, 2, 3, 4, 5, 6, 7, 8, 9, 10. Isso está parecendo bom. Vamos clicar na animação padrão para que vejamos as propriedades de animação. E nós vamos definir isso como 0 porque como acontece com as cenouras, nós não queremos que isso seja animado, então vamos apenas definir isso como 0 e fechar MPT. Volte para a folha de eventos, e vamos voltar para o topo das cenouras. E vamos definir uma nova ação. Então, os números que queremos quando um caractere é tocado, queremos que o quadro seja definido para o número da contagem G. Então GK não terminou. E queremos que isso aconteça obviamente antes que o novo número seja adicionado à contagem G. Então está mostrando o número atual. Ok, e vamos dar uma olhada e ver como isso parece. Então, mostrando um para começar um. Paulo 2. Isso está parecendo bom. É óbvio que temos de mudar a sua posição. Vamos fazer isso agora antes que esqueçamos. Então jogo de layout. Queremos que o, oops, Queremos que o texto esteja no topo da camada, e queremos que o botão esteja no topo da camada. Então isso vai colocá-los em cima do painel numérico. E então a outra coisa que eu acho que vai fazer é fazer o painel numérico. Nós não queremos que ele realmente apareça até que o número um seja clicado. Então vamos fazer isso agora. Então é 0, 0. Vamos selecioná-lo novamente e dar-lhe-emos o comportamento de interpolação. Então, interpolação. E vamos dizer, vamos para a folha de eventos e vamos dizer como um evento. Então sistema quando G KKT é igual a um, então vamos mudar a opacidade do painel de números. Então, o painel numérico que estamos procurando interpolação entre quando mudamos a opacidade para 100. E faremos isso sem 0,2 segundos. Então, agora vamos dar uma olhada e ver como isso se parece. Então, tocando os painéis numéricos não mostrando, clicamos em um e vemos o número um. Está bem. Uau. 10. Exportação e colocação em linha: Ok, então nós terminamos o jogo e estamos felizes com o que parece. Obviamente, há uma série de outras coisas que você poderia fazer com o jogo. Se você quisesse, você poderia trocar o áudio do esquilo por sua própria voz ou outros tipos de RDA. Mude os gráficos. Mas vamos, vamos exportá-lo agora e realmente colocá-lo online. Então você tinha alguém sentado ao seu lado. Claro, você poderia apenas usar o botão de visualização na página para que eles possam jogar o jogo. Mas queremos compartilhá-lo com outros. Queremos enviá-lo por e-mail e compartilhar o link e mostrar às pessoas o que criamos. Então, vamos colocar o jogo online para que você tenha uma URL única que você possa compartilhar com outras pessoas. É fácil de fazer. Então, primeiro de tudo, precisamos exportar o jogo que é diferente de salvar o jogo. Quando exportamos o jogo, criamos uma pasta de todos os diferentes elementos do jogo que podemos colocar online. Então vamos para o menu, exportação do projeto. E nós temos algumas opções diferentes aqui que vamos usar porque nós vamos colocá-lo na web. Vamos usar as opções HTML5. Se clicarmos nisso, clique duas vezes sobre isso. Podemos acelerar um pouco as coisas. Então podemos dizê-lo para D duplicar imagens, recomprimir imagens, e então nós também podemos minificá-lo. E diz aqui, faz com que seja mais rápido começar. Agora, novamente com este tamanho não vai ser perceptível, mas espero que no futuro vamos estar fazendo jogos maiores e jogos mais emocionantes e jogos com muitos elementos e objetos diferentes que vão ser mais lentos para carga. Então isso é só para mostrar como fazemos. Então vamos selecionar o simples. E depois o próximo. Isso vai levar algum tempo. Não se preocupe, se isso levar mais de minutos para fazer. Então, eu só vou trabalhar o seu caminho e alcançá-lo daqui a pouco. Certo, então, quando terminar, veremos a aba Exportar. Isso provavelmente levou três minutos. Então agora clicamos para baixar a pasta. Isso é baixá-lo. Posso fechar. Então nós temos a pasta baixada antes dos detalhes do jogo e amp. Vamos usar um serviço chamado Netlify para colocar o jogo online. E isso permitirá que você coloque o jogo online para que você tenha uma URL única que você pode compartilhar com outras pessoas. E este é outro serviço gratuito. No entanto, precisamos nos registrar para usar este serviço. Se você tem um blog, por exemplo, um blog WordPress, que você será capaz de carregar o jogo diretamente em seus sites WordPress. Mas eu vou assumir que você não fez, e que nós vamos apenas colocar o jogo rapidamente on-line usando o serviço Netlify para que você tenha um URL que você pode compartilhar com outras pessoas. Então, se você for para o app.net, os sites de moscas, e, em seguida, registre-se e confirme seu registro e, em seguida, faça login. Então, eu só vou fazer login. E se formos a sites. E se você ver aqui, Great Dane, acinzentado, Desculpe, quer implantar um novo site sem se conectar para obter sim, arrastar e soltar a pasta do site aqui. Então você baixou a pasta do jogo e isso provavelmente estará em sua pasta de downloads. Então nós sabemos, então, só precisamos arrastar isso para o lugar. Então eu arrastei isso para aquela caixa lá e ele está carregando e é publicado. Então, vamos voltar aqui. E esta é a URL única do jogo. Então vamos copiar isto e ver se está a funcionar. Vou abrir uma nova janela. E aqui está o nosso jogo a carregar. Então isso está se comportando como esperávamos. Então, se você quiser compartilhar seu jogo com outras pessoas, então é isso. O topo aqui é o seu URL exclusivo. E é tão fácil assim. 11. Jogo Over: Então nós terminamos e criamos um jogo simples e temos online e que você tem um URL que você pode compartilhar com outras pessoas e mostrar a eles o que você fez. E, claro, este é um jogo simples. Não há muito para isso, e há muitas maneiras de melhorar e construir sobre o que criamos. Mas o que é importante é que aprendemos algumas habilidades importantes enquanto criamos este jogo. Aprendemos a montar o jogo. Aprendemos a infraestrutura da maneira de construir e como ela realmente se parece, como as coisas funcionam. Aprendemos como usar variáveis globais para que elas não possam, e isso controla como as pessoas se movem de um objeto para outro objeto. Aprendemos a usar técnicas de animação para trazer o jogo vivo e torná-lo um pouco mais interessante. Aprendemos como adicionar áudio e como fazer com que o áudio seja reproduzido no lugar certo. Usamos técnicas sutis, como o desvanecimento entre as cenas, entre as camadas. Então, em vez de ir de um para o próximo layout e não ser uma sensação elegante, nós realmente introduzimos nossos faders. Então é uma boa mudança suave de um para o outro. Assim, com as técnicas que aprendemos ao criar este jogo, podemos então continuar e criar uma variedade de outros jogos. Poderíamos, por exemplo, em vez de ter cenouras, poderíamos ter livros que são numerados em que se movem, e que o jogador tem que clicar no bug direito. Em ordem, ventos que são livros, poderia ser balões. Os balões estão flutuando ao redor da página ou flutuando para cima e para baixo da página, e que o jogador tem que clicar sobre os balões na ordem certa. Em vez de ter cenouras sentadas lá na página estática, poderíamos ter as cenouras para que caiam do céu e o coelho tem que pegar as cenouras direitos na ordem certa. Portanto, há uma série de maneiras que este jogo pode ser desenvolvido. E eu realmente espero que você vai se juntar a mim em futuros tutoriais onde vamos olhar para construir sobre as habilidades que aprendemos agora para criar uma variedade de diferentes e interessantes jogos educacionais para crianças. Obrigado.