Texturas
Saiba como as texturas funcionam no Decentraland
As texturas são parte fundamental do pipeline de arte 3D para alcançar o visual e a sensação desejados para sua cena. Nesta seção você encontrará tudo o que precisa saber para criar suas texturas, limitações, nós no Blender e como otimizá-las para obter o melhor desempenho!
Limitações
Restrições de Tamanho da Textura
Atualmente o Decentraland Explorer comprime as texturas a um máximo de 1024px para fins de otimização usando um Asset Bundle Converter após a cena ser enviada aos servidores de conteúdo. Certifique-se de levar essas limitações em conta ao criar seus ativos!
Outro ponto importante a considerar é que as texturas devem sempre ser potências de dois; qualquer textura que não siga essa especificação pode causar problemas ao renderizar a cena.
Os tamanhos de textura devem usar números de largura e altura (em pixels) que correspondam aos seguintes números:
1, 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024Essa sequência é composta por potências de dois:
f(x) = 2 ^ x. 512px é o tamanho máximo permitido para uma textura. Este é um requisito bastante comum entre outros motores de renderização; existe devido a otimizações internas dos processadores gráficos.
A largura e a altura não precisam ter o mesmo número, mas ambas precisam pertencer a essa sequência.
O tamanho recomendado para texturas é 1024x1024, descobrimos que este é o tamanho ideal para ser transmitido através de redes domésticas e para proporcionar experiências razoáveis de carregamento/qualidade.
Exemplos de outros tamanhos válidos:
32x32px
64x32px
512x256px
512x512px
1024x1024pxPor outro lado, há um limite de texturas por parcela:
UVMapping
UVmapping é o processo de desdobrar as faces do seu modelo 3D em coordenadas 2D que serão usadas posteriormente para aplicar os diferentes mapas aos seus ativos. É uma parte chave do processo de criação. Fazer um unwrap correto dos seus modelos é um fator importante para otimizar a resolução dos seus modelos e também organizar seus mapas para serem flexíveis para modificações.
Para saber mais sobre UV Unwrapping você pode ver este vídeo incrível feito pela Blender Foundation:
Há outro ótimo tutorial de nível intermediário para desdobrar UVs feito por [Blender Guru] (https://www.youtube.com/@blenderguru) que explica como desdobrar um modelo mais complexo:
Mapas
No seção de materiais explicamos como o Decentraland funciona com os shaders PBR. Nesta seção vamos mostrar como cada mapa de textura modifica o shader e o visual do objeto 3D que depois será exportado para o mundo.
Mapas Difusos
Este é a cor base da superfície do objeto. Ter uma paleta de cores equilibrada entre seus modelos é fundamental para alcançar um visual coeso para sua experiência.
Aqui está um gerador de paleta gratuito e legal caso você precise!
Coolors: https://coolors.co/
Ou alguma inspiração de paletas fornecida por filmes incríveis:
Movies in Color: https://moviesincolor.com/
Mapas Metálicos
Em um mapa Metallic, o mapa em tons de cinza representa o grau de metalicidade que um objeto possui, sendo branco totalmente metálico e preto não metálico. No exemplo a seguir vemos como a luz afeta o modelo e como este interage com o ambiente.
Na imagem podemos ver como as partes escuras da textura afetam o modelo. As faixas escuras são opacas, enquanto a faixa branca se comporta sob as propriedades do shader metálico e o cinza sendo uma mistura entre ambos.
Mapas de Rugosidade
Em um mapa de roughness, áreas mais escuras correspondem a superfícies mais lisas, enquanto áreas mais claras correspondem a superfícies mais ásperas. Essa representação em tons de cinza é usada pelos motores de renderização para determinar como a luz deve ser espalhada ou refletida em diferentes pontos da superfície.
Mapas Transparentes
Alpha Clip
Alpha Clip no Blender, quando usado com uma textura, envolve o uso do canal alfa da textura para determinar quais partes do material devem ser visíveis. Pixels com valores alfa acima de um limiar especificado são mostrados, enquanto aqueles abaixo do limiar são descartados, criando um efeito de recorte baseado na informação de transparência da textura.
No exemplo a seguir usamos um material com alpha clip, usando 2 texturas, a cor difusa e a textura alfa em preto e branco conectando a cor ao canal alfa.
Como resultado podemos ver que as áreas pintadas em preto são descartadas enquanto as áreas brancas estão sendo renderizadas
Alpha Blend
Alpha Blend permite escolher valores intermediários por região.
Alpha Blend no Blender, quando usado com uma textura, envolve a mistura das áreas transparentes e opacas da textura com base em seu canal alfa. Isso permite que a textura combine suavemente partes visíveis e semitransparentes, interagindo naturalmente com o fundo ou outros objetos na cena.
Enquanto Alpha Clip rende valores sendo 0 ou 1 (em um limiar específico), Alpha Blend interpola os valores entre 0 e 1. No exemplo acima o material alpha blend mostra a transição gradiente completa enquanto o alpha clip exclui parte da textura definida pelo limiar de clipagem
🔥Dica de Otimização🔥
Leve em conta que texturas transparentes (RGB+A) são sempre mais caras em termos de desempenho do que usar um valor em tons de cinza para transparências.
Transparência é sempre uma operação custosa ao renderizar a cena. Tente sempre manter as transparências no mínimo e use Alpha Blend somente quando for necessário; caso contrário, Alpha Clip é preferível a Alpha Blend.
Mapas Emissivos
Um mapa emissivo é um tipo de mapa de textura usado para controlar a auto-iluminação ou a luz emitida de uma superfície em uma cena 3D. É um componente do shader que determina quanta luz (e a cor da luz) uma parte específica de um modelo 3D emite, independentemente de fontes de luz externas. Mapas emissivos são comumente usados para simular materiais ou objetos que parecem emitir sua própria luz.
Neste exemplo podemos ver o uso de um mapa emissivo combinado com emissive strength em um ambiente que usa pós-processamento de glow para testar aproximadamente como o emissivo se comporta no mundo.
Mapas Normais
Um normal map é um tipo de textura usado em gráficos 3D para simular detalhes finos da superfície e criar a ilusão de geometria complexa sem realmente alterar a geometria subjacente de um modelo. É comumente usado para aumentar o realismo de modelos low-poly adicionando a aparência de elevações, fendas e outras irregularidades de superfície. Também permite manter os próprios objetos mais leves, já que muitos detalhes podem ser fornecidos na camada do normal map em vez de geometria complexa.
Para adicionar um normal map ao seu material usando o Shader Editor, você precisará conectar o Normal Map nó entre a textura e o Principled BSDF shader.
⚠️Importante⚠️: Nunca use uma textura como albedo e normal ao mesmo tempo porque isso pode criar problemas ao renderizar a cena.
Otimizando Texturas
O processo de otimização de texturas traz muitos benefícios ao renderizar a cena no explorer, além de ser uma boa maneira de manter o estilo da sua cena consistente e mais flexível no processo de design. Alguns desses benefícios são:
Ter texturas otimizadas em tamanho e compressão fará a cena rodar muito mais suave e rápido, tornando o download mais rápido e a renderização mais fácil (especialmente para jogadores com conexão de internet lenta).
Reduz a quantidade de memória e poder de processamento necessários para renderizar sua experiência, resultando em uma melhor experiência para seus jogadores.
Economiza espaço nos servidores de conteúdo da comunidade.
Usando Texture Atlases e/ou Trim Sheets lhe dará mais flexibilidade para iterar a criação da sua cena e consistência de estilo entre os objetos. Usando essas técnicas você pode trocar texturas facilmente, ajustar cores ou padrões ao invés de fazê-lo individualmente para cada modelo.
Compartilhar texturas entre modelos permite ter menos texturas por cena, reduzindo drasticamente as draw calls no jogo. Se você estiver trabalhando com glbs (com texturas embutidas) você encontrará um extrator nas diretrizes a seguir para extrair as texturas dele, redirecionando os modelos para usar a mesma textura.
Texturas Compartilhadas Entre Modelos glTF
Uma prática sensata e comum para otimizar sua cena é compartilhar texturas e materiais entre modelos na cena. Fazer isso reduzirá drasticamente as draw calls e sua cena no Decentraland rodará muito mais suave.
A ferramenta a seguir baseada em glTF pipeline, oferece algumas otimizações que tornarão os modelos 3D mais leves e mais rápidos para download pelos jogadores na sua cena.
Mac: MAC GLB Extractor
PC: PC GLB Extractor
Converte o formato .gltf em .glb, que é binário e ocupa muito menos. Também coloca os arquivos de textura fora do modelo 3D, o que permite usar a mesma textura em múltiplos modelos.
📔 Nota: o formato .glb por padrão sempre tem as texturas embutidas no arquivo. O engine não consegue reconhecer duas texturas embutidas como a mesma; elas precisam ser arquivos externos que compartilhem o mesmo hash.
Como Usar o GLB Texture Extractor
Nesta cena de exemplo, temos uma cena sci-fi simples no Blender.
Esta cena contém o ambiente base para os modelos estáticos, mas também há outros dois ativos, um droid e uma nave espacial que queremos exportar separadamente para movê-los depois por código, para que possam interagir com os jogadores. Neste caso usamos 4 texturas (uma para o chão, um atlas de cor para a maioria dos ativos, uma emissiva e uma textura sci-fi de UI para os painéis)
Depois de exportar todos esses ativos para a pasta models temos 3 modelos: a cena estática do ambiente, a nave espacial e o droid.
Mas temos um problema: os arquivos .glb têm as texturas embutidas, então se você estiver exportando ativos diferentes que reutilizam as texturas, estas serão duplicadas cada vez que houver um novo ativo na pasta. Para evitar texturas duplicadas podemos usar esta ferramenta útil.
⚠️ NOTA IMPORTANTE: Antes de usar a ferramenta faça um BACKUP dos seus modelos, caso algo dê errado!!!
No Mac
Uma vez que você tenha exportado todos os ativos para a pasta models você pode arrastar o arquivo de script para ela.
1 - Abra a pasta no terminal arrastando a pasta para ele.
2 - Arraste o texture-extractor.sh para o terminal.
3 - Execute o comando. Pode levar alguns segundos para processar todos os ativos. Depois disso, você verá algo assim:
4 - Vá para sua pasta models e haverá uma nova pasta chamada "out" na qual você verá seus novos ativos com as texturas extraídas.
5 - Substitua todos os ativos pelos novos! Também, quando terminar, apague o "texture-extractor.sh" e a pasta vazia "out".
No Windows
Uma vez que você tenha exportado todos os ativos para a pasta models você pode arrastar o arquivo de script para dentro dela.
1 - Clique duas vezes em glb_texture_extract.bat para extrair os arquivos. Se o Windows avisar sobre aplicativo não reconhecido, vá para Mais Informações e então Executar mesmo assim.
2 - O script gerará uma pasta chamada out; lá você encontrará todos os novos arquivos .glb com suas texturas extraídas.
5 - Substitua todos os ativos pelos novos. Quando terminar, exclua o script "texture-extractor.bat" e a pasta vazia "out".
Se você seguir todos os passos sua cena ficará muito mais rápida agora e os ativos compartilharão a mesma textura! Quando trabalhamos com vários ativos e cenas grandes a melhora é bastante perceptível! Com esta ferramenta você pode economizar muitos megabytes de informação!
⚠️ Após completar este passo, é crucial verificar se todas as texturas seguem as diretrizes. Se as texturas não seguirem as diretrizes ou estiverem muito pesadas, otimize-as para ficarem mais leves antes de deployar. O tamanho de textura recomendado para cenas performáticas é 512x512px. Também verifique a resolução; imagens com mais de 72 DPI afetariam o desempenho e não deixarão a imagem melhor.
Texture Atlas/ Trim Sheets
Um texture atlas é um único arquivo de imagem que contém dados de várias imagens menores empacotadas juntas. Em vez de ter uma textura para cada malha, várias malhas compartilham uma textura maior.
Você pode criar um texture atlas antes de fazer o ativo, o que significa que o ativo é UV-unwrapped de acordo com o texture atlas. Isso requer algum planejamento antecipado ao criar a textura.
Alternativamente, você pode criar o texture atlas depois que o ativo estiver terminado, mesclando texturas em um software de pintura. No entanto, isso também significa que as ilhas UV devem ser reorganizadas de acordo com a textura.
Abaixo há uma imagem mostrando vários objetos 3D que usam um conjunto de texturas:
Outra forma de fazer Atlases é o uso de Trim Sheets, uma técnica comum em modelagem 3D e desenvolvimento de jogos que grandes estúdios e a indústria de jogos usam para garantir consistência visual e pipeline de arte eficiente. Trim Sheets é o uso de uma única imagem ou textura que contém múltiplos pequenos detalhes ou elementos que podem ser aplicados a diferentes partes de um modelo. Essa técnica é muito útil ao criar cenas grandes e precisa ser considerada na primeira etapa do pipeline de arte.
Um exemplo de colagem de um Trim Sheet que usa uma textura difusa, normal e emissiva.
Há um ótimo tutorial por Jennifer McGarry que explica o uso de Trim Sheets usando o Blender!
Nomeação de Texturas
É crucial nomear nossas texturas corretamente. Ter uma nomenclatura correta para a textura irá:
Tornar seu pipeline de arte mais eficiente, flexível, organizado, fácil de direcionar e modificar se necessário.
Evitar sobreposição de texturas com o mesmo nome ao usar o texture extractor ou outras ferramentas.
Evitar problemas de sobreposição de texturas ao usar Asset Bundles.
Forma mais eficiente de apontar problemas ao analisar a cena.
Como nomear corretamente suas Texturas:
Nome do ativo deve representar claramente o que a textura é.
Os nomes de texturas devem começar com o prefixo
T_.O nome da textura deve terminar com o sufixo que define o tipo de textura:
_D- Diffuse/ Color Map_A- Alpha Texture_MT- Metallic_R- Roughness_N- Normal Map_E- Emission
Exemplo: Se for um mapa difuso de textura de tijolo para uma parede, o nome T_BrickWall_D poderia ser apropriado. Se for um Normal Map do mesmo ativo, o nome poderia ser T_BrickWall_N
Exemplos:
🟢 Prefira nome inicial da textura com -
T_Parquet_D,T_Floor_R,T_Pipes_MT,🔴 Evite nome inicial da textura com -
Image_,sprite_,Untitled
Ferramentas Opcionais
Existem muitos addons e ferramentas externas que facilitam o trabalho ao criar ativos para tornar o pipeline mais rápido e eficiente; alguns são gratuitos e outros pagos, para citar alguns:
UVTools
UV Packer (Grátis):https://www.uv-packer.com/blender/
Zen UV: https://blendermarket.com/products/zen-uv
Uvpackmaster 3: https://blendermarket.com/products/uvpackmaster
Compressores de Imagem
Existem vários compressores de imagem online que você pode usar para tornar suas texturas mais leves. Para citar alguns:
CompressPNG: https://compresspng.com/
TinyPNG: https://tinypng.com/
FreeConvert: https://www.freeconvert.com/
Atualizado