Alterar as propriedades do material de um ativo durante a jogabilidade é uma maneira útil de fornecer feedback visual durante a interação, informações de jogabilidade ou criar imersão. Por exemplo:
As aparências da pessoa jogadora podem mudar para sinalizar diferentes efeitos de status.
Os itens podem brilhar para atrair a atenção de pessoas próximas.
Quando estiver chovendo, a transição do solo de seco para molhado pode aumentar a imersão.
Neste tutorial, você usará Blueprints para alterar as propriedades de materiais no tempo de execução em uma demonstração técnica interativa. Para esta demonstração, você criará uma bola de água que encharca o chão conforme ela é empurrada pelo nível.
Você também experimentará materiais emissivos, máscaras simples e interruptores estáticos para criar um cenário que se reflete no chão molhado.
Como criar um ativo de piso pronto para uso em jogos
O primeiro ativo que você construirá para a demonstração técnica será o piso. No Cômodo 3 do Lvl_Adventure, você criará um ativo de piso com superfície pronta para o jogo para substituir a malha provisória do piso.
Antes de começar, considere sua abordagem. No tutorial anterior, você aprendeu que ladrilhar texturas é uma maneira econômica de revestir malhas grandes, como um piso. Você também aprendeu que os UVs de uma malha afetam a aparência das texturas.
O piso provisório no Cômodo 3 é formado por três malhas, e cada uma tem UVs diferentes.
Na demonstração a seguir, observe que as texturas de ladrilhamento parecem ter tamanhos diferentes devido às inconsistências de UV entre as malhas. Isso representa um desafio para revestir o piso de forma coesa.
Você resolverá esse desafio usando a projeção triplanar. A projeção triplanar é uma técnica de revestimento que desconsidera os UVs e faz com que a textura se alinhe ao mundo. Ela é útil para casos em que não podemos corrigir os UVs ou estamos trabalhando com uma geometria em que é difícil mapear os UVs.
Com essa abordagem em mente, você usará expressões para fazer com que M_Surfaces se alinhem ao mundo. Como as instâncias herdam as propriedades dos materiais pais, MI_Surfaces_Floor também ficará alinhado ao mundo. Em seguida, você aplicará MI_Surfaces_Floor a um Blueprint que substituirá as malhas provisórias.
Para evitar problemas de UV antecipadamente, recomendamos dimensionar corretamente os UVs nos ativos modulares ao criá-los no software de modelagem.
Como criar um material alinhado ao mundo
Para deixar seu material pai alinhado ao mundo, siga estes passos:
No Navegador de Conteúdo, acesse All, Content, AdventureGame, Artist, Materials e abra
M_Surfaces.Selecione todos os nós na caixa de comentários UV Tiling, o mapa difuso e o mapa de normais. Exclua-os.
Clique com o botão direito no gráfico e procure Texture Object (objeto de textura). Crie dois desses nós.
Selecione o primeiro objeto de textura. No painel Detalhes, defina Texture como DefaultDiffuse.
Clique com o botão direito no objeto de textura e selecione Convert to Parameter. Dê ao novo parâmetro o nome de
Diffuse.Selecione o segundo objeto de textura. No painel Detalhes, defina Texture como DefaultNormal.
Clique com o botão direito no objeto de textura e selecione Convert to Parameter. Dê ao novo parâmetro o nome de
Normal.No nó Diffuse, arraste da saída e adicione um nó World Aligned Texture (textura alinhada ao mundo).
Conecte a saída XYZ Texture à entrada A do nó Multiply (dentro da caixa de comentários "Diffuse Hue").
No nó Normal, arraste da saída e adicione um nó World Aligned Normal (normal alinhada ao mundo).
Conecte a saída XYZ Texture à entrada Normal do nó-raiz do material M_Surfaces.
Clique com o botão direito no gráfico e procure Scalar Parameter (parâmetro escalar). Dê a ele o nome de
Texture Scaling.Defina o Default Value (valor padrão) como
214.Conecte a saída de Texture Scaling às entradas TextureSizeV3 nos dois nós WorldAligned.
Salve seu material.
O gráfico de material deve ter ficado assim:
Em seguida, você criará um Blueprint que substituirá o piso provisório.
Como criar um Blueprint de piso
Para criar o Blueprint, siga estes passos:
No Navegador de Conteúdo, no caminho All, Content, AdventureGame, Artist, clique com o botão direito e selecione New Folder (Nova pasta).
Dê à pasta o nome de
Blueprints.Clique com o botão direito na pasta Blueprints, selecione Blueprint Class e selecione Actor como a classe pai.
Dê ao Blueprint o nome de
BP_Floore clique duas vezes para abri-lo no Editor de Blueprint.No Navegador de Conteúdo, selecione a pasta All e procure
SM_Cube.Arraste SM_Cube para o painel Components do Editor de Blueprint, como um filho de BP_Floor.
Dê ao "SM_Cube" o nome de
Floor.No painel Detalhes, certifique-se de que a escala esteja definida como
1.0, 1.0, 1.0.Ao lado de Materials, Element 0, defina o material como
MI_Surfaces_Floor.Na aba Components, selecione DefaultSceneRoot, clique em Add e adicione
Box Collision(caixa de colisão).Dê a ela o nome de
Trigger.No painel Detalhes, defina a escala de "Trigger" como
1.5, 1.5, 1.5.Defina a posição de Trigger como
50, 50, 55.Salve e compile o Blueprint.
Arraste uma instância de BP_Floor para o seu nível e movimente-a. Observe que, conforme você move a malha, a textura permanece no mesmo lugar. Se você tentar dimensioná-la, a malha se alterará, mas a textura não.
Em seguida, você substituirá o revestimento provisório no Cômodo 3 por instâncias de BP_Floor.
Como substituir as malhas provisórias
Agora você pode substituir as malhas provisórias no Cômodo 3 por BP_Floor na disposição que preferir. Criamos um piso que corresponde aos elementos provisórios:
Se preferir usar o que foi mostrado acima, pode copiar este nível seguindo estes passos:
Verifique se atualizou
M_Surfacese criouBP_Floorseguindo o tutorial acima.No Organizador, selecione tudo dentro da pasta "Room 3" e pressione Delete.
Copie o trecho a seguir.
Console OutputBegin Map Begin Level Begin Actor Class=/Script/Engine.StaticMeshActor Name=StaticMeshActor_2 Archetype="/Script/Engine.StaticMeshActor'/Script/Engine.Default__StaticMeshActor'" ExportPath="/Script/Engine.StaticMeshActor'/Game/SFEFWFWEEEWEF.SFEFWFWEEEWEF:PersistentLevel.StaticMeshActor_2'" Begin Object Class=/Script/Engine.StaticMeshComponent Name="StaticMeshComponent0" Archetype="/Script/Engine.StaticMeshComponent'/Script/Engine.Default__StaticMeshActor:StaticMeshComponent0'" ExportPath="/Script/Engine.StaticMeshComponent'/Game/SFEFWFWEEEWEF.SFEFWFWEEEWEF:PersistentLevel.StaticMeshActor_2.StaticMeshComponent0'" End Object Begin Object Name="StaticMeshComponent0" ExportPath="/Script/Engine.StaticMeshComponent'/Game/SFEFWFWEEEWEF.SFEFWFWEEEWEF:PersistentLevel.StaticMeshActor_2.StaticMeshComponent0'" StaticMesh="/Script/Engine.StaticMesh'/Game/LevelPrototyping/Meshes/SM_Cylinder.SM_Cylinder'" StaticMeshImportVersion=1 bUseDefaultCollision=False StaticMeshDerivedDataKey="STATICMESH_FD1BFC73B5510AD60DFC65F62C1E933E_228332BAE0224DD294E232B87D83948FQuadricMeshReduction_V2$2e1_6D3AF6A2$2d5FD0$2d469B$2dB0D8$2dB6D9979EE5D2_CONSTRAINED0_100100000000000000000000000100000000000080FFFFFFFFFFFFFFFFFFFFFFFF000000000000803F00000000000000803F0000803F00000000000000003D19FC1626C9B2485E57DB4B8EC731318B8215AE8D46FAD400000000010000000100000000000000010000000100000000000000000000000100000001000000400000000000000001000000000000000000F03F000000000000F03F000000000000F03F0000803F00000000050000004E6F6E65000C00000030000000803FFFFFFFFF0000803FFFFFFFFF0000000000000041000000000000A0420303030000000000000000_RT00_0"Na janela de visualização, pressione CTRL+V.
A seguir, você criará a esfera de água e usará instâncias de material dinâmicas para transformar o chão de seco para molhado.
Como alterar os materiais usando a interação no jogo
A bola de água será um objeto habilitado por física que aciona uma alteração de propriedade no chão, fazendo-o parecer molhado.
Como criar uma bola de água
Para criar e levar à superfície a bola de água, siga estes passos:
No Navegador de Conteúdo, na pasta Blueprints, clique com o botão direito para criar uma nova classe de Blueprint.
Selecione Actor como a classe pai.
Dê a ele o nome de
BP_WaterBalle abra-o no Editor de Blueprint.Na aba Components, clique em Add e procure
Sphere.No painel Detalhes, defina Materials, Element 0 como
M_Water.Ainda no painel Detalhes, em Physics, selecione Simulate Physics.
Salve e compile o Blueprint.
Arraste uma instância de
BP_WaterBallpara o nível.
Teste a bola de água no nível clicando com o botão direito na janela de visualização e selecionando Play From Here. A bola deve quicar no chão quando você encostar nela.
Se houver inimigos no seu nível, defina a Max Speed (velocidade máxima) como 0 para evitar que eles te persigam ou remova-os.
Em seguida, você usará a lógica dentro de BP_Floor para criar uma instância de material dinâmica.
Como criar uma instância de material dinâmica
Uma instância de material dinâmica é uma instância de material gerada por código (como Blueprint) que pode alterar suas propriedades no tempo de execução.
Nesta seção, você criará uma lógica de Blueprint que referencia o material atribuído à malha do piso (MI_Surfaces_Floor), gera uma instância de material dinâmica a partir dele e atribui a nova instância ao piso. Em seguida, a instância de material dinâmica altera as propriedades expostas no tutorial anterior, "Roughness" e "Diffuse Hue", para simular um chão molhado.
Durante o tempo de execução, essa troca fará parecer que o piso está encharcado com uma fina camada de água.
Para criar uma instância de material dinâmica, siga estes passos:
No Navegador de Conteúdo, clique duas vezes em
BP_Floorpara abri-lo no Editor de Blueprint.No EventGraph, exclua todos os nós, exceto o Event BeginPlay.
Na aba Components, arraste uma instância de Floor para o gráfico de eventos.
Da saída de Floor, arraste e procure Get Material.
Da saída de Return Value de Get Material, arraste e adicione um nó Create Dynamic Material Instance em que o destino é a Kismet Material Library.
Conecte a saída de Event BeginPlay à entrada Exec pin de Create Dynamic Material Instance.
De Return Value de Dynamic Material Instance, arraste e selecione Promote to Variable.
No painel Detalhes, mude o nome desta variável para
Dynamic Mat Ref.Arraste outra instância de Floor para o gráfico de eventos.
Da saída de "Floor", arraste e procure Set Material.
Conecte a saída white Exec no nó "Set" à entrada Exec do nó Set Material.
Conecte a saída azul do nó "Set" à entrada Material do nó "Set Material".
Para manter o gráfico organizado, selecione todos os nós e pressione a tecla C. Dê à caixa de comentários o nome de
Create Dynamic Material.Salve e compile.
O gráfico de eventos deve ficar assim:
Como chamar eventos
Para acionar a aparência molhada do chão, você precisará de um evento que verifique se BP_Floor está se sobrepondo a BP_WaterBall e um evento que chame o visual correto como resultado.
Vamos esboçar a lógica:
Quando um ator se sobrepõe a
BP_Floor:Verifique se o outro ator é (igual a)
BP_WaterBall. Se for (verdadeiro), então:Chame o visual molhado do
BP_Floor.
Caso contrário, se não for verdadeiro (falso), então:
Não faça nada.
Para criar essa lógica, siga estes passos:
Clique com o botão direito em EventGraph de
BP_Floore procure Add Custom Event. Dê a este nó o nome deCall Wet Look.Na aba Components, clique com o botão direito em Trigger e crie Add Event, Add OnComponentBeginOverlap.
OnComponentBeginOverlap procura colisão.
Na saída Other Actor em OnComponentBeginOverlap, arraste e crie Get Class.
Da saída Return Value, arraste e crie um nó Equal.
Clique com o botão direito no campo Select Class e selecione Promote to Variable.
Dê à variável o nome de
WaterBalle compile o Blueprint.No painel Detalhes, defina o valor padrão de WaterBall como
BP_WaterBall.Da saída do nó Equal, arraste e crie um nó Branch.
No pin True do nó Branch, arraste e pesquise Call Wet Look.
Conecte a saída Exec de OnComponentBeginOverlap à entrada Exec do nó Branch.
O gráfico de eventos deve ficar assim:
Como controlar as propriedades dos materiais
Agora, você construirá a variação molhada do chão. Como o piso tem textura de pedra e é poroso, ele deve escurecer conforme absorve água (Diffuse Hue). Como há uma fina camada de água sobre ela, a superfície deve ter um aspecto lustroso (Roughness).
Para criar a lógica do visual molhado, siga estes passos:
Arraste a variável Dynamic Mat Ref para o EventGraph e selecione Get na lista.
Arraste o pin de saída e crie um nó Set Scalar Parameter Value.
Do mesmo pin de saída, arraste e crie Set Vector Parameter Value.
Lembra dos parâmetros que você expôs em
M_Surfaces? Roughness é uma escalar (valor único) e o Diffuse Hue é um vetor (três valores; RGB).No nó Set Scalar Parameter Value, clique com o botão direito em Parameter Name e selecione Promote to Variable. Dê à variável o nome de
Roughness.No nó Set Vector Parameter Value, clique com o botão direito em Parameter Name e selecione Promote to Variable. Dê à variável o nome de
Diffuse Hue.Compile o Blueprint e digite valores para o nome de cada parâmetro:
Selecione a variável "Roughness" e insira
Roughnesscomo o valor padrão.Selecione a variável Diffuse Hue e insira
Diffuse Huecomo o valor padrão.Os valores padrão devem corresponder aos parâmetros em
M_Surfaces.
Conecte o pin de Exec de saída do nó Set Scalar Parameter Value ao pin de Exec de entrada do nó Set Vector Parameter Value.
Além de passar de seco para molhado, você pode usar lógica para controlar a velocidade com que essa mudança ocorre. Como saturar uma substância leva tempo, você fará a transição gradual das propriedades do material de um estado para o outro. Você pode fazer isso com um nó de interpolação linear (lerp).
Um nó lerp mescla, ou interpola, suavemente entre dois valores. Ele é útil para a transição de uma cor, efeito ou textura para outra.
Para criar um lerp, siga estes passos:
Da entrada Value do nó Scalar Parameter, arraste e crie um Lerp. Assim, controlamos a rugosidade.
No Lerp, defina o valor A como
1.0. Esse será o valor da rugosidade para o visual seco. Deixe o valor B em0.0. Esse será o valor do visual molhado.No tutorial anterior, você aprendeu que a rugosidade definida como 1 é fosca e como 0, lustrosa. Queremos que a água fique lustrosa.
Da entrada Value do nó Set Vector Parameter Value, arraste e crie um Lerp (Linear Color). Isso vai controlar o matiz difuso.
Arraste e selecione Promote to Variable (linear color) do valor A do novo Lerp. Dê à variável o nome de Unsaturated.
Do valor B do Lerp, arraste e selecione Promote to Variable. Dê à variável o nome de
Saturated.Compile seu Blueprint. No painel Detalhes, defina o valor padrão de Unsaturated como
CDDAFFFF.No painel Detalhes, defina o valor padrão de Saturated para algo mais escuro, como
656C7FFF.
O gráfico de eventos deve ficar assim:
Acabamos de criar um novo visual para o piso usando a lógica do Blueprint. Porém, falta um mecanismo para alimentar essa lógica: uma Timeline (linha do tempo).
Impulsione sua lógica com linhas do tempo
De forma semelhante à linha do tempo em um software de animação, os nós Timeline determinam valores entre keyframes ao longo do tempo. Usaremos esse nó para controlar a interpolação entre os visuais seco e molhado durante um período específico.
Para criar uma linha do tempo, siga estas etapas:
Clique com o botão direito no EventGraph, procure e crie Add Timeline.
Clique duas vezes no nó Timeline para abrir a aba Timeline_Template.
Clique em Track e selecione Add Float Track na lista.
Dê à faixa o nome de
Alpha. O nome da faixa aparecerá como um pin de saída no nó Timeline.Defina o extensão da linha do tempo como
3.0segundos.Clique com o botão direito na linha do tempo e selecione Add Key.
Com o keyframe selecionado e destacado em azul, defina Time e Value para esse keyframe como
0.0.Crie um segundo keyframe e defina Time e Value como
1.0.Clique com o botão direito no primeiro keyframe e selecione User.
Salve e compile.
Essa linha do tempo agora gera um valor que mescla de 0 a 1 durante três segundos. Agora você pode conectar os nós restantes à linha do tempo:
Voltando ao gráfico de eventos, conecte a saída Call Wet Look à entrada Play na linha do tempo.
Conecte a saída Update na linha do tempo à entrada Exec de Set Scalar Parameter Value.
Conecte a saída Alpha da linha do tempo às entradas Alpha nos dois Lerps.
Selecione os nós e pressione C para comentar. Dê à caixa de comentários o nome de
Lerp Dynamic Materials.Salve e compile.
O gráfico de eventos completo deve ficar assim:
Para testar seu trabalho, clique com o botão direito no nível e selecione Play From Here. Quando você empurrar a bola de água pelo cômodo, o chão deve "inundar".
É difícil ver a refletividade da superfície molhada à luz do dia. Para mostrar a refletividade do chão, escureça o nível e adicione iluminação usando um Emissive Material (material emissivo).
Materiais emissivos
Os materiais emissivos são uma maneira barata de criar autoiluminação. Eles podem ser usados para criar brilho incorporado em materiais mais complexos, como LEDs na armadura de ficção científica de um personagem ou nas luzes de freio de um carro.
Os materiais emissivos também podem interagir com o Sistema de Iluminação Global e Reflexos do Lumen, o que significa que interagem com o ambiente ao seu redor.
O brilho de um material emissivo pode ser controlado com valores de float que variam de 0 (sem luz) a 1 (luz emissiva) ou acima de 1 (luz emissiva que cria bloom).
Os materiais emissivos e os reflexos são mais perceptíveis em níveis escuros. Para alterar a iluminação geral no seu nível, siga estes passos:
No Organizador, selecione Directional Light.
Na janela de visualização, pressione CTRL+L e mova o mouse para ajustar a posição da luz direcional e a hora relativa do dia no nível.
De forma geral, os emissivos não são recomendados para luzes de ambiente. O uso de materiais emissivos como fontes de luz pode produzir resultados indesejados. Em vez disso, recomendamos usar fontes de luz para ambientes.
Como criar um material emissivo
Neste tutorial, você construirá letreiros de neon que refletem na pedra molhada quando posicionados ao redor do nível. Para isso, você criará um material pai flexível que pode propagar os seguintes parâmetros às instâncias filhas:
A cor emissiva;
O brilho emissivo; e
A máscara de textura.
Para criar um material emissivo, siga estes passos:
No Navegador de Conteúdo, no caminho All, Content, AdventureGame, Artist, Materials, crie um novo Material.
Dê ao material o nome de
M_EmissiveSigne clique duas vezes nele para abrir o Editor de Material.No gráfico de material, arraste a entrada Emissive Color do nó-raiz do material e adicione um nó Multiply da lista de seleção.
Arraste da entrada A do nó Multiply e adicione um Constant3Vector.
Clique com o botão direito em Constant3Vector e selecione Convert to Parameter.
Renomeie o parâmetro como
Color.Clique duas vezes na amostra de cores e escolha uma cor para o emissivo.
Arraste da entrada B do nó Multiply e adicione um nó Constant da lista de seleção.
Converta a constante em um parâmetro, dê a ele o nome de
Brightnesse defina o valor como25.
O gráfico de material deve ter ficado assim:
Limite os parâmetros com fixadores
Embora o brilho emissivo não tenha limite superior, você pode definir seus próprios limites personalizados para o brilho mínimo e máximo no material pai usando um fixador. A fixação pode facilitar o ajuste de valores com uma barra, especialmente ao lidar com números pequenos e ajustes sensíveis.
Como outros parâmetros, os fixadores são propagados para instâncias de material.
Para fixar a constante de brilho, siga estes passos:
No gráfico de material, selecione o parâmetro Brightness.
No painel Detalhes, defina Slider Max como
50.
Em seguida, você fornecerá o conteúdo do letreiro usando máscaras de textura.
Como criar uma máscara simples
Uma máscara de textura é um mapa de textura em tons de cinza (alfa) ou de canal único, usado para revelar ou ocultar certas áreas de um material. Você pode imaginar uma máscara alfa como camadas; a área branca da máscara revela informações de uma camada inferior e a área preta as oculta.
No material emissivo, você usará uma máscara alfa para revelar ou bloquear áreas de brilho emissivo para criar o conteúdo do letreiro neon.
Para criar uma máscara dentro do material pai M_Emissive, siga estes passos:
Sem nós selecionados, acesse o painel Detalhes. Ao lado de Blend Mode, clique no menu suspenso e selecione Masked.
No gráfico de eventos, clique com o botão direito e crie um elemento Texture Sample.
No painel Detalhes, ao lado de Texture, procure
T_UE_Logo_M.Essa textura vem com a Unreal Engine; você não precisa baixá-la ou criá-la.
Conecte a saída RGB em "Texture Sample" à entrada Opacity Mask no nó-raiz do material.
Clique com o botão direito na Texture Sample e selecione Convert to Parameter. Dê ao parâmetro o nome de
LED Sign.
O gráfico de material deve ter ficado assim:
Você criou um material que imita um letreiro neon. A seguir, você aumentará a flexibilidade do material pai e a quantidade de ativos únicos que pode criar invertendo a máscara:
Para conseguir isso, crie instâncias de material exclusivas para as máscaras invertida e não invertida. Em vez disso, você usará um Static Switch (interruptor estático) para alternar a inversão em qualquer instância de material criada a partir de M_EmissiveSign.
Alterne os parâmetros com interruptores estáticos
No tutorial anterior, você aprendeu sobre a hierarquia de propagação de materiais; instâncias filhas herdam as propriedades dos materiais pais.
Uma instância pode personalizar um parâmetro herdado, mas não pode ignorá-lo completamente, a menos que você use um interruptor estático. Interruptores estáticos, definidos no material pai, permitem que instâncias filhas ativem ou desativem os parâmetros.
Como os parâmetros desativados não são compilados, os interruptores estáticos podem melhorar o desempenho no tempo de execução. No entanto, como cada booleano cria uma nova permutação de shader, isso pode aumentar drasticamente o tempo de compilação (dependendo da complexidade do material). O valor dos interruptores depende de como você os utiliza e das necessidades de desenvolvimento do seu projeto.
Tempo de execução refere-se ao período em que um jogo está em execução. Tempo de compilação refere-se ao estágio em que um jogo está sendo compilado, antes do tempo de execução.
Para criar um interruptor estático que controla a inversão da máscara, siga estes passos:
No gráfico de material, selecione o nó LED Sign e duplique-o pressionando CTRL+D.
Renomeie o novo nó como
Screen.Da saída RGB de Screen, arraste e procure One Minus.
Clique com o botão direito no gráfico e procure Static Switch Parameter. Dê ao interruptor o nome de
Flip Mask?Conecte a saída de One Minus à entrada False do interruptor.
Conecte a saída RGB do letreiro de LED à entrada True do interruptor.
Conecte a saída do interruptor à entrada Opacity Mask do nó-raiz do material.
Salve seu material.
O gráfico de material deve ter ficado assim:
Agora você pode criar instâncias de material a partir de M_EmissiveSign que controlam com exclusividade o brilho, a cor, o mapa de textura ou a inversão de máscara.
Aplique instâncias de M_EmissiveSign a malhas novas ou existentes no nível para criar uma cena de sua escolha. Conforme você rola a bola de água pelo nível, os letreiros vão refletir no chão molhado usando o Sistema de Iluminação Global e Reflexos do Lumen, que está ativado por padrão. Você aprenderá mais sobre Lumen e outros sistemas de reflexos no próximo tutorial.
A seguir
No próximo tutorial, você aprenderá mais sobre reflexos em volumes de pós-processamento, sistemas de iluminação e como aplicar diferentes efeitos na câmera no seu nível.