Anti-Alising (AA)

[3visan 416]

Anti-Aliasing

Quando trabalhamos com pixels percebemos que as bordas dos desenhos costumam aparentar muito o fato de que os pixels são de fato quadrados. O problema de muitos desenvolvedores gráficos no começo do pixel art, foi justamente no momento em que precisavam desenhar elementos que não seguissem o padrão quadrado dos pixels, como por exemplo Círculos, Esferas, e bordas redondas. Para muitos, a solução desse problema surgiu com a criação da técnica de ANTI-ALIASING - ou simplesmente - AA.

O AA foi um grande avanço no desenho de formas esféricas ou outras que precisassem passar a idéia de uma superfície lisa, sem irregularidades. Mas como isto é possível se todo sistema televisual utiliza PIXELS para formar gráficos? A resposta é simples: O AA utiliza pixels que misturam as linhas com o plano de fundo em que elas estão. Quando isto é feito, nossos olhos não conseguem distinguir as irregularidades dos pixels. Em primeiro lugar devido ao tamanho dos pixels e segundo lugar devido a uma boa suavização de bordas. Vejam no exemplo:

Na esquerda da imagem, vemos o circulo formado de vários pixels pretos. Suas bordas estão "cruas" e sem AA. Assim, mesmo no aumento menor é possível perceber as falhas de suas bordas redondas.

Na direita da imagem vemos o mesmo circulo após a aplicação da técnica de Anti-Aliasing. E agora, no aumento menor, não se pode mais ver as falhas das bordas.

COMO FAZER O ANTI-ALIASING?

O Anti aliasing é simples apesar de não parecer. Tudo se baseia em 3 passos:

1 - Observar primeiro o desenho que se quer suavizar.

2 - Observar o fundo no qual este desenho está inserido.

3 - Adicionar cores que simbolizam a mistura das cores do desenho, com o seu fundo.

No exemplo acima (dos circulos) tinhamos um circulo PRETO, num fundo BRANCO, então apenas adicionamos tons de CINZA (PRETO + BRANCO) para sua visar a borda.

Vejamos melhor como isso se dá no exemplo abaixo:

Seguindo os passos do Anti-Aliasing, temos:

1 - Linha amarela (Desenho que quero suavizar)

2 - Fundos Vermelho e Azul (Fundos nos quais o desenho que quero suavizar - linha amarela - está inserido)

3 - Adicionar cores que simbolizam a mistura das cores do desenho com o fundo:

• Linha Amarela + Fundo Vermelho = Anti aliasing LARANJA
  
• Linha Amarela + Fundo Azul = Anti Aliasing VERDE
  

Créditos:

100% Galiant (André do Perspective45)

[join 112]

Olha.

Eu acho que na verdade o Anti Aliasing é uma tecnica utilizada para suavizar imagens computadorizadas e não "todo sistema televisual" como vc está afirmando, uma x que as imagens criadas por computadores precisam ser "geradas" em uma matriz (a memoria d e video ) e antigamente os pcs não dispunham de tanta memoria para poder criar imagens com toda a qualidade grafica que uma tela de tv tem.

Então quando a gente acendia ou acende um "pixel" na verdade estavamos acendendo um ponto que cabem em 10x10 pixel ou 5x5 pixel da tela ou qualquer outa medida similar e não um pixel de verdade na tela.

Mas hoje em dia com a queda dos valores das memoria, acho que essa tecnica nem se usa mais pois podemos contar com tanta memoria para se gerar um grafico quantos forem os pixels da tela e que os graficos vertoriais está a cada dia que se passa uma realidade mais avançada que nem compensa mais se utilizar essa tecnica.

[3visan 416]

Man tudo sistema televisual é feito em pixels lembre-se disso.

Editado Janeiro 18, 2012 por Vittu (veja o histórico de edições)

[join 112]

Sim eu sei disso e não discuto.

O Problema é que o pixel em si consegue gerar qualquer tipo de imagem.

Ou vc acha que a tv analogica usa sistema Anti Aliasing?

E ela é um sistema televisual.

Veja num televisor a imagem não eh formada da mesma forma que em um computador.

[3visan 416]

Eu acho que pode ser isso mesmo qualquer foto que você tirar ou video, se você aproximar muito perto podera ver os pixels (:

[join 112]

kkk

Abraços!!!!

[Cicuta Verde 7]

Bem legal, mas poderia fazer um tuto ensinando a colocar ou a saber qual cor usar com cada fundo e tals.

OBS: Não li tudo. Mas como sou noob um tuto mais bem explicado ajudaria mais.

[3visan 416]

Cicuta no tutorial explica direitinho como colocar ela em uma sprite, é só ler e re-ler.

[Cicuta Verde 7]

Cicuta no tutorial explica direitinho como colocar ela em uma sprite, é só ler e re-ler.

hum, eu sempre achei que pra fazer AA era com algum ferramenta do Photoshop.

Cara para saber a cor do AA, é como se misturasse 2 tintas pra ver que cor fica?

[3visan 416]

Não cara eu faço o AA com a uma cor forte que eu uso na sprite.

[Cicuta Verde 7]

Não cara eu faço o AA com a uma cor forte que eu uso na sprite.

Esqueçe o meu profº ja me ensinou mas que eu achava q AA era com uma ferramenta do PS isso eu achava. kkkk

Editado Janeiro 28, 2012 por Cicuta Verde (veja o histórico de edições)