HLSL Shaders: Ejemplo en XNA
Hay una parte muy cool de cuando programar gráficos se trata, esa parte es el utilizar el GPU (Graphics Processing Unit) ósea la mismísima tarjeta de video para hacer cálculos y almacenamiento de memoria.
La Content Pipeline
Actualmente existen lenguajes de alto nivel (Cg de nVidia, HLSL de Microsoft y GLSL para OpenGL) que básicamente funcionan de la siguiente manera:
Primero obviamente lo que necesitamos es crear un shader, este lo podemos hacer desde Visual Studio, o utilizando un programa de autoría de shaders como el Render Monkey de ATI o FX Composser de nVidia, este archivo lo vamos a cargar en nuestra aplicación y la API gráfica se encargará de que la tarjeta de video lo compile en tiempo real, esto se hace para crear una optimización para cada tipo de hardware.
Una vez hecho esto nosotros generamos un conjunto de vértices (estos pueden ser por ejemplo un modelo 3D) activamos el shader desde nuestra aplicación y cuando el GPU realice los cálculos para la proyección tomará en cuenta los parámetros y métodos del shader; después nuestra los drivers convertirán esa salida generada (aún 3D) a coordenadas de pantalla, este proceso se le conoce como rasterización, con nuestros objetos proyectados en la pantalla podemos modificarlos una vez más, esta vez píxel a píxel. :D
Ejemplo
Supongamos que tenemos el siguiente código en un archivo .fx, podemos crear estos archivos dando click derecho en nuestro explorador de soluciones y en agregar nuevo Effect:
Código en Effect1.fx:
//Estas variables representan las matrices de posición de nuestro objeto |
Para utilizarlo vamos a modificar nuestra clase Game1.cs:
Primero, vamos a declarar dos objetos en nuestra clase, uno para el modelo que utilizaremos y otro para nuestro efecto:
Model _model; |
Después vamos a modificar nuestra función LoadContent() para poder cargar nuestros archivos:
protected override void LoadContent() |
Por último vamos a dibujar nuestro modelo con el shader correspondiente y el resultado debe de ser el modelo dibujado completamente en rojo, y esta es la imagen de nuestro primer shader:
¿No es interesante? Bueno, es nuestro "hola, mundo!" de los shaders, así que de aquí podremos partir a cosas más interesantes como iluminación, a continuación les voy a presentar una imagen de un render un poco más complejo:
Este render contiene 3 shaders, uno para los reflejos del agua, otro para el brillo de la nave, y otro que le da un efecto de zoom radial. :)
Conclusiones
Los shaders se utilizan para prácticamente todo el procesamiento de gráficos, algunas aplicaciones lo manejan automáticamente pero si quieres tener el control completo y agregar efectos a tus aplicaciones gráficas la mejor manera es meterle mano.
Los shaders no solo se utilizan en videojuegos o aplicaciones 3D, también se utilizan en edición de imágenes o vídeo, en un futuro tutorial hablaré de como crear shaders de post producción (como los que se utilizan para las películas).
0 comentarios:
Publicar un comentario