[Post + Vídeo] Novidades na criação de jogos 2D com o Unity 3D

Eae galera, tudo na paz? Espero que sim. Hoje vamos trazer de uma novidade que irá facilitar sua vida na hora de desenvolver um game 2D com o Unity 3D.

A Unity acaba de disponibilizar na sua Asset Store um pacote chamado 2DGame Kit totalmente gratuito que nada mais é que uma coleção de mecânicas, ferramentas, sistemas e recursos para conectar a jogabilidade, tudo isso sem escrever nenhum código. Além disso, o kit disponibiliza um jogo de exemplo mostrando algumas possibilidades que podem ser feitas.

Ao final desse post tem um vídeo demonstrando tudo que vou mostrar aqui, mas vamos começar conferindo um vídeo demonstrativo publicado pela Unity:

Agora que já sabemos do que se trata, irei demonstrar como criar um nível (fase) utilizando essa novidade da Unity.

Comece fazendo o download: 2D Game Kit.

Introdução

Depois da instalação do asset, vamos criar uma nova cena (padrão). Esta cena contém Ellen (o personagem principal), uma pequena plataforma, Healt UI, é tudo que você precisa para se deslocar e atacar.

Criando nova cena

  • No menu superior, clique em Kit Tools.
  • Escolha Create new Scene.
  • Uma nova janela é aberta.
  • No campo vazio ao lado de New Scene Name, digite o nome que você gostaria de chamar sua nova cena.
  • Clique em Create.

Uma nova cena é criada na raiz do seu Project e adicionada nas configurações de compilação para você.

A Unity também abre a nova cena no editor, para que você possa começar a trabalhar nela.

Desenhando um nível

O Game Kit usa o recurso Tilemap feature da Unity, projetado para ajudá-lo a obter um nível de forma rápida e fácil. O kit tem tudo preparado para você, para que você possa começar imediatamente.

Vamos começar a projetar um nível:

  • No menu superior, vá em Windows > Tile Palette (Janel > Paleta de azulejo).

A janela da paleta de azulejo aparece assim:

O kit tem com padrão dois Tilesets o Grassy Rocks e o Alien Structurequepermite que você desenhe seus níveis. Essas tiles usam o sistema Scriptable Tile do Uniy Tilemap.

Para definir o conjunto de tiles na Tile Palette:

  • Clique no Tileset Menu.
  • Clique em Tileset_Gamekit.
  • Escolha o tipo de tile que você mais gosta para seu nível.

Agora vamos pintar alguns tiles na cena para criar um nível;

  • Clique em um tile na Tile Palette para selecioná-lo.
  • Navegue ate a Scene View.
  • Clique com o botão esquerdo e arraste para desenhar seu nível.

Se você cometer um erro, pode segurar Shift e clicar com o botão esquerdo para apagar os Tiles.

Testando seu nível

Agora com seu nível criado hora de testá-lo.

  • Pressione Play na parte superior do editor.

Os controles para Ellen (personagem do jogo) são os seguintes:

No modo de depuração, tem um menu onde você pode ativar ou desativar cada uma das armas de Ellen no Game View. Pressione F12 para mostrar ou ocultar o menu.

Adicionando uma plataforma móvel

Antes de começar a manipular o GameObjects na Scene View, certifique-se de que não está no modo de pintura. Para fazer isso, feche a Tile Palette ou selecione a Move Tool no canto superior esquerdo do editor (você também pode selecionar Move Tool pressionando W em seu teclado).

Agora vamos adicionar uma plataforma móvel ao nosso nível;

  • Navegue até Project Window
  • Vá para Prefabs > Interactables
  • Clique com o botão direito do mouse e arraste o MovingPlatform para a Scene View
  • Verifique se o MovingPlatform está selecionado na hierarquia
  • Pressione W para usar a Move Tool

Use a Move Tool na MovingPlatform para colocá-la onde quiser no seu nível.

Quando você seleciona o MovingPlatform , aparece uma linha pontilhada vermelha, com um gizmo Move Tool no final (a seta vermelha). Isso indica o caminho que a plataforma levará quando o jogo estiver sendo jogado.

  • Use o gizmo Move Tool no final da linha pontilhada vermelha para indicar o caminho que você gostaria que a plataforma demorasse.

Para visualizar o caminho que leva o MovingPlatform , selecione MovingPlatform e siga estas etapas:

  • Navegue até o Inspector
  • No Componente da MovingPlatform , encontre o controle deslizante Preview Position
  • Clique e arraste e veja onde o MovingPlatform irá.

Vamos tornar o caminho desta plataforma um pouco mais complexo, tornando-o loop em um quadrado. Para fazer isso vamos adicionar Nodes.

Os Nodes são pontos de navegação adicionais para o Componente da MovingPlatform.

  • No Inspector, localize o Moving Platform Component
  • Clique em Add Node duas vezes

Isso adiciona duas linhas e gizmos de ponta vermelha adicionais. Use os aparelhos para posicionar seus nodes extras em uma forma quadrada.

Você notará que não há um caminho que vá do último nó de volta ao começo. Se pressionarmos Play agora, ele irá parar no último ponto, volte para trás no caminho e comece novamente.

Você pode alterar as configurações da plataforma para fazê-lo formar um loop;

  • No Componente da Moving Platform, ache a opção Looping
  • Clique no menu suspenso que diz BACK_FORTH
  • Selecione Loop

Isso forma um loop nos aparelhos e a plataforma leva esse caminho.

Nota: O controle deslizante de visualização não visualiza um loop completo, então você precisa pressionar Play para vê-lo completamente em ação.

Cada Componente que o Kit fornece tem muitas opções para personalizar a maneira como eles funcionam.

Abrindo uma portas com eventos

No Kit 2D Game, os eventos nos permitem criar ações. Usaremos os eventos para acionar uma abertura da porta quando o jogador passar em ponto de pressão.

Vamos começar adicionando uma Porta:

  • Na Project Window, vá para Prefabs > Interactables
  • Encontre o Door Prefab e arraste-o para a Scene View. Coloque-o em algum lugar onde ele bloqueie o caminho do jogador.

Agora vamos adicionar o ponto de pressão na cena:

  • Na janela do Project, vá para Prefabs > Interactables e encontre o Prefab de PressurePad
  • Arraste-o para o chão em frente à porta

Nota: Se o jogador parece estar bloqueado pelo ponto de pressão em vez de pisar nele, abaixe-o ligeiramente. O jogador pode facilmente ficar preso contra o colisor.

Alguns eventos já estão definidos; Por exemplo, quando pressionado, o PressurePad toca um som e acende-se. Agora vamos conectar o PressurePadà porta .

  • Na janela Hierarchy, selecione o PressurePad
  • No Inspector, encontre o componente Pressure Pad
  • Na lista On Pressed, clique no + na parte inferior direita para adicionar um novo evento
  • Arraste o Door GameObject da janela de hierarchy para o campo None (Object) no evento
  • No menu suspenso No Function, encontre Animator > Play(string)
  • Na caixa de texto que apareceu no menu suspenso, digite o texto DoorOpening
  • Pressione Play e use as teclas de movimento ( A e D ) para entrar no ponto de pressão e fazer com que a porta abra.

Todos os Animation Clips são armazenados na janela do Project, em Art > Animations > Animation Clips. Para reproduzir diferentes Animadores em um Evento, você deve combinar o nome (string) do Animation Clip exatamente.

Dica: Se você quisesse gravar um interruptor em vez de colocar um ponto de pressão, você pode fazer isso usando os mesmos passos, mas selecionando o ResusableSwitch na pasta Prefabs.

Inimigos

O kit disponibiliza dois inimigos pré-fabricados: Chomper e Spitter. Encontre estes inimigos na janela Project, em Prefabs > Enemies.

Ambos são controlados pelo componente de Enemy Behaviour no inspetor. Você pode usar este Componente para ajustar propriedades como a velocidade do inimigo, o campo de visão (FOV), a saúde e muito mais. Cada inimigo tem o mesmo Componente, eles são configurados de forma ligeiramente diferente. Observe que, além de definir valores específicos, você também pode clicar e arrastar para a esquerda / direita nas propriedades do componente para mudar os valores.

Tente adicionar um Chomper à sua cena. Jogue com as configurações para ajustar sua velocidade e campo de visão (FOV). Não se esqueça que enquanto em modo de reprodução, você pode pressionar F12 para garantir que as armas estão habilitados, e atacar com ou K .

Na Cena acima, um Chomper é selecionado. Ajustámos a sua visão (FOV) e View Direction para que ele não veja Ellen até ele se virar:

Danos e Objetos

Nesta seção, exploraremos o sistema de danos. Para fazer isso, passaremos pelas etapas de deixar uma caixa em um Spitter para matá-lo.

Para começar vamos desenhar um nível onde Ellen fique mais alta e o Spitter em uma plataforma embaixo dela, assim:

  • Vá para Prefabs > Enemies e arraste um Spitter para a Scene View
  • Coloque-o na parte inferior do seu nível, perto do penhasco
  • Com o Spitter selecionado, localize o Enemy Behaviour Script
  • Reduza o número da View Distance para que o Spitter não o atire imediatamente enquanto você testar essa jogabilidade
  • Na Project Window, vá para Prefabs> Interactables , e clique e arraste o Prefab PushableBox para a Scene View
  • Selecione PushableBox na janela de Hierarchy e, no Inspector, clique em Add Component
  • Na Search Box, digite Damage
  • Clique em Damager para adicioná-lo ao PushableBox

O Componente Damage diz a qualquer GameObject que tenha um Damageable Component (como um Spitter ou um Chomper) para dar-lhe danos.

Damager é representado por uma caixa de colisão verde como mostrado acima. Esta é a área que causa danos. Isso não está cobrindo o PushableBoxagora, então, quando inserimos a caixa no Spitter, isso não o prejudicará.

Vamos mover esta caixa para que seja aproximadamente o tamanho e a posição do PushableBox . Existem duas maneiras de fazer isso:

  • Primeira maneira selecione e arraste os pontos verdes nas bordas da caixa de colisão verde para cima do PushableBox
  • Segunda maneira no inspetor, localize o Damager Component
  • Ajuste o Offset e o Size para posicionar e dimensionar a caixa de colisão. A maneira mais fácil de fazer isso é clicar com o botão esquerdo nas palavras e arrastar para a esquerda e direita para mudar os valores.

Por fim, precisamos garantir que o dano seja dado ao GameObjects certo. Para isso vamos separar os objetos em Layers no Editor para que possam ser facilmente encontradas:

  • Selecione PushableBox
  • No inspetor, encontre o componente Damager
  • No menu suspenso HittableLayers, selecione a Enemy Layer

PushableBox agora causará danos a qualquer coisa que esteja no Enemy Layer, como o nosso Spitter.

Decoração

O Kit também inclui sprites decorativos, que são todos usados ​​no exemplo do jogo “The Explorer” incluído no Kit.

Para tornar seu nível digno, encontre as decorações na vista do Project em Art > Sprites > Environment. Muitas são armazenadas em subpastas, então não se esqueça de expandir as pequenas setas e ver quais outros sprites estão nessa categoria.

Teleportando o jogador

É possível teletransportar um jogador de uma área em uma cena para outra, ou entre diferentes níveis.

Teleportando dentro de uma cena

Para teletransportar o jogador dentro de uma Cena, precisamos configurar uma transition. Para isso, vamos fazer dois prefabs:

  • TransitionStart
  • TransiçãoEnd

Primeiro, precisamos configurar o ponto de partida da transição:

  • Na janela do projeto, vá para Prefabs> SceneControl
  • Encontre o Prefab de TransitionStart
  • Arraste o TransitionStart para o Scene View . Coloque-o em uma posição em que o jogador toque o Colisor (a caixa verde) ao caminhar. No exemplo acima, o colocamos no outro lado da porta:

Para configurar o destino;

  • Arraste outro Prefab TransitionStart da pasta SceneControl para a Scene View
  • No Inspector, renomeie isso para TransitionEnd:

Agora vamos ligar os dois juntos:

  • Na Hierarchy, selecione o Objeto de Jogo TransitionStart
  • No Inspector, encontre o componente TransitionPoint
  • Arraste a Ellen GameObject da hierarquia para o Transition Point (Script) em Transitioning Game Object
  • Defina Transition Type para a Same Scene

Isso garante que Ellen é o único objeto teletransportado, e que ela é teletransportada na mesma cena.

Agora vamos definir o destino:

  • Arraste o TransitionEnd GameObject para o slot DestinationTransformdo componente TransitionPoint
  • Defina Transition When para On Trigger Enter

On Trigger Enter significa que a transição só se ativa quando o jogador entra no Collider e não em uma tecla pressionada. Se preferir ser teletransportado apenas quando o jogador pressionar a tecla ( E ), defina o Transition Whenpara Interact Pressed.

Teleportando para outra cena

Para fazer a transição do jogador para uma nova cena, precisamos de dois prefabs:

  • TransitionStart é o mesmo prefab usado na seção anterior, ele “envia” o jogador para o destino. Contém um Componente de Transition Start, que define todas as propriedades para onde a teletransportação começa e onde o teletransporte deve levar o jogador. Coloque este prefab onde deseja que a transição comece.
  • TransitionDestination é um prefab que “recebe” o jogador. Ele contém um componente de TransitionDestination. Coloque este prefab em uma cena diferente, onde você deseja que a transição termine.

Configurando TransitionDestination

Vamos configurar o destino primeiro, para que possamos ter todas as informações que precisamos mais tarde, quando configurarmos o ponto de partida. Para adicionar uma transição para uma cena, abra essa cena, navegue até a janela do Project e vá para Prefabs> SceneControl> TransitionDestination. Coloque-o na sua cena, no local para o qual você deseja que o teleporter.

O prefixo TransitionDestinaton contém um componente de Scene Transition Destination:

  • Primeiro, defina a Destination Tag para uma carta. Na verdade, não importa qual letra, desde que seja o único Scene Transition Destination Component na cena com essa letra.
  • Em seguida, diga qual GameObject deve esperar receber. Arraste o GameObject do jogador (Ellen) da janela de hierarquia para o slot de Transitioning Game Object.
  • Finalmente, assegure-se de que sua cena de destino esteja nas configurações de compilação do editor. Para fazer isso, vá para File > Build Settings e clique em Add Open Scenes.

Configurando o TransitionStart

Essas configurações são principalmente as mesmas que na seção anterior, com algumas mudanças:

  • Defina Transition Type para Different Level
  • Defina New Scene Name da cena para a cena a que deseja enviar.
  • Defina a tag da Transition Destination Tag para a letra que você definiu no Transition Destination Component.

Exemplo

Vamos fazer o teleporte do jogador para o primeiro nível do jogo. No seu Transition Start (Script), altere as configurações da seguinte maneira:

  • Defina Transition Type para Different Level
  • Defina New Scene Name para Zone1.
  • Defina Transition Destination Tag para A

Pressione Play e caminhe para onde a transição é. Você deve viajar todo o caminho até o início da Zona1!

Enfim, a maioria dos objetos do kit jogam com o sistema de eventos visto. Explore as Cenas existentes (Zonas 1 a 5) para ver como outros objetos são configurados e usados com eventos e disparadores.

Agora, conforme prometido, mostro em um vídeo tudo que fizemos aqui:

Então é isso, caso tenha alguma dúvida em relação a esse post ou mesmo sobre a game kit 2D não hesite em deixar sua pergunta ou comentário aqui abaixo, ok?

Ahh, e não esquece de curtir e seguir a Vídeos de Ti nas redes sociais, blz?

É isso. Até a próxima!