Menu

19 – Tutorial Intermediário – Cenário 3 – Caverna

Chegamos a terceira fase do nosso jogo!!! Quanto tempo desde o primeiro post? O.o, mesmo com 2 postagens por semana, esse tutorial vai demorar meses para concluir, realmente ficou muito grande O.o

Bom, maaaas sem enrolação, os próximos tutoriais de cenários serão mais light comparado ao ultimo que fizemos que deu muito trabalho. Todavia, embora mais fácil de construir, não signifique mais fácil de jogar! Para o jogador esse tipo de cenário dar um trabalho danado. Basicamente nesse cenário que é em uma caverna, tudo com exceção do personagem, boss e inimigos é escuro o/.

Então a construção do cenário em si é simples e depois aplicamos o efeito de luz nele. E pronto. Será um tutorial bem simples no final das contas.

Estou pensando em usar os sprites do chão do site GameArt2D:

Link Para o site

Link direto para o Download

Peço que exportem os tiles para a pasta Resources/sprites/tiles/fase3:

1 —> caverna_plataforma1 (sprite)
2 —> caverna_plataforma2 (texture)
3 —> caverna_plataforma3 (sprite)
14 —> caverna_plataforma_one_way1 (sprite)
15 —> caverna_plataforma_one_way2 (texture)
16 —> caverna_plataforma_one_way3 (sprite)

Quanto ao background eu não achei nenhuma imagem gratuita legal para usar, mas não tem tanto problema. Como estaremos em uma caverna totalmente escura, o background pode ser preto (Embora meio feio).

Agora é adicionar a seguinte ao seu projeto:

tocha

Ela foi disponibilizada por rf (revenger) no site:

http://forum.zdoom.org/viewtopic.php?f=3&t=15080&start=14220

Adicione a imagem com nome tocha à pasta:

28- Tutorial Cenario 3

Essa tocha é do tipo Sprite e Multiple. Já no Sprite Editor, você pode cortar de forma manual já que o automatic sai meio ruinzinho. Mas eu já fiz o trabalho pesado para vocês, então as informações das tochas são:

24- Tutorial Cenario 3 25- Tutorial Cenario 3 26- Tutorial Cenario 3 27- Tutorial Cenario 3

Depois de cortar as quatro tochas é só aplicar. Com tudo isso pronto, vamos de fato a construção do cenário.

Primeiro crie uma nova scene e a defina como Fase3 dentro da pasta scenes. Nessa scene, primeiro vamos em Main Camera, na opção Clear Flags se não tiver Solid Color, mude para Solid Color e em Background escolha a cor preta:

29- Tutorial Cenario 3

Agora iremos criar três objetos: PlataformaEsquerda, PlataformaDireita e PlataformaOneWay. A ideia desse jogo é ter duas plataformas no chão separadas por um vazio (buraco), que se o personagem cair, ele morre. E uma PlataformaOneWay para auxiliar na batalha contra o Boss.

Nesse tutorial eu vou ensinar uma forma não muito corretar de aplicar a iluminação, mas que funciona e consome menos memoria, mas a correta seria ao invés de criar um Material Unlit/Texture para utilizar o tiling, seria criar vários objetos com o sprite render para preencher o espaço ou fazer todo o cenário em um editor de imagem e depois trazer para cá, todo certinho já.

Então vamos criar os materiais na pasta Resources/materials/:

PlataformaCaverna (Shader – Unlit/Texture | Texture – caverna_plataforma2)
PlataformaOneWayCaverna (Shader – Unlit/Texture | Texture – caverna_plataforma_one_way2)

30- Tutorial Cenario 3

No primeiro objeto, PlataformaEsquerda, iremos criar dois outros objetos: Inicio e Fim. É igualzinho ao que fizemos no primeiro cenário com inicio, meio, fim. No objeto Inicio iremos adicionar o Mesh Filter (Quad), Mesh Renderer (PlataformaCaverna) e ajustar o tiling para pegar 1/2 da fase (Lembrando que vamos por ela lá embaixo para ser o nosso chão):

31- Tutorial Cenario 3

No objeto fim podemos por apenas o Sprite Renderer com a imagem caverna_plataforma3 e a posicionar no final da plataforma:

32- Tutorial Cenario 3

Vamos fazer agora o inverso na PlataformaDireita. O objeto “Inicio” terá o Sprite Renderer o objeto Fim terá o Mesh Renderer. Coloquei o nosso personagem para termos uma noção do tamanho da fase:

33- Tutorial Cenario 3

Com essas duas plataformas prontas, então podemos adicionar o Box Collider 2D e o Layer Piso, nelas.

Agora no objeto PlataformaOneWay, vamos criar 3 objetos filhos: Inicio, Meio, Fim. Igual ao cenário 1: no Inicio vamos adicionar o componente Sprite Renderer (caverna_plataforma_one_way1), no Meio os componentes Mesh Filter (Quad) e Mesh Renderer (PlataformaOneWayCaverna), e no objeto Fim vamos adicionar o componente Sprite Renderer (caverna_plataforma_one_way3):

34- Tutorial Cenario 3

Agora nesse objeto (PlataformaOneWay) iremos adicionar a Layer Piso, o Box Collider 2D (Used By Effector marcado) e o Platform Effector 2D:

35- Tutorial Cenario 3

Agora chegou a hora de deixar tudo escuro! Como eu falei, não é a forma mais correta de fazer, pois teríamos que fazer com o Sprite Renderer, mas como estamos utilizando o Mesh Renderer, então clique no objeto Inicio dentro do PlataformaEsquerda e na opção do Shader do Material, mude para Sprite/Diffuse:

36- Tutorial Cenario 3

Ao fazer isso a sombra já será aplicada no objeto e ele não vai perder a textura e nem o tiling:

37- Tutorial Cenario 3

Ou seja, primeiro criamos o material com o Shader Unlit/Texture ou Unlit/Transparent normalmente e só depois de configurar tudo é que mudamos o Shader para Sprite/Diffuse.

Agora crie outro material chamado Sombra com o Shader Sprites/Diffuse:

41- Tutorial Cenario 3

No objeto Fim dentro de PlataformaEsquerda, aonde tem o Sprite Renderer, vamos mudar o Sprite-Default para o material Sombra que acabamos de criar:

38- Tutorial Cenario 3

42- Tutorial Cenario 3

E o Sprite já vai ficar escuro:

43- Tutorial Cenario 3

Faremos o mesmo processo com a PlataformaDireita e PlataformaOneWay (Em Sprite Renderer aplicar o Material Sombra e no Mesh Renderer alterar o Shader do material para Sprite-Diffuse).

Pronto. Nosso cenário já está tudo escuro com exceção do nosso player (Deixa-o com o material normal). Só que não tão escuro, né?

37- Tutorial Cenario 3

Então vamos na opção do menu Window >> Lighting:

45- Tutorial Cenario 3

Um novo menu vai abrir com as configurações das sombras na Scene.

46- Tutorial Cenario 3

Aqui basicamente só iremos mexer em Ambient Source e Ambient Intensity. No Ambient Source temos 3 tipos de luzes:

Skybox -> Considera tudo uma cor só (Claro ou escuro)
Gradient -> Permite a gente cuidar da iluminação vinda de cima (Sky Color), do meio (Equator Color) e de baixo (Ground Color).

47- Tutorial Cenario 3

Color -> Funciona semelhante ao Skybox, só que você define a cor:

48- Tutorial Cenario 3

Podemos deixar Skybox mesmo, porém a intensidade da luz no ambiente será zero:

49- Tutorial Cenario 3

E com isso nosso cenário já vai estar todo escuro:

50- Tutorial Cenario 3

Bom, agora vamos precisar criar umas tochas, né?

Crie um objeto na Scene chamado Tocha e adicione o Sprite Renderer com uma das tochas:

51- Tutorial Cenario 3

Após criar a tocha e ajustar a sua escala, vamos criar a animação dela. Então ainda com a Tocha selecionada na aba Hierarchy, vá na aba Animation e crie uma nova animação dentro de Resources\animations\objetos\tocha com o nome tocha. Sua animação será composta pelos 4 sprites que cortamos:

52- Tutorial Cenario 3

Nossa tocha já está ok, só precisa iluminar o local, né? Então no objeto Tocha vamos adicionar o componente Light (Só buscar por Light, ou vai em Rendering >> Light)

53- Tutorial Cenario 3

Caso o seu objeto esteja no mesmo eixo Z do resto, é importante deixar ele na frente ou seja Z = -1, caso o piso seja Z = 0. Com isso você já deve ser uma luz fraquinha no piso:

54- Tutorial Cenario 3 55- Tutorial Cenario 3

Para aumentar essa luz, no componente Light adicionado, pode aumentar a intensidade da luz:

56- Tutorial Cenario 3

Vamos a algumas explicações aqui então!

O Type da Luz você pode entender melhor tirando a sua câmera da visão 2D:

57- Tutorial Cenario 3

A opção Point funciona como uma tocha, que ilumina tudo ao redor:

58- Tutorial Cenario 3

A opção Spot funciona como uma lanterna:

59- Tutorial Cenario 3

E a opção Directional ilumina como se tudo deste lado gerasse luz:

60- Tutorial Cenario 3

A opção Range determina o alcance da Luz, quanto maior, mais longe a luz chegará.

Em Color podemos definir a cor da luz. Como é uma tocha, podemos fazer uma luz mais amarelada/alaranjada.

61- Tutorial Cenario 3

62- Tutorial Cenario 3

Draw Halo é um efeito de luz ao redor do objeto que cria luz:

63- Tutorial Cenario 3

Quanto menor o Range (Alcance), mais concentrado é o Halo:

64- Tutorial Cenario 3

Para a nossa tocha, podemos deixar o Draw Halo e o Range igual a 15, que fica algo mais equilibrado.
Aqui você já pode transformar essa rocha em um prefab e a espalhar pelo cenário:

65- Tutorial Cenario 3

66- Tutorial Cenario 3

Com isso nosso cenário está mais ou menos pronto. Se preferir já pode criar um objeto chamado Cenario para jogar os conteúdos que criamos lá dentro:

67- Tutorial Cenario 3

Bom, agora vamos precisar criar o script da fase GCFaseCaverna dentro da pasta scripts/controllers. Esse script ele herda os conteúdos de GCFase. A única diferença é que iremos adicionar uma luz baixa ao personagem no método Start:

Script: GCFaseCaverna.cs

using UnityEngine;
using System.Collections;

public class GCFaseCaverna : GCFase {

    void Start() {
        var personagem = GameObject.FindGameObjectWithTag("Player");
        var luz = personagem.AddComponent() as Light;
        luz.intensity = 2f;
        personagem.transform.Translate(new Vector3(0, 0, -1));
    }
}

O que exatamente fazemos no método Start.

1 – primeiro buscamos o personagem através do FindGameObjectWithTag.
2 – Adicionamos o componente Light e já guardamos esse componente na variável luz
3 – aumentamos a intensidade da luz gerada pelo personagem para 2.
4 – Movemos o personagem para um pouco mais perto da câmera na frente dos pisos (Imaginando que o eixo Z da posição do personagem e do piso sejam iguais, então o personagem vai estar a frente do piso).

Basicamente isso. Para finalizar, só precisamos criar mais um script, para o abismo, que é bem simples por sinal. Então dentro da pasta scripts/cenarios, crie um script chamado Abismo. Esse método basicamente só vai ter o método OnTriggerExit2D, que vai verificar se o personagem passou para baixo do collider do objeto que tiver o script Abismo. E se o personagem saiu por baixo. Caso sim, matamos o personagem:

Script: Abismo.cs

using UnityEngine;
using System.Collections;

public class Abismo : MonoBehaviour {

    void OnTriggerExit2D(Collider2D colisor) {
        if (colisor.gameObject.tag.Equals("Player")) {
            //Verifica se está abaixo do objeto com o script
            if (colisor.gameObject.transform.position.y < transform.position.y) {
                var personagem = colisor.gameObject.GetComponent();
                personagem.recebeDano(999); //mata o personagem
            }
        }
    }
}

Verificamos se é o jogador através da tag. Caso seja, verificamos se ele está abaixo do objeto abismo. Caso sim, buscamos o script do personagem e aplicamos um dano mortal a ele.

Pronto, todos os scripts estão prontos, então agora é só voltar ao Unity e arrumar tudo!

Primeiro, crie um Objeto na scene chamado GC e adicione o Script GCFaseCaverna:

69- Tutorial Cenario 3

Defina a posição inicial do personagem e informe o nível da fase. Como ainda não temos o boss, colocamos qualquer objeto para testar a fase.

Depois crie outro objeto chamado Abismo com o script Abismo e o Box Collider 2D (Opção Is Trigger selecionada), entre os buracos e abaixo do piso:

70- Tutorial Cenario 3

Crie o LimiteEsquerdo, LimiteDireito com os Box Collider 2D e com a Layer Limites:

71- Tutorial Cenario 3

Adicione o LimiteBoss, logo após a terceira tocha, com a Layer Limites, o Script EventoBoss e o Box Collider 2D (Com a opção Is Trigger marcada):

72- Tutorial Cenario 3

Na Main Camera, adicione o script GC Camera, informando os limites da câmera e a velocidade que ela irá seguir:

73- Tutorial Cenario 3

Adicione o Canvas, junto com os prefabs HUD e Pause.

Depois que tudo tiver configurado aqui. Volte para a Scene MenuFases e no objeto Fase3, informe o nome da Scene que irá ser carregada:

74- Tutorial Cenario 3

Pronto. Agora é só voltar para Main e testar seu jogo.

E terminamos o tutorial 19. Estamos mais perto do final agora e é nesse momento que eu gostaria que o tutorial tivessem apenas 3 fases u.u. Mas chegarei no final, eu prometo o/

Então até o próximo post e qualquer dúvida, deixem nos comentários 😉

Criador do Jogos Indie, amante de jogos, terror, música, anime e programação. Estudante de mestrado com foco em jogos na educação. Louco por Resident Evil e... sei lá, acho que é isso O.o

No comments

Deixe uma resposta

Parceiros

Steam Brasil LoboLimão Centro RPG Lab Indie
Mundo Gamer PodTerror

Anunciantes

Aglomerando - Agregador de conteúdo
Uêba - Os Melhores Links GeraLinks - Agregador de links Piadas Idiotas - São idiotas mas o faz rir Tedioso: Os melhores links LinkLog MeusLinks.com - Informação e conteúdo todos os dias para você! Agregador de Links - Madruga Links 4Blogs - Agregador de conteúdo Está no seu momento de descanso né? Entao clique aqui!