2D Pixel Perfect: Como configurar seu projeto Unity para jogos retro de 16 bits

Em nosso primeiro guia 2D Pixel Perfect para jogos retro, mostramos como configurar a ferramenta 2D Pixel Perfect e como os gráficos de 8 bits foram feitos no passado. Neste post, avançamos rapidamente para a era de 16 bits. Com a ajuda de Mega Cat Studios, você aprenderá a criar arte autêntica para Sega Genesis (ou Mega Drive) e jogos de estilo Super NES usando configurações Unity, estruturas gráficas e paletas de cores.

Tome sua experiência de desenvolvimento 2D para o próximo nível e explore o conjunto nativo de ferramentas 2D da Unity.

A Mega Cat Studios transformou a criação de jogos retro altamente precisos em uma forma de arte. Tanto que, de fato, vários de seus títulos também podem ser adquiridos em forma de cartucho e jogados em consoles retro como o Sega Genesis.

Antes de entrar neste post, recomendamos que você se familiarize com nosso guia retro anterior, onde abordamos as configurações 2D Pixel Perfect e como recriar gráficos de estilo de 8 bits. Com Unity 2019.2, o 2D Pixel Perfect agora faz parte do 2D Renderer, que está no pacote Lightweight Render Pipeline (LWRP). 2D Pixel Perfect também existe como um pacote autônomo (com a mesma funcionalidade) para criadores que não usam LWRP. Para este guia, mostraremos como configurar o projeto no LWRP.

No Unity Hub, clique em Novo, selecione 2D e, em seguida, dê um nome ao seu projeto.

2. Para importar o pacote 2D Pixel Perfect, clique no menu Window na barra de ferramentas e selecione Gestor de pacotes. Na janela pop-up, selecione o pacote Lightweight RP, certifique-se de obter a versão 6.9.0 ou superior.

3. Em seguida, você irá configurar o 2D Renderer no Editor e criar um novo recurso de Pipeline. Na janela Projeto, clique com o botão direito do botão no modo de exibição Ativos e selecione Create > Rendering > Lightweight Render Pipeline > Pipeline Asset.

4. Na vista Ativos da janela Projeto, crie um novo Renderer 2D clicando com o botão direito e selecionando Create > Rendering > Lightweight Render Pipeline > 2D Renderer.

5. Selecione o Pipeline Asset que você criou. Selecione Geral e, em seguida, altere o Tipo de Renderer de Renderer Forward para Custom.

6. Assigne o 2D Renderer criado ao campo de dados.

7. Nas configurações de gráficos, defina as configurações de pipeline de renderização de scripts para usar o novo recurso de pipeline criado.

O 2D Renderer agora deve ser configurado, incluindo a câmera 2D Pixel Perfect.

Em Unity 2019.2, os Sprites 2D podem ter um material “Sprite-Lit”, que lhes permite reagir às condições de iluminação 2D. Se você não está usando luzes 2D em seu projeto, certifique-se de ter material que não exija luzes 2D para tornar os Sprites visíveis, caso em que você pode mudar o material para "Sprites-Default".

Você precisa adicionar o componente Pixel Perfect Camera à sua câmera principal. Recomendamos verificar o Run In Edit Mode.

A consola Sega Genesis tem uma resolução de 320x224 pixels (ou uma grade de 40x28 azulejos de 8x8 pixels). Essa é a versão NTSC. O Super NES tem uma resolução de 256×224 (30x28 azulejos de 8x8 pixels) também em sua versão NTSC.

Usar uma resolução de altura de 224 px e projetar ativos com 8 PPU é recomendado para ambos os estilos gráficos.

Se você precisar de uma atualização sobre o que cada opção faz no componente 2D Pixel Perfect Camera, consulte nosso anterior post no blog de jogos retro.

Nesta seção, vamos abordar o fluxo de trabalho para criar obras de arte que imitam a aparência de diferentes consolas, como fizemos em nosso blog NES. Há menos restrições do que em um projeto de 8 bits e mais liberdade com cores, mas o Gênesis tem suas próprias limitações. Nós também achamos importante explicar como o hardware original funciona para que você possa aplicar essas limitações ao seu próprio projeto retro.

Fazer o salto de consoles de 8 a 16 bits dá-lhe mais opções em hardware mais sofisticado. Dito isto, os fundamentos de fazer grandes obras de arte NES ainda se aplicam. Todos os gráficos ainda são armazenados em azulejos 8x8, por exemplo, e depois montados em imagens maiores, sejam eles Sprites ou elementos de fundo. Você ainda precisa trabalhar dentro de subpaletes limitados com uma cor transparente comum, embora 16 bits ofereçam maior liberdade em paletes de algumas maneiras. Você provavelmente ficará aliviado ao ouvir que as consolas de 16 bits geralmente não têm uma paleta de cores hard-coded como suas contrapartes de 8 bits, o que significa que as cores disponíveis são amplamente expandidas do NES.

Em seguida, o Genesis possui subpaletes que contêm 15 cores mais a cor comum usada para transparência Sprite e transparência de camadas. Uma das fraquezas do design de arte para o Gênesis vem das sub-paletes. Subpaletes podem ser atribuídos livremente a Sprites ou azulejos de fundo, mas o Gênesis só permite que quatro subpaletes sejam usados de uma vez. Devido a isso, os artistas devem estar atentos às cores que estão sendo usadas em uma subpalete para que possam ser maximizadas tanto para uso de Sprite quanto para uso de fundo. Uma subpalete para o Gênesis geralmente contém cores que estão sendo usadas por ambos os fundos e Sprites a fim de caber tudo em limpo.

Para criar para qualquer plataforma de 16 bits, você precisa trabalhar com uma paleta indexada. Para isso, Gimp pode ser uma alternativa de código aberto ao Photoshop que permite muita manipulação de paletes indexadas.

Para criar a paleta indexada no Gimp, vá para Imagem > Modo > Indexado...

A janela Conversão de Cor Indexada aparece.

Defina o número máximo de cores para 15. Você pode usar padrões de dithering automáticos, mas estes tendem a parecer melhores quando são criados manualmente.

As cores da imagem estão agora indexadas. Esta informação é automaticamente salvo com a imagem para que o índice de cores pode ser usado. Se você precisar mudar a ordem das cores no índice, você pode simplesmente clicar com o botão direito do botão no mapa de cores e selecione Rearranger Color Map...

Um menu pop-up aparece, permitindo que você arraste e solte cores para uma nova ordem.

Um truque popular para criar uma maior profundidade de cor é controlar a paleta ao longo de uma linha de raster especificada, muito como o rolamento de paralaxe foi alcançado no NES. O Gênesis é capaz de alterar as seleções de subpalete para a obra de arte ao longo de uma linha de raster especificada. Este truque é frequentemente usado para criar a ilusão de que parte de um nível está debaixo d'água. As cores “submarinas” são adicionadas a uma seleção de subpalete completamente separada, e a seleção de subpalete é carregada uma vez que uma determinada linha de raster é renderizada na tela.

Em geral, as consolas de 16 bits não carregam telas gráficas da mesma forma que as consolas de 8 bits. As consolas de 8 bits carregarão Sprite e azulejos de fundo separadamente e em grandes pedaços de dados para evitar usar muita potência de processamento, enquanto as consolas de 16 bits têm a potência de processamento para maior flexibilidade. Eles podem carregar e trocar azulejos individuais em movimento, permitindo que você carregue apenas os gráficos que você precisa quando precisar deles. Isso permite que uma gama maior de obras de arte seja usada dentro de um único nível ou tela de um jogo.

Outro aspecto que é único para o Genesis / Mega Drive é que os dados de azulejos e paletes gráficos não são as únicas coisas que são carregadas na VRAM da consola durante o jogo. Isso pode tornar o design de arte para a consola complicado porque o número de telas gráficas que podem ser carregadas na memória em um determinado momento varia dependendo do que mais está acontecendo no jogo. Geralmente falando, a maioria dos jogos permitirá espaço suficiente para carregar ~1000 telhas, e se houver um elemento dinâmico, então as telhas sempre podem ser trocadas em e fora livremente.

Embora uma gama maior de azulejos disponíveis possa ser carregada em VRAM de uma só vez, a maior parte do tempo essa liberdade extra fica reservada para os Sprites, para permitir animações mais variadas e mais tipos de Sprites na tela de uma só vez. Isso significa que a filosofia básica de design de usar segmentos repetitivos de azulejos tende a ser ainda muito usada na arte de 16 bits, de modo que o fundo não ocupa muito do espaço disponível. As resoluções do NES, Genesis e SNES são todas bastante semelhantes, por isso os segmentos 16x16 tendem a ser o ponto de partida para esses tipos de projetos.

O Genesis/Mega Drive permite que duas camadas de fundo sejam ativas ao mesmo tempo na tela. Isso significa que os elementos estratificados estão mais prontamente disponíveis para o design de fundos. Dito isto, ainda são apenas duas camadas, então o artista e o desenvolvedor podem ter que confiar em alguns truques de linha de raster para criar mais profundidade em uma cena. Felizmente, porque todos eles podem ir para uma segunda camada, os designers são livres para colocar objetos de primeiro plano na frente do fundo sem quebrar a ilusão.

Ter uma segunda camada também torna obsoleto o uso de truques de prioridade Sprite para criar objetos de primeiro plano. Em vez de ter que alterar repetidamente as prioridades Sprite em movimento, agora você pode simplesmente definir a segunda camada de fundo para exibir na frente do jogador, embora a camada mais avançada ainda possa exigir manipulação rápida das prioridades Sprite. O segundo painel de fundo também possui um sub-pano que pode ser usado para head-up displays (HUDs). O sub-pano será bloqueado no lugar e nunca rolará.

Quando você trabalha com Sprites há maior liberdade ao fazer o salto para 16 bits. O Genesis/Mega Drive permite que você tenha 80 Sprites na tela de cada vez e cerca de 20 em uma única linha horizontal antes de parar de renderizar qualquer novo Sprites. Além disso, Sprites não são mais contados como azulejos individuais 8x8. O Gênesis é capaz de gerar Sprites individuais feitos de vários azulejos. Estes podem ser tão pequenos quanto uma única telha e tão grandes quanto 4x4 telhas em tamanho. Qualquer coisa maior do que isso ainda exigiria fazê-lo de múltiplos Sprites.

Uma das características definidoras de obras de arte da era de 16 bits é o uso de dithering. Na época, os jogos eram exibidos em monitores CRT, onde os pixels na tela tinham a tendência de sangrar uns para os outros. Os artistas aproveitaram esse fato usando padrões de distorção na obra de arte, então quando um pixel sangrou em outro em um padrão repetitivo criou a ilusão de ter mais cores do que eram realmente disponíveis. Até hoje, o dithering é amplamente utilizado na arte de pixels, apesar das atualizações em nossos displays, para manter uma estética precisa.

Dos dois principais consoles de 16 bits, o Genesis/Mega Drive exibe suas cores com muito maior contraste. Isso também é algo que você precisa estar ciente de quando escolher suas sub-paletes. Fazer algo com tons mais apagados e entediados não acabará olhando como é esperado quando se trata de realmente renderizar a imagem no hardware. A arte geralmente deve ser criada com uma paleta de cores de alto contraste para que o resultado final permaneça alinhado com a Vision original do artista.

Para projetos Super NES, ainda estamos trabalhando com 8x8 pixels em azulejos/grid de tamanho, por isso trabalhar com azulejos repetíveis é extremamente útil. Em geral, estes serão em algum múltiplo de oito.

A primeira diferença fundamental entre o Genesis/Mega Drive e o SNES diz respeito à paleta de cores. Muito como o Mega Drive, o SNES não tem uma paleta de cores hard-coded, então você pode escolher suas cores.

A coisa complicada sobre o SNES é que ele usa 5 bits por pixel (BPP) cores, que não são muito comuns hoje. Você pode resolver isso usando Gimp para criar obras de arte, então você pode simplesmente posterizar a imagem para 32 tons de RGB, o que funcionará para 5 cores BPP, mesmo se você não salvar a imagem como tal. Isso permite que as cores da imagem sejam exibidas com precisão no console.

Você pode encontrar esta opção no Gimp em Colores > Posterize... Uma janela pop-up aparece, onde você pode definir os níveis de Posterize para 32 para criar 5 cores compatíveis com BPP.

A próxima grande diferença entre os dois sistemas diz respeito à resolução da tela. Como o SNES é o sucessor do NES, os dois sistemas compartilham resoluções de tela semelhantes. A resolução interna do SNES é 256x224. Isso permite que quaisquer imagens que estão sendo renderizadas sejam exibidas dentro das zonas seguras da maioria das televisões CRT, de modo que nenhuma das imagens será cortada. Esta resolução nunca muda, então este será o tamanho da imagem que um artista precisará usar como referência.

Esta seção fornece uma rápida referência ao que os vários modos de tela têm para oferecer.

A diferença mais significativa entre os sistemas é que o SNES pode renderizar gráficos de fundo em sete modos de tela diferentes. O SNES é capaz de renderizar um total de 256 cores na tela de uma só vez em uma única subpalete em certos modos de tela. Aqui estão alguns dos modos de tela mais populares:

• Modo 1: Este é um dos modos de tela mais comumente usados para o SNES. Possui a melhor média mostrando as capacidades da consola. Modo 1 permite que você tenha três camadas de fundo, onde duas delas têm sua própria subpalete de 16 cores, e a camada final tem uma subpalete de 4 cores.
• Modo 3: Este modo é geralmente usado para imagens estáticas maiores, como telas de título e telas de história. Possui dois planos de fundo. O primeiro usa uma subpalete completa de 256 cores, e o segundo permite uma subpalete de 16 cores.
• Modo 7: Esta foi uma das principais características do SNES. Foi mostrado na maioria dos materiais promocionais para a consola, o modo 7 foi a primeira vez que uma consola doméstica foi capaz de aplicar transformações a uma imagem em tempo real, permitindo a escalação, rotação, esticamento e inclinação no plano de fundo. Isso foi usado para criar os efeitos pseudo- 3D vistos em muitos jogos de corrida e voo para SNES.

O plano de fundo único no modo 7 é tratado de forma muito diferente de todos os outros modos de tela para permitir que esses recursos funcionem. Primeiro, há apenas um plano de fundo de 256 cores para trabalhar, o que significa que todos os Sprites precisam compartilhar suas cores com a subpalete do plano de fundo. Em seguida, em vez de trabalhar com o tamanho normal da tela do SNES, um plano de fundo de modo 7 é de 1024x1024 pixels em tamanho. Em seguida, ele é dimensionado e ajustado para caber na tela como o designer quer.

Depois da complexidade dos modos de tela de fundo, as regras para Sprites são relativamente simples. O SNES tem vários modos Sprite diferentes, muito como o Mega Drive fez, mas com a dura limitação de ser capaz de usar apenas dois modos Sprite diferentes para a totalidade do jogo.

Sprites podem ser 8x8, 16x16, 32x32 ou 64x64. Não só isso, mas os designers devem escolher de uma lista predeterminada de combinações de tamanho Sprite. Os jogos no SNES podem incluir as seguintes combinações:

• 8x8, 16x16
• 8x8, 32x32
• 8x8, 64x64
• 16x16, 32x32
• 16x16, 64x64
• 32x32, 64x64

Esses tamanhos são “estabelecidos em pedra” uma vez que você os escolhe, e todos os Sprites no jogo devem se conformar a eles. O SNES é capaz de renderizar 32 Sprites em uma única linha de raster horizontal de cada vez, mas possui um enorme limite de 128 Sprite no que pode ser mostrado na tela de cada vez. Tudo além disso não será exibido na tela.

Os Sprites têm oito subpaletes de 16 cores para trabalhar. Como todas as consolas retro, a primeira cor de qualquer subpalete é uma cor comum compartilhada que é usada para a transparência. A grande quantidade de sub-paletes em comparação com as outras consolas cobertas dá-lhe maior liberdade na escolha de cores para Sprites. Você só precisa ter em mente que há um limite de 256 cores.

Esperamos que tenha gostado deste post sobre como criar jogos retro de 8 e 16 bits usando 2D Pixel Perfect na versão mais recente de Unity.

Ainda não terminamos o 2D Pixel Perfect, já que o recurso será verificado para produção em Unity 2019.3, e também será mais compatível com Cinemachine 2D.

Deixe-nos saber como seu próprio projeto 2D Pixel Perfect vai, e não se esqueça de visitar o foro 2D para interagir com a comunidade Unity e equipe de desenvolvimento 2D.