> For the complete documentation index, see [llms.txt](https://docs.decentraland.org/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.decentraland.org/creator/content-creator-pt/modelacao-e-animacoes-3d/textures.md). # Textures Textures são uma parte fundamental do pipeline de arte 3D para alcançar a aparência e a sensação que você quer para a sua Scene. Nesta seção você encontrará tudo o que precisa saber para criar suas Textures, limitações, nodes no Blender e como otimizá-las para que tenham o melhor desempenho possível! {% hint style="info" %} **💡 Dica**: Instale o [plugin Decentraland Tools Blender](https://extensions.blender.org/add-ons/decentraland-tools/). Inclui várias funções úteis para o ajudar a editar e exportar modelos 3D, wearables e emotes. {% endhint %} ## Limitações ### Restrições de tamanho de Textures Atualmente, o Decentraland Explorer comprime as textures até um máximo de 1024px, para fins de otimização, usando um Asset Bundle Converter depois que a Scene é enviada para os servidores de conteúdo. Certifique-se de levar essa limitação em conta ao criar seus assets! Outro ponto importante a levar em conta é que as textures devem ser sempre potência de dois; qualquer texture que não siga essa especificação pode trazer problemas ao renderizar a Scene. Os tamanhos das Textures 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, 1024 ``` > Esta sequência é composta por potências de dois: `f(x) = 2 ^ x` . **1024 é o número máximo que permitimos para o tamanho de uma Texture.** Este é um requisito bastante comum entre outros motores de renderização; ele 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 Textures é 1024x1024**, descobrimos que esse é o tamanho ideal para ser transportado por redes domésticas e oferecer experiências razoáveis de carregamento/qualidade. Exemplos de outros tamanhos válidos: ``` 32x32px 64x32px 512x256px 512x512px 1024x1024px ``` Por outro lado, há um limite de Textures por Parcel: ``` log2(n+1) x 10 Quantidade de Textures por Parcel. Inclui Textures importadas como parte de modelos. ``` ## UVMapping UVmapping é o processo de desdobrar as faces do seu modelo 3D em uma coordenada 2D que será usada depois para adicionar os diferentes maps aos seus assets. É uma parte fundamental do processo de criação. Fazer um unwrap correto dos seus modelos é um fator-chave para extrair ao máximo a resolução dos seus modelos e também organizar seus maps para ficarem flexíveis para modificações. Para saber mais sobre UV Unwrapping, você pode ver este vídeo incrível feito pela Blender Foundation: [![Video Preview](https://i.ytimg.com/vi/Y7M-B6xnaEM/maxresdefault.jpg)](https://youtu.be/Y7M-B6xnaEM?si=qMnWTMsXxC-vxZAH) Há outro ótimo tutorial de nível intermediário para unwrapping de UVs feito por \[Blender Guru] () que explica como fazer unwrap de um modelo mais complexo: [![Video Preview](https://i.ytimg.com/vi/scPSP_U858k/maxresdefault.jpg)](https://youtu.be/scPSP_U858k?si=Uw0xHbv9jtqVstDS) ## Maps Na [seção de materials](https://docs.decentraland.org/creator/3d-modeling/materials/) explicamos como a Decentraland trabalha com os shaders PBR. Nesta seção vamos mostrar como cada texture map modifica o shader e a aparência e sensação do objeto 3D que depois será exportado para o world. ## Diffuse Maps Esta é a cor base da superfície do objeto. Ter uma paleta de cores equilibrada entre seus models é fundamental para alcançar uma aparência e sensação coesas para a sua experiência. ![](/files/318e01d06b39d15af184f311220010f973ad3c7e) Aqui está um gerador de paletas gratuito e legal, caso você precise! * **Coolors:** Ou alguma inspiração de paleta fornecida por filmes incríveis: * **Movies in Color:** ## Metallic Maps Em um Metallic map, 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 model e como interage com o ambiente. ![](/files/4c56a8a3e5d65552376c36f7b0938e793ee7f148) *Na imagem podemos ver como as partes escuras da texture afetam o model. As listras escuras são opacas, enquanto a faixa branca se comporta sob as propriedades do metallic shader, e o cinza sendo uma mistura entre ambos.* ## Roughness Maps Em um roughness map, as áreas mais escuras correspondem a superfícies mais lisas, enquanto as á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. ![](/files/45c544b373565c58fd7505ed0c9a80c53a56e8bd) ![](/files/502a4910492eae0125715aab89a3d1ac7d330086) ## Transparent Maps ### Alpha Clip Alpha Clip no Blender, quando usado com uma texture, envolve usar o canal alpha da texture para determinar quais partes do material devem ficar visíveis. Pixels com valores alpha acima de um limite especificado são exibidos, enquanto aqueles abaixo do limite são descartados, criando um efeito de recorte com base nas informações de transparência da texture. No exemplo a seguir usamos um material com alpha clip, usando 2 textures, a cor diffuse e a alpha texture em preto e branco conectando a cor ao canal alpha. ![](/files/c85e061ad74583fed7c82d69049293ce0c9e8958) ![](/files/7fe24526e784894b46120da505be8e84cb443722) ![](/files/d7148b84c5e23cf5ac095bb66c953d9dcc48fce0) *Como resultado, podemos ver que as áreas pintadas de preto são descartadas, enquanto a área branca está sendo renderizada* ### Alpha Blend *Alpha Blend* permite que você escolha valores intermediários por região. Alpha Blend no Blender, quando usado com uma texture, envolve misturar as áreas transparentes e opacas da texture com base em seu canal alpha. Isso permite que a texture combine suavemente tanto as partes visíveis quanto as transparentes, interagindo naturalmente com o background ou outros objects na Scene. ![](/files/74222a8c854434aa2ab264c32e21cbac06cc644f) *Enquanto o Alpha Clip renderiza valores 0 ou 1 (em um limite específico), o Alpha Blend interpola os valores entre 0 e 1. No exemplo acima, o material de alpha blend mostra a transição completa do gradiente, enquanto o alpha clip exclui parte da texture definida pelo limite de clip* {% hint style="warning" %} **🔥Dica de otimização🔥** * Tenha em conta que Textures transparentes (RGB+A) são sempre mais caras em termos de performance do que usar um valor em tons de cinza para transparências. * A transparência é sempre uma operação cara ao renderizar a Scene. Tente sempre manter as transparências no mínimo e use Alpha Blend apenas quando for necessário; caso contrário, Alpha Clip é preferível em vez de Alpha Blend. {% endhint %} ## Emissive Maps Um emissive map é um tipo de texture map usado para controlar a autoiluminação ou a luz emitida por uma superfície em uma Scene 3D. É um componente do shader que determina quanta luz (e de que cor) uma determinada parte de um modelo 3D emite, independentemente de fontes de luz externas. Emissive maps são comumente usados para simular materials ou objects que parecem emitir sua própria luz. ![](/files/6fe66ec0716f5f17cb3bfdaa5095facce4b195f1) *Neste exemplo, podemos ver o uso de um emissive map combinado com emissive strenght em um ambiente que usa glow postprocessing para testar aproximadamente como o emissive se comporta no world.* ## Normal Maps Um normal map é um tipo de texture usada em gráficos 3D para simular detalhes finos de superfície e criar a ilusão de geometria complexa sem alterar de fato a geometria subjacente de um model. É comumente usado para aumentar o realismo de models low-poly, adicionando a aparência de relevos, reentrâncias e outras irregularidades de superfície. Também permite manter os próprios objects mais leves, já que muitos detalhes podem ser fornecidos na camada de normal map em vez de geometria complexa. ![](/files/1c5024932a4619c642d5618912bfefc2b16cdbf4) ![](/files/65eff5555ac0154986e79ca0cb744beb3b6befac) Para adicionar um normal map ao seu material usando o *Shader Editor*, você precisará conectar o ***Normal Map*** node entre a texture e o *Principled BSDF* shader. ![](/files/04924c7b0493342f581b72a7bc995c51e3b72f8a) {% hint style="warning" %} **⚠️Importante⚠️:** Nunca use uma texture como albedo e normal ao mesmo tempo, pois isso pode criar problemas ao renderizar a Scene. {% endhint %} ## Otimizando Textures O processo de otimização de textures traz muitos benefícios ao renderizar a Scene no Explorer, mas também é uma boa maneira de manter o estilo da sua Scene consistente e mais flexível durante o processo de design. Alguns desses benefícios são: * Ter Textures otimizadas em tamanho e compressão fará a Scene rodar muito mais suave e rápida, tornando o download mais rápido e a renderização mais fácil (especialmente para players que têm uma conexão de internet lenta). * Isso reduz a quantidade de memória e poder de processamento necessários para renderizar sua experiência, resultando em uma melhor experiência de usuário para seus players. * Economiza armazenamento dos servidores de conteúdo da comunidade. * Usando **Texture Atlases** e/ou **Trim Sheets** vai lhe dar mais flexibilidade para iterar a criação da sua Scene e consistência de estilo entre os objects. Usando essas técnicas, você pode facilmente trocar textures, ajustar cores ou padrões em vez de fazer isso individualmente para cada model. * Compartilhar Textures entre models permite ter menos Textures por Scene, reduzindo drasticamente os draw calls no jogo. Se você estiver trabalhando com glbs (com textures embutidas), você encontrará um extrator nas orientações a seguir para extrair as Textures deles, redirecionando os models para usar a mesma Texture. ## Shared Textures entre models glTF Uma prática sábia e comum para otimizar sua Scene é compartilhar Textures e materials entre models ao longo da Scene. Fazer isso reduzirá drasticamente os draw calls e sua Scene em Decentraland rodará muito mais suave. A ferramenta a seguir baseada em [**glTF pipeline**](https://github.com/AnalyticalGraphicsInc/gltf-pipeline)**,** oferece algumas otimizações que tornarão os models 3D mais leves e mais rápidos de baixar para os players da sua Scene. **Mac:** [MAC GLB Extractor](https://github.com/decentraland/docs-creator/blob/main/images/3d-models-and-animations/glb-extractor/texture_extractor.sh) **PC:** [PC GLB Extractor](https://github.com/decentraland/docs-creator/blob/main/images/3d-models-and-animations/glb-extractor/glb_texture_extract.bat) Ela converte o formato .gltf em .glb, que é binário e, portanto, ocupa muito menos. Também coloca os texture files fora do model 3D, o que permite usar a mesma Texture em vários models. > 📔 Nota: o formato .glb, por padrão, sempre tem Textures embutidas no arquivo. O engine não consegue reconhecer duas Textures embutidas como a mesma; elas precisam ser arquivos externos que compartilhem o mesmo hash. ### Como Usar o GLB Texture Extractor Nesta Scene de exemplo, temos uma Scene sci-fi simples no Blender. ![](/files/6b553785768b1adbe8563ea828bee0d6ceb7ee63) Esta Scene contém o ambiente base para os models estáticos, mas também há outros dois assets, um droid e uma nave espacial, que queremos exportar separadamente para movê-los depois por código, para que possam interagir com os players. Neste caso usamos 4 Textures (uma para o chão, um atlas de mapa de cores para a maioria dos assets, uma emissive e uma Texture sci-fi de UI para os painéis) ![](/files/d589b562491394a72871516f5387c434ce7acd42) ![](/files/92b40d70bf19e3fb3f602f70ac8d9d9b865a7bcc) Quando exportamos todos esses assets para a pasta models, temos 3 models: a Scene estática do ambiente, a nave espacial e o droid. ![](/files/e973349540b925d3548a5a1e3be36bc32bb543a5) Mas temos um problema: os arquivos .glb têm as Textures embutidas, então, se você estiver exportando assets diferentes que reutilizam as Textures, elas serão duplicadas cada vez que houver um novo asset na pasta. Para evitar Textures duplicadas, podemos usar esta ferramenta útil. {% hint style="warning" %} ⚠️ NOTA IMPORTANTE: Antes de usar a ferramenta, faça um BACKUP dos seus models, só por precaução, caso algo dê errado!!! {% endhint %} **No Mac** Depois de exportar todos os assets para a pasta models, você pode arrastar o arquivo de script para ela. ![](/files/3fc08008ee7dae14945a41867368a3380eb2cb8e) 1 - Abra a pasta no terminal arrastando a pasta para ele. ![](/files/ee1b13e4f4fbb2e4140bc51c01389e8038bdef4f) 2 - Arraste o texture-extractor.sh para o terminal. ![](/files/2add59934aa8e29fd7f4fe9a295b433584637ef0) 3 - Execute o comando. Pode levar alguns segundos para processar todos os assets. Depois disso, você verá algo assim: ![](/files/8ad2b0d3f04a5484f32d6bfd9cb13c18f7c490aa) 4 - Vá para a pasta models e haverá uma nova pasta chamada "out", na qual você verá seus novos assets com as Textures extraídas. ![](/files/1102dc81c9907af063f1d5445eccff48bdb0a5d2) 5 - Substitua todos os assets pelos novos! Além disso, quando terminar, apague o "texture-extractor.sh" e a pasta vazia "out". ![](/files/0c4f613f1612998c1f5bd69caf70cd4af1980a8b) **No Windows** Depois de exportar todos os assets para a pasta models, você pode arrastar o arquivo de script para ela. ![](/files/d16efdcabd86580453326184cc4c263218adbc42) 1 - Dê duplo clique em glb\_texture\_extract.bat para extrair os arquivos. Se o Windows avisar sobre um app não reconhecido, vá para **Mais informações** e depois em **Executar mesmo assim**. ![](/files/533c7c0195ea3811939d5a9d55dc3906b8f80000) ![](/files/203771a3d28510c50f6132de17d0d6a147531aaf) 2 - O script irá gerar uma pasta chamada out, lá você encontrará todos os novos arquivos .glb com suas Textures extraídas. ![](/files/2c3f2eb0d913ff35fdb696bc6c1218933b85ed99) 5 - Substitua todos os assets pelos novos. Quando terminar, exclua o script "texture-extractor.bat" e a pasta vazia "out". Se você seguir todos os passos, sua Scene ficará muito mais rápida agora e os assets compartilharão a mesma Texture! Quando trabalhamos com vários assets e Scenes grandes, a melhoria é bem perceptível! Com esta ferramenta, você pode economizar muitos megabytes de informação! {% hint style="warning" %} ⚠️ Depois de concluir esta etapa, é crucial verificar se cada Texture segue as orientações. Se as Textures não seguirem as orientações ou estiverem pesadas demais, otimize-as para ficarem mais leves antes de fazer deploy. O tamanho de Texture recomendado para Scenes com bom desempenho é 1024x1024. Verifique também a resolução; imagens com mais de 72 DPI afetariam o desempenho e não fariam a imagem parecer melhor. {% endhint %} ## 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 Texture para cada mesh, várias Meshes compartilham uma Texture maior. Você pode criar um texture atlas antes de fazer o asset, o que significa que o asset é UV-unwrapped de acordo com o texture atlas. Isso requer algum planejamento antecipado ao criar a Texture. Como alternativa, você pode criar o texture atlas depois que o asset estiver pronto, mesclando Textures em um software de pintura. No entanto, isso também significa que as ilhas UV devem ser reorganizadas de acordo com a Texture. Abaixo há uma imagem mostrando vários objetos 3D que usam um único conjunto de Textures: ![](/files/92dd1130e8bf00d14bf67751bea5bb5af1bef320) ![](/files/1ae36717fa4f8d58ee91a1c19788e36f7ee28082) Outra maneira de fazer Atlases é usar 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 um pipeline de arte eficiente. Trim Sheets é o uso de uma única imagem ou Texture que contém vários pequenos detalhes ou elementos que podem ser aplicados a diferentes partes de um model. Essa técnica é muito útil ao criar grandes Scenes e precisa ser considerada na primeira etapa do pipeline de arte. ![](/files/85491d83dd86713102f5dd3ec1a9e2f8caf5da85) *Um exemplo em colagem de um Trim Sheet que usa uma texture diffuse, normal e emissive.* Há um ótimo [tutorial](https://www.artstation.com/blogs/jennifermcgarry/yd4Q/jenns-guide-to-trim-sheets) de [Jennifer McGarry](https://www.artstation.com/jennifermcgarry/blog) que explica o uso de Trim Sheets usando Blender! ## Nomenclatura de Textures **É crucial nomear nossas Textures corretamente.** Ter uma nomenclatura correta para a Texture irá: * Tornar seu pipeline de arte mais eficiente, flexível, organizado, fácil de direcionar e modificar, se necessário. * Evitar a sobreposição de Textures com o mesmo nome ao usar o texture extractor ou outras ferramentas. * Evitar problemas de sobreposição de Textures ao usar Asset Bundles. * Uma forma mais eficiente de resolver pontos problemáticos ao analisar a Scene. **Como nomear corretamente suas Textures:** * **Nome do asset** deve representar claramente o que a Texture é. * O nome das Textures deve começar com o prefixo `T_`. * O nome da Texture deve terminar com o sufixo que define o tipo de Texture: * `_D` - **Diffuse/ Color Map** * `_A` - **Alpha Texture** * `_MT` - **Metallic** * `_R` - **Roughness** * `_N` **- Normal Map** * `_E` - **Emission** Exemplo: Se for um mapa difuso da Texture de tijolos para uma parede, o nome `T_BrickWall_D` poderia ser adequado. Se for um Normal Map do mesmo asset, o nome poderia ser `T_BrickWall_N` **Exemplos:** * 🟢 **Prefira** começando o nome da Texture com - `T_Parquet_D`, `T_Floor_R`, `T_Pipes_MT`, * 🔴 **Evite** começando o nome da Texture com - `Image_`, `sprite_`,`Sem título` ## Ferramentas opcionais Há muitos addons e ferramentas externas que facilitam o trabalho ao criar assets para tornar o pipeline mais rápido e eficiente; algumas são gratuitas e outras pagas, para citar algumas: ### UVTools * **UV Packer (Grátis)**: * **Zen UV:** * **Uvpackmaster 3:** ### Compressores de imagem Há vários compressores de imagem online que você pode usar para deixar suas Textures mais leves. Para citar alguns: * **CompressPNG:** * **TinyPNG:** * **FreeConvert:** --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.decentraland.org/creator/content-creator-pt/modelacao-e-animacoes-3d/textures.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.