Você pode criar efeitos visuais 2D no Unity com vários métodos diferentes. Para criar um efeito de fogo, por exemplo, você pode animar as chamas quadro a quadro, animar um sprite com um sombreador criado no Shader Graph ou gerar partículas de fogo. Para o último método, você pode escolher o Built-in Particle System, que é executado na CPU, ou usar o VFX Graph e a potência da GPU para gerar milhões de partículas. Ambos os sistemas podem ser usados no mesmo projeto para que você possa escolher o que é melhor para um efeito específico.

Este artigo se concentra no VFX Graph, que pode ser usado em jogos 2D a partir do Unity 2022 LTS.

Há alguns pontos importantes a serem considerados antes de criar efeitos especiais em um projeto Unity 2D:

• Câmeras Se você usar uma câmera de perspectiva, os efeitos ocorrerão em um espaço tridimensional, como nos jogos 3D. Se você usar uma câmera ortográfica, precisará configurar o renderizador do sistema para usar a camada de classificação correta. Leia mais sobre a perspectiva da câmera aqui.
• Pós-processamento Você pode aplicar efeitos de pós-processamento ao seu projeto 2D se escolher o Pipeline de Renderização Universal (URP), por exemplo, adicionando um efeito de floração a um efeito de partícula por meio da estrutura de Volume do URP.
• Os efeitos podem ser obtidos de diferentes maneiras. Por exemplo, um GameObject que representa um efeito pode ter vários GameObjects filhos que usam sistemas diferentes, como sprites com shaders personalizados ou vários sistemas de partículas.
• Clipes de animação: Os clipes de animação podem ajudá-lo a orquestrar efeitos de animação suaves baseados em sprite. Você pode até mesmo usar o sistema de animação esquelética do Unity (com moderação) para controlar partes de um sprite em uma animação de sprite.
• Unity Asset Store Comece a adicionar efeitos visuais ao seu projeto indo até a Unity Asset Store, onde você encontrará muitos efeitos 2D prontos.

Os ativos do Visual Effect Graph são compatíveis com o 2D Renderer usando o Shader Graph no Unity 2022 LTS. Para criar um novo VFX Graph em seu projeto, siga as etapas da documentação.

Os contextos de saída em um gráfico VFX definem como o efeito será renderizado. Os contextos de saída para malhas, como Output Particle Quad, oferecem a opção de adicionar um Shader Graph. Não importa se você começa com uma saída iluminada ou não iluminada, pois o modelo de iluminação será alterado para se adaptar ao Shader Graph. Você pode usar os shaders padrão listados abaixo ou seu próprio shader baseado no Shader Graph.

Para projetos 2D no URP, você pode usar um desses três Shader Graphs baseados em sprite:

• Lit: Para receber luz do sistema de luz 2D
• Não iluminado: Não afetado pelo sistema de iluminação 2D
• Personalizado: Para implementar um modelo de iluminação 2D personalizado

Lembre-se de marcar a opção Support VFX Graph no destino SRP dentro do Shader Graph.

As propriedades expostas em seu gráfico de sombreamento são mostradas em seu gráfico VFX. Você pode substituí-los se necessário, por exemplo, se quiser que um sistema de partículas do VFX Graph controle a mudança de cor do sombreador ao longo do tempo.

A chuva é um efeito comum baseado em partículas nos jogos. Aqui estão as principais etapas usadas para criar a chuva em Happy Harvest com o VFX Graph e a GPU, que permitem o movimento de muitas partículas individuais:

As partículas de chuva (denominadas Visual Effect Rain na hierarquia) são renderizadas na Sorting Layer, acima do solo, mas atrás dos objetos. O motivo disso é que os efeitos de respingos de água aparecem quando as partículas da gota encontram o solo para simular a reação da chuva real. Se as gotas de chuva estiverem visíveis em uma superfície vertical, como um poste de luz, isso pode parecer incorreto. No mundo real, a luz afeta todo o seu ambiente, inclusive as gotas de chuva. Em Happy Harvest, o gráfico VFX para a chuva usa um gráfico de sombreamento baseado em Sprite Lit no contexto de saída para iluminar as partículas de chuva. Sem uma correspondência do Lit Shader Graph para a chuva, seu tom não pode mudar para refletir a mudança de luz ao longo do dia. Salpicos quadro a quadro: Quando a partícula de chuva morre, um bloco Trigger On Die aciona um evento de GPU que gera uma única partícula de flipbook que reproduz uma animação simples de respingo. O Happy Harvest usa o Flipbook Shader Graph UV Block para exibir os diferentes quadros dentro da textura. Como alternativa, você pode usar o Flipbook Player Block dentro do VFX Graph para obter o mesmo efeito.

As partículas de chuva aparecem no primeiro plano (denominado Visual Effect Rain Foreground na hierarquia). Como eles simulam estar perto da lente da câmera, não geram um respingo de água ao atingir o chão.

Uma variação do efeito anterior é usada com o efeito de trovão intermitente(Visual Effect Rain Foreground Thunder). Um efeito sonoro é adicionado ao trovão com um componente VFX Output Event Play Audio. Esse componente vem com os scripts de amostra dos manipuladores de eventos de saída; o contexto do evento de saída o aciona no gráfico. Um clarão de trovão: Uma maneira simples, mas eficaz, de criar esse efeito foi gerar uma partícula única baseada no VFX Graph, inicializada no centro da posição da câmera e grande o suficiente para preencher a tela. O bloco Color Over Lifetime no nó Output altera a cor da partícula avaliando um gradiente ao longo do tempo. Nesse gradiente, as alterações de transparência simulam o piscar e o desvanecimento do clarão do trovão.

A chuva afeta toda a cena em Happy Harvest, mas como apenas uma parte dela é visível pela câmera, muitas das partículas calculadas são desnecessárias. Você pode marcar a opção Frustum Culling no Inspector para evitar a renderização dessas partículas ou usar o mosaico da câmera, um truque empregado na demonstração.

O nivelamento da câmera permite criar e renderizar partículas em uma caixa que corresponde à visualização da cena, dando a impressão de que as partículas são simuladas em todos os lugares da cena. Nenhuma partícula é criada fora da câmera, o que permite reduzir a quantidade de partículas geradas e a alocação da capacidade do efeito sem configurações adicionais.

Para usar o mosaico da câmera no Happy Harvest, a chuva é definida para corresponder às dimensões da câmera usando uma forma Set position: AABox. O formato da câmera (insira o tamanho manualmente, use o MainCamera diretamente ou use o slot aspectRatio) é dimensionado por um multiplicador de tamanho para corresponder às configurações da câmera na cena. A AABox é um pouco maior do que o tamanho real da câmera para evitar um efeito de estalo causado pela seleção. O modo Shape Spawn está definido como Surface porque não há necessidade de gerar o volume inteiro em um projeto 2D (porque o eixo Z não é usado).

Quando essa configuração estiver concluída, você precisará de um bloco Tile/Warp Positions na saída do sistema. Isso está vinculado à câmera Transform para corresponder à sua posição e às dimensões da câmera, como você também desejaria fazer no contexto Initialize do sistema.

Essa técnica também se aplica a efeitos de chuva em 3D, com a exceção de que o modo Shape Spawn deve ser definido como Volume e com um valor diferente de zero para o eixo Z se você quiser uma aparência de profundidade.

Outro efeito comum nos jogos é o fogo. Em Happy Harvest, há uma fogueira aconchegante no quintal e na lareira da casa do fazendeiro. O efeito de fogo consiste em três conjuntos de partículas: Chamas, faíscas e fumaça, todas geradas a partir do mesmo gráfico chamado VFX_Fire.

Animando a chama

A animação suave da chama acontece no nível do sombreador no Shader Graph e mostra o que você pode conseguir usando o poder da GPU e dos sombreadores.

Se você abrir o arquivo ShaderGraph_Firefileno projeto, perceberá que um único sprite(Mask texture2D) é usado para criar uma máscara para dar à chama uma forma oval. A animação e o sprite são criados por meio de um padrão de rolagem "Voronoi" com ruído e uma cor de tonalidade para a chama e o plano de fundo. A máscara alfa usa a mesma forma de chama, mas com um operador Saturate que produz um contorno mais visível.

Os efeitos de faíscas e fumaça, que adicionam detalhes polidos ao fogo, usam o Lit Shader Graph padrão. Uma combinação de alterações nos blocos Velocity (Velocidade), Scale (Escala) e Initial Position (Posição inicial) cria um efeito animado com apenas um sprite necessário. O gráfico dos efeitos de faíscas e fumaça inclui observações para ajudá-lo a recriar os efeitos em seu próprio projeto.

A água usa cáusticos ou ondas com efeitos de transparência semelhantes aos de desenhos animados, de modo que combina com o estilo artístico geral da demonstração. O sombreador de água é otimizado para funcionar com mapas de ladrilhos, que compõem a maior parte do ambiente da demonstração.

O material padrão 2D Lit, chamado Water (Água ), é encontrado no Tilemap Renderer do tilemap. Ele foi trocado por um material personalizado com o sombreador de água. Todos os blocos dentro de um tilemap são renderizados usando o mesmo material, portanto, esse tilemap é usado apenas para os blocos de água.

No gráfico ShaderGraph_Water, os efeitos de água também são gerados a partir de um padrão de ruído de Voronoi invertido esticado para simular os cáusticos (um método comum em cáusticos de água). O movimento oscilante é um produto de um mosaico e deslocamento de UV ao longo do tempo com um efeito de ruído aplicado.

Efeito de refração

O efeito de refração é mesclado à textura da superfície com o nó Lerp. A refração usa a textura Camera Sorting Layer, que é um instantâneo da renderização da câmera até a camada de classificação definida, o que significa que todos os elementos nas camadas de classificação anteriores aparecerão nessa textura. No Happy Harvest, a renderização ocorre até a camada de classificação Objects, que é a usada para elementos como o personagem. O UV da textura da camada de classificação da câmera é distorcido com um mapa normal gerado com o nó Normal and Height, que usa a mesma textura Voronoi da textura da superfície.

Assista a este tutorial usando a demonstração Lost Crypt 2D para obter um tutorial passo a passo sobre outros efeitos de água em 2D.

Os efeitos discutidos até agora não interagem com a jogabilidade em Happy Harvest; eles fazem parte do ambiente e funcionam independentemente do que está acontecendo na demonstração. No entanto, na maioria dos jogos, você precisará acionar alguns dos efeitos para jogar com base na ocorrência de uma ação no ambiente e/ou com o personagem. Vamos dar uma olhada em alguns efeitos acionados no Happy Harvest.

Efeitos ao usar itens

Alguns efeitos são anexados às ferramentas do personagem, como a lata d'água. O pré-fabricado para a lata d'água, Prefab_Tool_WaterCan, tem três clipes de animação que alteram o sprite com base na direção para a qual o personagem está voltado (para cima, para baixo, para os lados). Nessas animações, há um evento de animação que chama uma função dentro de um componente Tool Animation Event Handler.

Esse script ativa ou desativa as instâncias correspondentes dos gráficos VFX para cada posição referenciada no Inspector.

Efeitos ao iterar com blocos

Alguns efeitos ocorrem nas peças, como cavar e colher. Isso garante que eles não causem problemas com as animações dos personagens ou com a mudança de posição. Quando chega a hora de lavrar uma célula, o efeito de lavoura atua nessa célula e, quando chega a hora da colheita, a célula aciona o efeito de colheita.

Quando o efeito de lavoura é acionado, ele faz referência ao efeito TillingPuff_prefab do componente TerrainManager anexado ao Grid GameObject. Ele se move para o centro do bloco e depois joga. Outros efeitos, como a colheita, chamam o VFX Graph que é referenciado pelo Data/Crops ScriptableObject. Na inicialização do script TerrainManager, é criado um dicionário de pool de efeitos visuais (a variável no script m_HarvestEffectPool) que instancia vários prefabs de efeitos visuais para serem reproduzidos quando necessário.

Os pequenos efeitos em Happy Harvest dão um toque especial à demonstração e a tornam mais agradável de explorar. Algumas delas incluem:

• VFX_DustParticles: Para espalhar a poeira ambiente no ambiente
• VFX/Water: para ondas e respingos sutis de água
• VFX_Leaves: Aciona a queda de folhas dos arbustos quando o jogador passa por eles
• Personagem Aciona um efeito de sopro de fumaça anexado ao personagem; isso é feito com o Built-In Particle System
• P_VFX_Moths: Aciona mariposas que voam perto de holofotes; isso também é feito com o Sistema de Partículas Integrado

Cada um dos efeitos baseados no VFX Graph da lista acima inclui notas que explicam a finalidade de cada nó.

Criado por um desenvolvedor experiente do Unity, com a contribuição de engenheiros e artistas técnicos do Unity, este é o nosso maior guia para o desenvolvimento de efeitos visuais. O e-book fornece uma visão geral completa de como usar as ferramentas de criação de efeitos visuais no Unity para criar qualquer tipo de efeito: água e líquido, fumaça, fogo, explosões, clima, impacto, mágica, eletricidade - o único limite é a sua imaginação.

Você também pode ver estes dois tutoriais em vídeo sobre como criar efeitos especiais com o VFX Graph:

• Como usar decalques no VFX Graph
• Como criar um efeito de portal usando o VFX Graph