Usando um atlas de textura para otimizar o seu jogo

Dias. Meses. Talvez anos. Você investiu seu tempo (muito tempo) para criar o seu jogo. Pequeno ou grande, não importa. É o seu jogo, e agora quer compartilhá-lo com todo o mundo — e talvez tornar-se rico* e famoso. É perfeito: a arte é boa, e você está muito orgulhoso da ideia dentro do jogo. Do seu jogo.

Mas há uma última questão que você deve resolver antes do lançamento. Não, não é uma questão simples. O problema: a taxa de quadros do seu jogo está baixa, muito baixa. Isso significa apenas uma coisa: você precisa encontrar uma maneira de corrigi-lo. Você tem que corrigir, e não tem ideia como.

Não entre em pânico: há um truque simples que pode ajudá-lo. É chamado de "Atlas de textura".

* Se você se tornar rico, graças a este artigo, por favor lembre-se de mim. Muito obrigado!

O que é um atlas de textura?

Se você está arriscando o desenvolvimento de um jogo 3D pela primeira vez, você começará a descobrir que os gráficos 3D são compostos de várias partes: malhas 3D, texturas, sistemas de partículas e muitos outros elementos que normalmente são desenhados na tela 30 vezes por segundo ( na gíria: 30fps) durante o processo de renderização, tornando o mundo do jogo variado e animado.

Acredite ou não, os primeiros jogos 3D que vi na minha vida não tinham nenhum desses elementos. Eles eram compostos apenas de linhas que formavam objetos ou elementos 3D em wireframe.

Escrever isso definitivamente faz me sentir velho.

Voltando pra nós (na verdade, pra você) e para as coisas importantes, hoje vamos falar sobre as texturas da interface do usuário (doravante UI) e, por consequência, sobre todas as texturas no jogo.

Em um jogo 3D, a interface do usuário geralmente é feita de elementos 3D (como planos ou caixas) com texturas.

Já mencionamos o processo de renderização: é a operação pela qual os elementos em memória são fisicamente desenhados na tela. Está entre os mais complexos e caros processos que ocorrem em um jogo 3D em tempo real. Então, qualquer tentativa para reduzir o tempo gasto por este processo é bem-vinda; menos tempo gasto no processamento da fase significa uma maior taxa de quadro (ou seja, se você chegar a 60 fps você pode processar a imagem duas vezes e depois pensar em desenvolver seu jogo também para VR), ou mais elementos de tela (o jogo fica mais rico, mais animado e mais bonito).

Um dos meios utilizados para reduzir a duração do processo de renderização é um atlas de textura: não é nada mais do que uma imagem que contém muitas texturas.

Como funciona um atlas de textura

Nota: como mencionado no parágrafo anterior, este artigo irá discutir o atlas de textura aplicado à interface do usuário. No entanto, muitos dos conceitos aqui explicados também podem ser aplicados a modelos 3D e suas texturas.

Um atlas de textura, como dissemos, é uma coleção de texturas dentro de uma única imagem.

Um atlas é geralmente associado com um arquivo descritivo, que indica para o jogo onde uma textura está (em coordenadas x e y), a fim de recuperá-lo.

Dependendo do sistema que você irá usar para gerar e gerenciar o atlas, você terá mais ou menos opções, tais como a distância entre as imagens que a compõem (reduzindo o risco de artefatos nas bordas da textura, causada por uma sobreposição dedois elementos) , ou a capacidade de girar os elementos para otimizar o espaço dentro do atlas (um espaço mais otimizado significa mais imagens dentro do mesmo atlas).

Maneiras diferentes para criar uma atlas de textura

Existem diferentes maneiras de criar um atlas. Um ambiente de desenvolvimento completo geralmente permite o gerenciamento interno do atlas; há também muitas ferramentas externas que oferecem muitas opções adicionais.

A escolha de qual sistema usar obviamente varia de acordo com suas preferências pessoais. Aqui nós explicamos as duas formas: Sprite Packer, interno do Unity e TexturePacker (uma ferramenta autônoma, paga).

Sprite Packer

Para abrir o Sprite Packer, vá no menu Window > Sprite Packer.

A gestão é muito fácil: o botão Pack é usado para criar um ou mais atlas (dependendo do número de suas imagens e a dimensão do Atlas que você deseja usar).

Agora você pode selecionar uma imagem para ver onde está o atlas. Se você adicionar ou remover imagens do seu projeto, você deve usar o botão Repack, para atualizar o Atlas.

Para configurar o empacotador do sprite, você pode ir ao menu Edit > Project Settings > Editor. Aqui você pode desativar o atlas, ativá-lo apenas para a versão final, ou deixá-lo sempre ligado.

Para obter mais informações sobre o Sprite Packer, você pode ler o guia oficial.

Texture Packer

Textura Packer é uma ferramenta autônoma usada para gerenciar o Atlas.

Você pode adicionar uma ou mais pastas do seu projeto e o Texture Packer irá criar o atlas.

Depois disso, você pode escolher o formato de dados para a exportação. Como você pode ver, há também a opção "JSON for Unity". Isto significa que você pode exportar seu atlas para o seu projeto Unity. Mas, para usá-los juntos, você deve instalar uma extensão gratuita da loja de assets.

Para obter mais informações sobre textura Packer, você pode verificar o guia oficial.

Porque é importante usar um atlas de textura?

Mas por que é tão importante juntar várias imagens em uma única imagem maior?

Vamos voltar por um momento para o processo de renderização: se cada elemento da interface do usuário possui uma textura separada, cada um é desenhado em um "draw call" separado. Isto significa que, se na nossa interface, temos o ícone de coração (que representa a energia do jogador) e o ícone das moedas coletadas, teremos dois draw calls.

Cada draw call leva algum tempo para ser concluído, tornando o processo de renderização mais e mais longo. Se existem cinco elementos de interface do usuário, em vez de dois, como no exemplo acima, serão cinco draw calls.

Entendeu o problema?

Mais draw calls -> mais tempo durante a fase de processamento -> menos fps -> jogo com uma taxa de quadros mais baixa (com algumas quedas de quadro) ou menos elementos na tela (então visualmente pobre).

Perder draw calls desta forma, salvo se houver razões especiais, realmente não faz sentido, especialmente para a interface do usuário.

Na verdade, todas as texturas em um atlas serão processadas juntas, em uma única passagem.

Conclusão

Pra terminar, especialmente se você está desenvolvendo um jogo em uma plataforma onde o desempenho é muito importante (como uma plataforma móvel):

• Você deve prestar atenção ao número de draw calls: mais draw calls significa um maior tempo de processamento (e um tempo de processamento maior significa aumenta risco de ter uma taxa de quadros menor).
• Geralmente, cada objeto em uma textura diferente pode gerar uma única draw call (é uma afirmação genérica: existem algumas exceções, especialmente no caso de objetos 3D).
• Uma maneira de diminuir o número de draw calls é usar um atlas de textura.
• Um atlas de textura é basicamente uma grande textura que agrupa diferentes texturas.
• Todos os objetos que usam a mesma textura geram um único draw call.
• Especialmente para as texturas de interface do usuário, o uso de um atlas de textura é um must-have para melhorar o desempenho do seu projeto.

E... que a força esteja com você. E o seu código. Sempre.