[Criação de jogos]Programação Gráfica > O que é Aliasing e Técnicas de Antialiasing

[~~Surfistinha~~ 13]

Você já reparou que em jogos um pouco antigos percebe-se que as linhas que deveriam ser retas não são realmente retas, e sim, parecem escadas?

 

Por exemplo, observe a figura abaixo:

Vamos ampliar a imagem e ver melhor..

Observe bem as bordas das letras: notou um certo "serrilhado"? Pois é. Isso aí em um jogo tornaria ele com uma aparência simplesmente de algo decadente, não? Mas... Por que esse efeito???

 

Bem, esse efeito se dá ao fato de que as telas de monitores e televisores são divididas em pixels, e como cada pixel tem a forma de um retângulo, ficam parecendo "degraus".

 

Esse problema afeta tanto os desenvolvedores de jogos e animações que já possui um nome: Aliasing.

 

São muitas as formas de se resolver isso, algumas com melhor velocidade para sua manipulação, outras com melhor suavização do efeito "escada". Tais técnicas são as famosas técnicas de Anti-Aliasing.

 

Surgem a cada dia novas formas de anti-aliasing para imagens, duas delas são:

 

a) Subpixel:

 

Uma vez que o pixel é composto de três cores (daí falarmos em escala RGB - Red, Green, Blue), podemos trabalhar com essas cores independentemente, como se fossem subpixels de um pixel.

 

Vamos ver uma imagem de como poderíamos então representar um pixel (bem ampliado, assim poderemos ver melhor

 

Bem, observando as imagens aqui em meu computador, notei que a cor verde aparenta ter sido aplicada a pixels mais acima que a cor vermelha e a cor azul aparenta ser aplicada a pixels mais acima que a cor verde, ou seja, deve ser da segunda forma que as cores se apresentam em meu monitor.

 

Mas, vamos adotar a primeira forma (O pixel dividido verticalmente).

 

Então, passamos a ter pixels menores, e com pixels menores, temos "degraus" menores, o q dará uma menor impressão de serrilhado.

 

A manipulação da escala RGB dos pixels só é necessária com os pixels próximos às linhas, de forma a formar novos degraus menores.

 

Vejamos um exemplo em que essa manipulação ocorre:

As cores reais obtidas em cada pixel serão estas:

Mas, devido à grande proximidade entre cada ponto e à nossa limitação entre distinção de cores, nós quase não percebemos as tonalidades diferentes do branco e preto (que predominam na imagem).

 

O efeito obtido será, então, este:

iu? O serrilhado agora está menor Very Happy

 

b) Cores Intermediárias:

 

Nossos olhos captam perfeitamente a diferença brusca entre poucas cores, por exemplo: se colocarmos a cor, branca, preta e cinza próximas, perceberemos facilmente a diferença entre elas.

 

Mas se trabalharmos com um número suficientemente grande, por exemplo 255 tons de cinza, dispostos do branco até o preto, não percebermos a diferença entre as cores tão facilmente, dando a impressão de um gradiente (é assim que compomos um gradiente, não?).

 

Sendo assim, se trabalharmos com cores intermediárias à cor da linha e da área que está em contato com ela, teremos um gradiente e não perceberemos tão facilmente as "quebras" na linha.

 

Por exemplo, se eu tenho uma linha branca e a região externa é preta, se eu colocar nos pontos de quebra dessa linha pixels com os tons de cinza, terei feito o anti-aliasing nessa linha.

Bem, acho que isso ficará mais prático com um exemplo:

Nessa imagem, você pode perceber que já não se percebe tanto o serrilhado... Vamos dar uma "ampliada" nela e vermos melhor?

Agora ficou fácil perceber que há vários tons intermediários entre as cores "vizinhas", provocando assim a suavização, ou "smoothing", como costuma ser chamado esse processo.

 

c) Resolução de vídeo:

 

Se você utilizar-se de melhores resoluções de vídeo e maior quantidade de cores por pixel, será muito menor ou até imperceptível o efeito de aliasing, ou seja, um jogo com resolução 640x480 com 16 cores apresentará um maior efeito aliasing (a princípio) que um jogo com resolução 1024x768 com 16 bits de cor(65536 cores, acho). O problema é: quanto maior a resolução de vídeo e quantidade de cores por pixel, maior a quantidade de memória consumida e maior será o processamento gráfico.

 

Mas, se vc for trabalhar com sprites que sofreram o efeito de anti-aliasing em um jogo, teremos um problema: os pixels alterados não irão ficar transparentes, dando a aparência de haver uma "borda" na imagem, com cores próximas à cor de transparência.

 

Por exemplo, eu tenho um círculo branco em uma área preta, sendo q o preto será minha cor de trasparência. Se eu tiver aplicado anti-aliasing nela, haverá tons de cinza escuros e claros próximos ao círculo.

 

Agora, se tornarmos o preto como cor transparente, os tons de cinza não irão ficar transparente e aparecerão.

 

Então, é bom lembrar-se que as bordas da imagem em contato com o fundo transparente não podem sofrer anti-aliasing. Mas se mesmo assim querem fazê-lo, será melhor fazer em tempo de execução do seu programa, ou seja, trabalho para o programador.

 

Ele deverá reconhecer os pixels próximos à área transparente e não-transparente, modificar para uma cor intermediária à da área não-transparente próxima a ele e à área não-transparente do cenário em que se encontra (de forma análoga se quiser trabalhar com subpixel).