1 puntos por GN⁺ 2024-11-21 | 1 comentarios | Compartir por WhatsApp

El viaje de hoy: anti-aliasing

  • El anti-aliasing es una forma de arte que ha evolucionado durante décadas mediante matemáticas, técnicas creativas e innovación constante.
  • Existen diversos enfoques como SSAA, SMAA y DLAA, y cada uno busca lograr el mismo objetivo de una manera distinta.
  • En este artículo se explora cómo funcionan estos métodos y se presenta una nueva forma de resolver el problema: el anti-aliasing analítico.

Configuración

  • Para entender el algoritmo de anti-aliasing, se implementa dibujando un círculo en movimiento usando un canvas de WebGL.
  • Si la resolución es tan alta que no se aprecia el aliasing, se puede bajar la resolución para comprobarlo.

Análisis técnico

  • No es indispensable entender el código de GPU, pero ayuda a comprender la parte analítica.
  • El círculo no se dibuja geométricamente, sino mediante un shader.

SSAA

  • SSAA significa super sampling anti-aliasing, y consiste en renderizar a una resolución mayor y luego hacer downsampling.
  • La implementación es sencilla, pero requiere mucha memoria y cómputo.
  • Se necesita una colocación adecuada de muestras y una integración profunda con el pipeline de renderizado.

MSAA

  • MSAA realiza super sampling solo en la silueta del modelo, la geometría superpuesta y los bordes de texturas.
  • Está implementado por hardware, y su disponibilidad depende del hardware.
  • En ciertas situaciones, puede no tener costo de rendimiento.

Anti-aliasing de posprocesado

  • En 2009, el paper de Alexander Reshetov dio origen a MLAA.
  • FXAA es un algoritmo desarrollado con inspiración en MLAA; tiene bajo costo de rendimiento y es fácil de implementar.
  • Es más efectivo en escenas complejas.

Anti-aliasing analítico

  • El anti-aliasing analítico aborda el problema al revés: conoce la forma necesaria y dibuja en pantalla píxeles ya anti-aliased.
  • No requiere buffers adicionales ni hardware especial, y puede ejecutarse incluso en WebGL 1.0 básico o OpenGLES 2.0.
  • Calcula el tamaño del píxel para desvanecer el borde de la forma.

Implementación

  • Con campos de distancia con signo, se puede conocer en cada punto muestreado la distancia hasta la forma deseada.
  • Para calcular el tamaño del píxel se usan las funciones dFdx, dFdy y fwidth.
  • El blending se realiza con alpha blending o MSAA + Alpha to Coverage.
  • Se puede usar linearstep en lugar de smoothstep para optimizar el rendimiento.

Conclusión

  • El anti-aliasing analítico ofrece bordes suaves al desvanecer con precisión los límites de la forma.
  • Existen varias formas de implementarlo, y se puede elegir entre rendimiento y precisión.

1 comentarios

 
GN⁺ 2024-11-21
Comentarios en Hacker News
  • El análisis de programación gráfica se realizó a través de ejemplos de WebGL y es un artículo muy profundo
    • He estado usando MSAAx4, pero estoy considerando cambiar a FXAA/TAA, y pude aprender un enfoque analítico para elementos de UI
    • Hay pocos materiales sobre programación gráfica, pero la lista de análisis de frames es un recurso útil
    • Muchos juegos no explican las diferencias entre las siglas de las configuraciones de AA, así que les falta ser más amigables para el usuario
    • SDF (mSDF) ya es una técnica clásica suficientemente buena
    • Resolver segmentos de curvas Bézier a nivel de píxel en Slug y DirectWrite es una tecnología actual o del futuro
    • Me enteré por primera vez del trabajo de Captain Disillusion, y lo recomiendo a quienes estén interesados en efectos de video
    • Un frame que incluye círculos y partes ampliadas es una excelente manera de transmitir el mensaje
    • Los gradientes suaves son muy satisfactorios
    • Los motores de renderizado 2D y 3D tienen objetivos y casos de uso completamente distintos
    • En 3D no es importante, pero en 2D hay criterios para técnicas de AA donde la precisión y el sesgo sí importan
    • La captura de pantalla de NeoTokyo fue impresionante, y la pasé muy bien administrando el servidor de ese mod
    • Leí mal SSAA como "antialiasing en espacio de pantalla"