Baixe nosso novo projeto de amostra 2D: Cripta Perdida
Colocamos nossas novas ferramentas 2D à prova para criar uma demonstração de rolagem lateral 2D. Nesta postagem, mostramos como essas ferramentas 2D integradas podem ajudar você a criar visuais de alta qualidade com o Unity.
Equipes altamente qualificadas vêm criando lindos jogos 2D com o Unity há anos, mas queríamos permitir que todos, desde artistas individuais até grandes equipes, tivessem ainda mais ferramentas 2D disponíveis para criar jogos com ótima aparência. E muitos deles estarão prontos para produção como parte do Unity 2019.3, que está atualmente disponível em beta.
Criamos Lost Crypt usando o conjunto completo de ferramentas 2D. Esta cena animada apresenta animação, efeitos de luz, terreno orgânico, shaders e pós-processamento, tudo feito nativamente em 2D. Ele mostra como equipes e projetos de todos os tamanhos, direcionados a qualquer plataforma, agora podem obter resultados mais envolventes e bonitos com mais rapidez.
Lost Crypt deve rodar bem em qualquer computador desktop e também implementamos controles na tela com o novo Input System, caso você queira executá-lo em um dispositivo iOS ou Android. Em nossos testes, ele rodou a 30 fps em dispositivos comuns, como um iPhone 6S.
Depois de baixar Lost Crypt da Asset Store, recomendamos que você comece com um Novo Projeto em branco e selecione 2D, depois importe o projeto de Meus Ativos no Gerenciador de Pacotes ou clicando em Meus Ativos na sua página da Asset Store. O projeto inclui todos os pacotes 2D que você precisa. Ele então substituirá as configurações do projeto, alterando as configurações de renderização para o Renderizador 2D dentro do Universal Render Pipeline.
Depois de importá-lo, você verá a Cena Principal. Ao clicar em Reproduzir, você poderá jogar normalmente usando as setas do teclado e a barra de espaço para pular.
Os scripts e a lógica do jogo são bastante simples, já que o foco principal da demo era usar ferramentas 2D para materializar a arte conceitual da demo.
Dividimos a demonstração em várias tarefas e escolhemos quais ferramentas 2D aproveitar para esse desafio visual.
O personagem foi desenhado no Photoshop e importado diretamente com o 2D PSD Importer. Abra o arquivo Sara.psb com o Sprite Editor para ver a configuração e o equipamento do personagem. Se você abrir o arquivo com o Photoshop, verá como mantivemos as diferentes partes e nomes de camadas intactos.
Um dos recursos disponíveis com o Universal Render Pipeline é o novo material Sprite-Lit. Comparado ao material Sprite-Default usual, este permite que os Sprites reajam às condições de iluminação 2D.
Importamos os mapas normais dos personagens no Editor de Sprites, usando o menu suspenso Texturas Secundárias. Você pode adicionar mapas Normal e Máscara a personagens animados 2D, Sprites regulares, mapas de blocos e formas de Sprite.
O personagem tem solucionadores IK 2D nas pernas para ajudar o animador a se concentrar no posicionamento correto do tornozelo e das pontas dos pés, para que as pernas sigam de forma realista.
Depois de montar o personagem, fizemos as diferentes animações com a ferramenta Animação e o Animator para controlar esses estados. Você pode ver como a ferramenta funciona nesta palestra da GDC 2019.
O rabo de cavalo do personagem é um GameObject filho diferente e é controlado pela Física 2D. Ele reage realisticamente ao movimento porque cada osso do rabo de cavalo tem um componente Hinge Joint 2D com algumas restrições. Isso permite que o cabelo dela se mova livremente sem enrolar muito ou reagir exageradamente ao movimento da personagem.
Uma das possibilidades mais poderosas de ter iluminação dinâmica em Sprites é alterar a aparência do ambiente. Usando os mesmos Sprites, você pode mudar o clima, a hora do dia ou a escuridão de uma área, o que abre uma riqueza de mecânicas de jogo, desde mecânicas furtivas até mundos ricos e animados.
Controlamos as luzes na cena com scripts simples que contêm um valor de gradiente de cor (cor da luz do dia para a noite) e as luzes e os materiais mudam de cor seguindo o parâmetro Time no GameObject pai. Com esse tipo de configuração, você pode controlar visualmente como diferentes luzes se misturam umas com as outras.
Um dos desafios que os desenvolvedores de jogos 2D enfrentaram nos primeiros dias foi criar terrenos orgânicos, como colinas, declives ou terrenos irregulares, de forma eficiente, o que só era possível por meio de folhas de peças cuidadosamente elaboradas. Anos depois, isso ficou mais fácil de conseguir usando vários Sprites representando partes do terreno, mas o fluxo de trabalho ou o desempenho poderiam ser melhores.
Com o 2D Sprite Shape, você pode gerar terrenos e colisões de forma semelhante à que faria em um aplicativo de desenho baseado em vetores. Você pode ajustar os pincéis (Perfis de Forma de Sprite) e começar a criar sem se preocupar em ter que ajustar muitos Sprites ou colisores conforme você itera no ambiente.
Lost Crypt também usa alguns extras do Sprite Shape, como o script NodeAttach, para anexar elementos à spline, para que eles sigam a spline. Nesta demonstração, as rochas usam esse script e o ConformingSpline na camada de flores para seguir o formato da spline de grama. Você pode usar esse recurso para jogabilidade ou para elementos decorativos, como fizemos na camada de grama em primeiro plano.
Tilemaps é provavelmente uma das ferramentas 2D mais essenciais, não apenas para economizar espaço de memória com pequenos pedaços de gráficos que podem ser "agrupados" e repetíveis, mas também porque é crucial para o design de níveis.
Em Lost Crypt, usamos o 2D Tilemap Editor (disponível no Gerenciador de Pacotes) para recriar o interior da cripta, onde ele usa algumas ferramentas extras de Tilemap (disponíveis no GitHub) para tornar o processo de design de níveis mais eficiente. Por exemplo, usamos Rule Tile, um tipo de ladrilho que permite pintar ladrilhos como se fossem pincéis. Ele seleciona automaticamente o ladrilho certo com base nos ladrilhos ou extremidades vizinhas.
Alguns elementos comuns em jogos são efeitos de fogo, então adicionamos um em Lost Crypt. Começamos criando algumas tochas GameObject usando o Particle System e o Shader Graph para 2D e usamos o nó Sprite-Lit Master para o shader de saída. Fizemos a animação de fogo em uma planilha Sprite tradicional que o Sistema de Partículas usa para reproduzir a animação.
O shader que criamos para a chama utiliza uma cor de matiz HDR para aumentar a intensidade do brilho ao redor do objeto usando o pós-processamento de volume. O GameObject pai contém algumas partículas de faíscas e algumas luzes que iluminam a alcova.
Outro caso de uso comum para shaders são reflexos e refrações (por exemplo, água, gelo, espelhos ou monitores que exibem outra área do nível), que são bastante comuns em jogos.
Conseguimos o efeito de água na cripta inteiramente com o Shader Graph. Expusemos vários parâmetros (como cor da água, velocidade das ondas, distorção, efeito cascata, etc.), o que nos permitiu ajustar a aparência final na Cena. Para projetar uma imagem espelhada do ambiente, adicionamos uma câmera adicional que geraria a imagem em uma textura para ser lida pelo Shader Graph. Além disso, adicionamos uma passagem de bloom de pós-processamento para fazer os cáusticos da água brilharem, o que dá à superfície da água um efeito agradável.
Uma maneira de animar o ambiente foi fazer os galhos das árvores balançarem ao vento. Para conseguir esse efeito, decidimos ter apenas um shader para cada folhagem da árvore Prefab – isso criaria variedade e evitaria repetições.
No gráfico Vegetação Iluminada pelo Vento, você pode ver como criamos dois efeitos. Um é o efeito de animação ou balanço, que criamos deslocando a posição do vértice seguindo alguns parâmetros que modificam um padrão de ruído. O segundo efeito usa o canal G ou verde para ajustar o tom da luz de contorno ao redor da folhagem.
Estilos de mesclagem de luz são uma coleção de propriedades no renderizador 2D que descrevem como as luzes devem afetar os sprites. Por exemplo, você pode criar um estilo de mesclagem que afetará apenas um canal específico. Quando você adiciona uma luz na cena que usa esse estilo de mesclagem, ela afetará apenas as áreas do Sprite que as informações do canal do mapa de máscara determinam.
No exemplo abaixo, a luz paramétrica usa nosso estilo de mesclagem Direct Lighting, que afeta apenas as áreas indicadas no canal R do mapa de máscara do Sprite.
Lost Crypt tem um pequeno vídeo cinematográfico em que nosso aventureiro pega a varinha mágica na cripta. Para tornar o momento um pouco mais especial, mudamos o clima do ambiente e geramos partículas no momento certo com a Timeline, já que queríamos observar a mudança para a noite. Para acompanhar as partículas voando em direção à floresta, trocamos as câmeras do Cinemachine e colocamos também uma câmera de mesclagem de trilhas de animação.
O anel brilhante que aparece quando você pega a varinha usa luzes do tipo Sprite. O gráfico do anel simplesmente se expande e desaparece, criando uma aura que ilumina o ambiente.
Conseguimos o efeito de brilho de partículas principalmente com o efeito Bloom no pós-processamento de Volume. Além disso, o material/shader para as partículas e rastro usa uma cor HDR para definir quanta intensidade o efeito de pós-processamento deve aplicar a este objeto.
Olhe atentamente para a floresta – você pode ver algumas criaturas espectrais lá. Para fazer isso, criamos um shader que poderia ser usado para outros fantasmas. Eles são transparentes, mas um efeito Fresnel adiciona um pouco de brilho nas bordas do Sprite, fazendo-os balançar como criaturas flutuantes.
Um efeito interessante no shader é o rastreamento da posição de transformação do GameObject da varinha. Por exemplo, quando a varinha está perto dos ghouls, eles ficam mais brilhantes. Para conseguir isso, anexamos um pequeno script à varinha que atualiza sua posição no shader de material.
Os ghouls também têm uma pequena animação que alterna entre um gráfico e outro. Para isso, criamos um mapa de máscaras com gráficos diferentes em cada canal: R com um visual, G com o visual alternativo e B para o efeito Fresnel.
Para uma camada final de polimento, adicionamos alguns efeitos de pós-processamento incluídos no Universal Render Pipeline. Por exemplo, criamos um GameObject vazio e anexamos o componente Volume a ele. Em Lost Crypt usamos bloom, balanço de branco e vinheta, mas há muitos outros efeitos que podem ser usados em projetos 2D, como desfoque de movimento, correção de cor e efeitos de granulação de filme.
Esperamos que a demonstração do Lost Crypt ajude você a entender como usar nosso conjunto integrado de ferramentas 2D para casos de uso semelhantes. Se você tiver alguma dúvida sobre a Cripta Perdida, pode entrar em contato conosco no fórum.
Se você tiver dúvidas específicas sobre nossas ferramentas 2D, confira os tópicos dedicados na seção 2D do fórum e em Recursos Beta e Experimentais.
Quer conhecer os bastidores de Lost Crypt em tempo real? Inscreva-se no nosso animado webinar onde o evangelista de conteúdo global Andy Touch explicará como usamos luzes 2D, shaders e pós-processamento em Lost Crypt. A equipe 2D de P&D também se juntará a nós para responder às suas perguntas sobre o conjunto de ferramentas 2D ou o projeto em si.
Há um número limitado de vagas, então certifique-se de se registrar logo e adicionar um lembrete no seu calendário.