O que você está procurando?
Hero background image
Introdução ao gráfico VFX no Unity

O Visual Effect Graph (VFX Graph) permite a criação de efeitos simples e complexos usando lógica visual baseada em nós. Como um dos principais conjuntos de ferramentas disponíveis no Unity, o VFX Graph permite que artistas e designers criem com pouca ou nenhuma codificação.

Os efeitos visuais são essenciais para criar experiências profundamente envolventes para seus jogadores. E graças aos contínuos avanços de hardware, o que antes estava disponível apenas para os sucessos de bilheteria de Hollywood agora pode ser alcançado em tempo real.

Este artigo é um trecho de nosso e-book de 120 páginas, O guia definitivo para a criação de efeitos visuais avançados no Unity, que orienta artistas, artistas técnicos e programadores usando a versão Unity 2021 LTS do VFX Graph. Aproveite-o como referência para produzir efeitos visuais ricos em camadas e em tempo real para seus jogos.

A CENA DE AMOSTRA DE VFX DA LÂMPADA MÁGICA
A CENA DE AMOSTRA DE VFX DA LÂMPADA MÁGICA
Introdução ao VFX em tempo real no Unity

Para efeitos visuais complexos de nível AAA em plataformas de ponta, use o VFX Graph para criar partículas aceleradas por GPU em uma interface intuitiva baseada em nós.

Mais especificamente, aproveite o gráfico VFX para:

Crie um ou vários sistemas de partículas

Adicione malhas estáticas e controle as propriedades do shader

Crie eventos via C# ouTimelinepara ativar e desativar partes de seus efeitos

Amplie a biblioteca de recursos criando subgráficos de combinações de nós comumente usadas

Use um gráfico VFX dentro de outro gráfico VFX (por exemplo, explosões menores como parte de outro efeito maior)

Visualize alterações em diversas taxas e/ou execute simulação passo a passo

O VFX Graph funciona com o Universal Render Pipeline (URP)* e o High Definition Render Pipeline (HDRP). Ele também adiciona suporte para saídas Lit e renderizador 2D disponíveis com URP. Verifique a comparação de recursos do VFX Graph para todos os pipelines de renderização aqui.

O VFX Graph requer suporte de sombreador de computação para manter a compatibilidade com o seu dispositivo. Os dispositivos suportados incluem:

Plataformas macOS e iOS usando APIgráfica Metal

Plataformas Linux e Windows com APIsVulkanouGLES3

Android para um subconjunto de dispositivos com capacidade de computação de última geração (somente com URP)

Pacotes gráficos principais

A partir do Unity 2021 LTS, você pode instalar o VFX Graph com eficiência em seu projeto. Os principais pacotes gráficos agora estão incorporados ao instalador principal do Unity para garantir que seu projeto esteja sempre sendo executado com o código gráfico verificado mais recente.

Quando você instala a versão mais recente do Unity, os pacotes mais recentes para URP, HDRP, Shader Graph, VFX Graph e muito mais são incluídos na instalação.

Para obter detalhes, consulte Introdução ao VFX Graph ou leia esta postagem do blog.

* Para Unity 2021 LTS em diante, o acesso ao Camera Buffer está disponível apenas com HDRP. Leia mais sobre a compatibilidade do VFX Graph nodocumentação.

O ATIVO GRÁFICO VFX E O COMPONENTE DE EFEITO VISUAL
O ATIVO GRÁFICO VFX E O COMPONENTE DE EFEITO VISUAL
O ativo e componente do gráfico VFX

Qualquer efeito visual no gráfico VFX é composto destas duas partes:

Componente de efeito visual (VFX)anexado a um GameObject na cena

Ativo gráfico de efeito visual (VFX)que reside no nível do projeto

Como o Unity armazena cada gráfico VFX na pasta Assets, você deve conectar cada ativo a um componente de efeito visual em sua cena. Tenha em mente que diferentes GameObjects podem referir-se ao mesmo gráfico em tempo de execução.

Para criar um novo efeito visual, clique com o botão direito na janela Projeto e navegue até Criar > Efeitos Visuais > Gráfico de Efeitos Visuais. Isso resulta no ativo gráfico VFX.

O Unity fornece algumas maneiras de conectar o VFX Graph Asset a um GameObject com um componente Visual Effect:

Arraste o ativo resultante para a vistada cenaouhierarquia. Um novo GameObject padrão aparecerá na janela Hierarquia.

Atribua o ativo a umcomponente de efeito visualexistente noInspetor. Crie umGameObjectseparadamente e use o menuAdicionar Componente.

Com umGameObjectselecionado, arraste e solte o ativo na janelado Inspetor. Isso cria o componente Visual Effect e atribui o ativo em uma ação rápida.

O VFX Graph Asset contém toda a lógica. Selecione uma das seguintes maneiras de editar seu comportamento:

- Clique duas vezes noVFX Graph Assetna janelaProjeto.

- Selecione oVFX Graph Assetna janelaProjetoe clique no botãoAbrirno cabeçalho.

- Clique no botãoEditarpróximo à propriedadeModelo de ativonocomponente Efeito visual.

O ativo é aberto na janela VFX Graph, disponível em Window > Visual Effects > Visual Effect Graph.

A JANELA DO GRÁFICO VFX
A JANELA DO GRÁFICO VFX
A janela Gráfico VFX

Familiarize-se com o layout desta janela, incluindo:

Barra de ferramentas: Para acessar as configurações globais, bem como alternar para vários painéis

Espaço de trabalho do nó: Para compor e editar o gráfico VFX

Quadro-negro: Para gerenciar propriedades e variáveis ​​globais que são reutilizáveis ​​em todo o gráfico

Painel de controle de efeitos visuais: Para modificar a reprodução no GameObject anexado

Certifique-se de deixar algum espaço no layout do Editor para o Inspetor. A seleção de parte do gráfico pode expor determinados parâmetros, como opções de partição e estados de renderização.

UM GRÁFICO VFX PODE CONSISTIR EM UMA REDE COMPLEXA.
UM GRÁFICO VFX PODE CONSISTIR EM UMA REDE COMPLEXA.
Lógica gráfica

Baixe o exemplo completo.

Você deve construir seu efeito visual a partir de uma rede de nós dentro da área de trabalho da janela. O VFX Graph usa uma interface semelhante a outras ferramentas baseadas em nós, como Shader Graph.

Pressione a barra de espaço ou clique com o botão direito para criar um novo elemento gráfico. Com o mouse sobre o espaço de trabalho vazio, selecione Criar nó para criar Contexto, Operadorou Propriedadede um gráfico. Se você passar o mouse sobre um contexto existente, use Create Block.

Abrir um gráfico VFX complexo pode ser assustador no início. Felizmente, embora um gráfico em nível de produção possa incluir centenas de nós, cada gráfico segue o mesmo conjunto de regras – não importa seu tamanho.

Vamos examinar cada parte do gráfico VFX para aprender como eles funcionam juntos.

Sistemas

Um gráfico VFX inclui uma ou mais pilhas verticais chamadas Systems. Os sistemas definem partes independentes do gráfico e abrangem vários contextos. Um Sistema é denotado pela linha pontilhada que enquadra os Contextos que o compõem.

Cada Contexto é composto por Blocosindividuais, que podem definir Atributos (tamanho, cor, velocidade, etc.) para suas partículas e malhas. Vários sistemas podem trabalhar juntos em um gráfico para criar o efeito visual final.

Encontre modelos pré-construídos no menu Criar nó > Sistemas para visualizar alguns exemplos de lógica gráfica.

UM SISTEMA DE PARTÍCULAS VAZIAS
UM SISTEMA DE PARTÍCULAS VAZIAS
Contextos

Na imagem acima, você notará os quatro Contextos presentes no gráfico do sistema de partículas vazio.

O fluxo entre os contextos determina como as partículas são geradas e simuladas. Cada contexto define um estágio de computação:

Gerar: Determina quantas partículas você deve criar e quando gerá-las (por exemplo, em uma explosão, em loop, com atraso, etc.)

Inicializar: Determina os atributos iniciais das partículas, bem como a capacidade (contagem máxima de partículas) e limites (volume onde o efeito é renderizado)

Atualizar: Altera as propriedades das partículas em cada quadro; aqui você pode aplicar Forças, adicionar animação, criar Colisões ou configurar alguma interação, como com Campos de Distância Sinalizados (SDF)

Saída: Renderiza as partículas e determina sua aparência final (cor, textura, orientação); cada sistema pode ter múltiplas saídas para máxima flexibilidade

Sistemas e contextos formam a espinha dorsal da “lógica vertical” do gráfico, ou fluxo de trabalho de processamento. Os dados em um sistema fluem para baixo, de cima para baixo, e cada contexto encontrado ao longo do caminho modifica os dados de acordo com a simulação.

Os sistemas são flexíveis, portanto você pode omitir um Contexto conforme necessário ou vincular várias saídas.

Os próprios contextos se comportam de maneira diferente dependendo de seus blocos individuais, que calculam os dados de cima para baixo de maneira semelhante. Você pode adicionar e manipular mais blocos para processar esses dados.

Clique no botão no canto superior direito de um Contexto para alternar o espaço de simulação do Sistema entre Local e World.

Consulte a Biblioteca Node para obter uma lista completa de contextos e blocos.

EXEMPLOS DE DIFERENTES BLOCOS
EXEMPLOS DE DIFERENTES BLOCOS
Blocos

Os blocos podem fazer praticamente qualquer coisa, desde simples armazenamento de valores para Coloraté operações complexas, como Noises, Forcese Collisions. Eles geralmente têm slots à esquerda, onde podem receber informações de Operadores e Propriedades.

LÓGICA HORIZONTAL
LÓGICA HORIZONTAL
Propriedades e Operadores

Assim como os sistemas constituem grande parte da lógica vertical do gráfico, os operadores constituem a “lógica horizontal” de seu fluxo de trabalho de propriedades. Eles podem ajudá-lo a passar expressões ou valores personalizados para seus blocos.

Os operadores fluem da esquerda para a direita, semelhante aos nós do Shader Graph. Você pode usá-los para manipular valores ou realizar uma série de cálculos.

Use o menu Criar Nó (clique com o botão direito ou pressione a barra de espaço) para criar Nós de Operador.

Propriedades são campos editáveis ​​que se conectam a elementos gráficos usando o fluxo de trabalho de propriedades. As propriedades podem ser:

Qualquertipo, incluindonúmeros inteiros, flutuantes e booleanos

Feito de componentescompostos, comovetores e cores

Elenco e convertido(por exemplo, um número inteiro em um ponto flutuante)

Espaço local ou mundial; clique emLouWpara alternar entre eles

As propriedades alteram o valor de acordo com seu valor real no gráfico. Você pode conectar as portas de entrada (à esquerda da Propriedade) a outros nós Gráficos.

Nós de propriedade são operadores que permitem reutilizar o mesmo valor em vários pontos do gráfico. Eles possuem propriedades globais correspondentes que aparecem no Blackboard.

O quadro negro

Um painel de utilitários chamado Blackboard gerencia propriedades globais, que podem aparecer diversas vezes no gráfico como nós de propriedades.

As propriedades no Blackboard são:

Expor: O ponto verde à esquerda de qualquer propriedade exposta indica que você pode vê-la e editá-la fora do gráfico. Acesse uma propriedade exposta no Inspetor via script usando aclasse Exposed Property.

Constante: Uma propriedade do Blackboard sem um ponto verde é uma constante. É reutilizável no gráfico, mas não aparece no Inspetor.

Novas propriedades são expostas por padrão e, como tal, aparecem no Inspetor. Você deve desmarcar a opção Exposto se quiser ocultar sua propriedade fora do gráfico e criar Categorias para manter suas propriedades organizadas.

TRABALHE COM NÓS DE GRUPO E ADICIONE NOTAS ADESIVAS.
TRABALHE COM NÓS DE GRUPO E ADICIONE NOTAS ADESIVAS.
Nós de grupo e notas adesivas

À medida que a lógica do seu gráfico cresce, use nós de grupo e notas adesivas para reduzir a confusão. Com nós de grupo, você pode rotular um grupo de nós e movê-los como um só. Por outro lado, Sticky Notes funcionam como comentários de código.

Para criar nós de grupo, selecione um grupo de nós, clique com o botão direito sobre eles e escolha Seleção de grupo no menu de contexto . Você também pode arrastar e soltar um nó em um nó de grupo existente mantendo pressionada a tecla Shift para arrastá-lo. Ao excluir um nó de grupo, com a tecla Delete ou no menu de contexto, você não exclui seus nós incluídos.

Enquanto isso, você pode usar Sticky Notes para descrever como funciona uma seção do gráfico, além de deixar comentários para você ou seus colegas de equipe. Adicione quantas notas adesivas você precisar e mova-as ou redimensione-as livremente.

Subgrafos

Um subgráfico aparece como um único nó, o que pode ajudar a organizar a lógica do gráfico. Use-o para salvar parte do seu gráfico VFX como um ativo separado que você pode colocar em outro gráfico VFX para reorganização e reutilização.

Para criar um subgráfico, selecione um conjunto de nós e escolha Converter em operador de subgráfico no menu direito do mouse. Salve o ativo em disco e converta os nós em um único Subgraph Node. Você pode empacotar sistemas, blocos e operadores em diferentes tipos de subgráficos.

Criar um subgráfico é análogo a refatorar o código. Assim como você organizaria a lógica em métodos ou funções reutilizáveis, um Subgraph torna os elementos do seu gráfico VFX mais modulares.

CAMADAS DE EDIÇÃO COM O GRÁFICO VFX
CAMADAS DE EDIÇÃO COM O GRÁFICO VFX
Níveis de edição no gráfico VFX

O VFX Graph suporta três níveis diferentes de edição:

Configuração da instância de ativo: Use isto para modificar qualquer gráfico VFX existente. Designers e programadores podem ajustar os parâmetros expostos no Inspetor para ajustar a aparência, o tempo ou a configuração de um efeito. Os artistas também podem usar scripts ou eventos externos para alterar o conteúdo de pré-autoria. Neste nível, você trata cada gráfico como uma caixa preta.

Criação de ativos VFX: É aqui que a sua criatividade pode realmente assumir o controle. Construa uma rede de nós operadores para começar a criar seu próprio gráfico VFX e configure comportamentos e parâmetros personalizados para criar simulações personalizadas. Esteja você reproduzindo samples existentes ou começando do zero, você pode se apropriar de um efeito específico.

Script de efeitos visuais: Isso oferece suporte a artistas técnicos ou programadores gráficos mais experientes que usam aAPI do componentepara personalizar o comportamento do gráfico VFX. Com scripts de efeitos visuais, sua equipe pode desfrutar de um pipeline mais eficiente para gerenciar efeitos específicos e acessar recursos avançados como buffers gráficos.

OBTENHA O ATRIBUTO COM UM OPERADOR E DEFINE O ATRIBUTO COM UM BLOCO.
OBTENHA O ATRIBUTO COM UM OPERADOR E DEFINE O ATRIBUTO COM UM BLOCO.
Atributos

Um Atributo é um dado que você pode usar em um Sistema, como a cor de uma partícula, sua posição ou quantas delas você deve gerar.

Use nós para ler ou gravar atributos. Em particular, use o:

Obtenha o operador de atributospara ler os atributos no sistemaParticleouParticleStrip

Retornos de chamada experimentaisdo Spawnerpara leitura de atributos emsistemas Spawn

Configure Bloco de Atributopara gravar valores em um Atributo; defina o valor do Atributo diretamente ou use um modo aleatório (por exemplo, defina umAtributo de Corcom umGradiente AleatórioouBloco Aleatório por Componente)

Consulte a documentação para obter uma lista completa de atributos.

Observação: Um Sistema só armazena Atributos quando precisa deles. Para economizar memória, ele não armazena dados desnecessários. Se você ler que o gráfico VFX não armazenou os dados de simulação de um atributo, o atributo passa seu valor constante padrão.

EVENTOS CONTROLAM A PROVOCAÇÃO DE PARTÍCULAS.
EVENTOS CONTROLAM A PROVOCAÇÃO DE PARTÍCULAS.
Eventos

As várias partes de um gráfico VFX se comunicam entre si (e com o resto da cena) por meio de Events. Por exemplo, cada Spawn Context contém portas de fluxo Start e Stop , que recebem eventos para controlar a geração de partículas.

Quando algo precisa acontecer, GameObjects externos podem notificar partes do seu gráfico com o método SendEvent da API C#. Os componentes do Visual Effect passarão o Evento como um nome de string ou ID de propriedade.

Um contexto de evento identifica um evento por seu nome ou ID da string de evento dentro de um gráfico. No exemplo acima, objetos externos em sua cena podem gerar um Evento OnPlay para iniciar um sistema Spawn ou um Evento OnStop para interrompê-lo.

UM EVENTO DE SAÍDA PODE ENVIAR MENSAGENS PARA A CENA.
UM EVENTO DE SAÍDA PODE ENVIAR MENSAGENS PARA A CENA.
Eventos de saída

Você pode combinar um evento de saída com um manipulador de eventos de saída. Eventos de saída são úteis se a geração inicial das partículas precisar gerar outra coisa em sua cena. Isso é comum para sincronizar a iluminação ou a jogabilidade com seus efeitos visuais.

O exemplo acima envia um OnReceivedEvent para um componente GameObject fora do gráfico. O script C# reagirá de acordo para intensificar uma luz ou chama, ativar uma faísca, etc. Consulte a seção Interatividade do e-book VFX Graph para obter mais informações sobre eventos de saída.

Ao mesmo tempo, você pode usar eventos de GPU para gerar partículas com base em outro comportamento de partículas. Dessa forma, quando uma partícula morre em um sistema, você pode notificar outro sistema, o que cria uma útil reação em cadeia de efeitos, como uma partícula de projétil que gera um efeito de poeira após a morte.

Esses blocos de atualização podem enviar dados de eventos de GPU da seguinte maneira:

Evento de gatilho no dado: Gera partículas em outro sistema quando uma partícula morre

Taxa de eventos de gatilho: Gera partículas por segundo (ou com base em sua velocidade)

Evento de gatilho sempre: Gera partículas em cada quadro

As saídas dos blocos se conectam a um GPU Event Context, que pode então notificar um Initialize Context de um sistema dependente. Encadear diferentes sistemas dessa maneira ajuda a criar efeitos de partículas complexos e ricamente detalhados.

O contexto de inicialização do sistema de eventos de GPU também pode herdar atributos disponíveis no sistema pai antes do evento de acionamento. Assim, por exemplo, ao herdar a sua posição, uma nova partícula aparecerá no mesmo lugar que a partícula original que a gerou.

ATRIBUTOS DE EVENTO DE SAÍDA CARREGAM VALORES DO CONTEXTO SPAWN.
ATRIBUTOS DE EVENTO DE SAÍDA CARREGAM VALORES DO CONTEXTO SPAWN.
Atributos do Evento

Use cargas úteis de atributos de evento para transmitir dados como posição 3D ou cor junto com o evento. Essas cargas carregam atributos que percorrem implicitamente o gráfico onde você pode “capturar” os dados em um operador ou bloco.

Você também pode ler Atributos passados ​​com Spawn Events ou Timeline Events. Obloco Set SpawnEvent Attributemodifica o atributo do evento em um contexto Spawn.

Para capturar uma carga útil em um contexto de inicialização, use operadores Get Source Attribute ou Inherit AttributeBlocks.

No entanto, é importante manter estas advertências em mente ao usar atributos de evento:

Atributos de eventos regularessó podem ser lidos no contexto de inicialização. Você não pode herdá-los em Atualização ou Saída. Para usar o Atributo em um Contexto posterior, você deve herdá-lo e configurá-lo em Inicializar.

Os atributos do evento de saídacarregam apenas os valores iniciais definidos no contexto Spawn. Eles não capturam nenhuma alteração que ocorra posteriormente no gráfico.

Consulte Envio de eventos na API do componente Visual Effect para obter mais detalhes.

Explorando o conteúdo de amostra de efeitos visuais

Um gráfico VFX é mais do que a soma de suas partes. Requer um conhecimento sólido de como aplicar nós e operadores, juntamente com as maneiras como eles podem trabalhar juntos.

Os VFX Graph Additions no Package Manager demonstram vários gráficos simples, tornando-os um excelente ponto de partida para aprender como gerenciar partículas.

As seções a seguir apresentam alguns dos blocos e operadores comuns que você encontrará ao explorar os exemplos fornecidos.

RUÍDO E OPERADORES ALEATÓRIOS
RUÍDO E OPERADORES ALEATÓRIOS
Ruído e Operadores

O ruído processual ajuda a reduzir a aparência “máquina” de suas imagens renderizadas. O gráfico VFX fornece vários operadores que você pode usar para ruído e aleatoriedadeunidimensional, bidimensional e tridimensional.

Blocos de Atributos
NÓS FLIPBOOK
NÓS FLIPBOOK
Flipbooks

Uma textura animada pode fazer maravilhas para tornar seus efeitos críveis. Gere-os a partir de uma ferramenta externa de criação de conteúdo digital (DCC) ou de dentro do Unity. Use Operadores para gerenciar o Bloco Flipbook.

Para obter mais informações sobre como criar seus próprios Flipbooks no Unity, verifique o Image Sequencer na seção VFXToolbox do e-book VFX Graph.

Física

Forças, Colisõese Arraste são essenciais para fazer as partículas simularem fenômenos naturais. Mas não tenha medo de ultrapassar os limites do que é real. Como artista, você decide o que parece certo.

O GRÁFICO DE AMOSTRA DO BONFIRE USA TRÊS SUBGRÁFICOS.
O GRÁFICO DE AMOSTRA DO BONFIRE USA TRÊS SUBGRÁFICOS.
Subgráficos de efeitos visuais

Um Subgráfico de Efeito Visual é um ativo que contém uma parte de um Gráfico de Efeito Visual que pode ser usado em outro Gráfico ou Subgráfico de Efeito Visual. Os subgráficos aparecem como um único nó.

Os subgrafos podem ser usados ​​em gráficos das três maneiras a seguir:

Subgráfico do sistema: Um ou váriossistemascontidos em um gráfico

Subgrafo de bloco: Um conjunto deblocoseoperadoresempacotados juntos e usados ​​como um bloco

Subgrafo do Operador: Um conjunto deOperadoresempacotados juntos e usados ​​como um Operador

Os subgráficos permitem fatorar conjuntos de nós comumente usados ​​de gráficos em ativos reutilizáveis ​​para adicionar à Biblioteca.

E-book de efeitos visuais

Obtenha o e-book gratuito

Nosso e-book de 120 páginas, O guia definitivo para a criação de efeitos visuais avançados no Unity, orienta artistas, designers e programadores usando a versão Unity 2021 LTS do VFX Graph. Escrito por especialistas, é uma referência para ajudá-lo a obter efeitos visuais ricos em camadas e em tempo real para seus jogos.

Você gostou deste conteúdo?