Lo-fi de pixel no Unity

imagem

O estilo visual do meu jogo de desenvolvimento LAUNDRY GAME (sim, isso é publicidade descarada) é baseado em pixels grandes e claros em 3D. Eu amo 3D de baixa resolução. Foram-me feitas muitas perguntas sobre como eu fiz isso, então decidi escrever um tutorial.

Nota: esta é apenas minha decisão! Existem métodos usando sombreadores, gráficos intermitentes e outros truques, mas para o meu pequeno projeto solo, essa solução foi suficiente.

Adição 1: o esperto Pete Brisburn enviou um script aqui , caso você não goste do truque "quadrilátero no céu" (etapas 4-6)!

Etapa 1: preparando a cena de origem



Primeiro você precisa preparar a cena! Eu criei este pequeno cubo com meu amigo pássaro Oscar J. Ruffles . Ele corre em volta do cubo e constantemente grita. (Estes são apenas o controlador de personagens e o animador conectados juntos.)

Mas olhe para essas linhas suaves nojentas! Fu, vamos nos livrar deles.

Etapa 2: remover as câmeras MSAA



Destaque Câmera principal e desmarque a caixa Permitir MSAA . Como você pode ver, os pixels são muito mais nítidos. Mas ainda não há aumento de escala! Ou seja, todos os pixels serão pequenos. Ele precisa ser consertado.

Etapa 3: renderizando a câmera na textura renderizada



Aumentei o zoom (para obter enormes pixels nítidos ) usando RenderTexture e renderizando a câmera principal nessa textura. Isso nos permitirá usar essa RenderTexture como qualquer textura normal!


Aqui estão as opções que eu usarei para minha RenderTexture . Tamanho é o tamanho em que aumentamos o zoom. Quanto menor o número, maiores os pixels. Para ambos os valores, costumo usar números no intervalo de 300 a 600 (excelente Celeste , por exemplo, executa zoom de 320x200).

O Modo de filtro é uma maneira de executar a redução / redução de escala. O modo "Ponto" não adiciona anti-aliasing, ou seja, preserva a nitidez dos pixels que tanto precisamos.

Mas o que aconteceu?


Agora renderizamos a câmera não na tela, mas no RenderTexture, para que nada seja renderizado na tela!

Para consertar isso, precisamos configurar outra câmera , mas desta vez um pouco diferente.

Etapa 4: Crie uma câmera com zoom + quad



Vamos começar criando uma nova câmera na cena (vamos chamá-la QuadCamera ) e anexar um quad 3D a ela quando criança.

Etapa 5: coloque-o em algum lugar vazio



Então precisamos pegar a QuadCamera e empurrá-la para algum lugar. Não importa onde, o principal é que nunca deve ser visível a partir da câmera principal . Eu geralmente levanto alto no céu ou abaixo profundamente.

Etapa 6: Anexe a textura Render ao quad e coloque-a na frente da câmera



Então tomamos quad. Defino Sprites-Default para ele (um material padrão do Unity que não é afetado pela iluminação) para que não seja afetado por nenhuma iluminação aleatória na cena. Em seguida, arraste a RenderTexture para o quad. Agora quad mostra nossa cena! Em seguida, movemos o quad para que fique na frente da QuadCamera (a câmera que agora exibe a tela de destino).


Como você pode ver, a escala de renderização agora foi aumentada! Oscar pode clicar constantemente em seu bico de pixel! Mas, ao mesmo tempo, chegamos muito mais perto da cabeça dele.

Etapa 7: ajustar as câmeras



No último estágio, vamos voltar à minha câmera principal e configurá-la para que possamos ver a mesma coisa antes. Aqui você pode aumentar o tamanho da textura de renderização para que os pixels fiquem um pouco menores ou reduzi-la, para que apenas 7 pixels caibam na tela. É hora de experimentar, encontre o que mais lhe convém.

Bônus: verifique se as texturas não estão embaçadas



Como vimos, a textura do modelo (olho grande de Oscar) ficou confusa o tempo todo. Isso aconteceu porque, ao importar texturas para o Unity, os parâmetros padrão são selecionados para gerar texturas mip e redimensionar suavemente. Mas não precisamos disso. Portanto, ao importar texturas, você deve desativar o Generate Mip Maps e selecionar o modo Point para Filter Mode .

Source: https://habr.com/ru/post/pt465479/


All Articles