Modificando la señal
A continuación, los efectos que implementarás en el shader para simular vídeo retro de VHS NTSC son los siguientes:
- Desaturación de color
- Desfase del color azul (“color bleeding”)
- Bandas de ruido aleatorio
- Desfase del cuadro de imagen
- “Smudging”
Para cada uno de los efectos, haré una descripción de los cambios que hay que hacer junto con una imagen de cómo se verán los nodos utilizados en cada efecto.
Desaturación de color
La desaturación es una modificación simple que le da un aspecto “low-fi” a la imagen final. Para eso, el shader modificará los valores de color convertidos a YIQ.
Esto lo puedes lograr agregando dos parámetros Vector3 como parámetros al shader para modificar la señal de la imagen. El primer vector, “YIQ Multiply”, multiplícalo con la señal YIQ para alterar la saturación de los colores. El segundo vector, “YIQ Add” úsalo para incrementar la base de la señal, de modo que cada canal sea más brillante o más oscuro. Así, desde el material podrás configurar la modificación de señal con los colores que desees.
Desfase del color azul (“color bleeding”)
Para simular el “sangrado” de colores azul y rojo horizontal, causado por el movimiento horizontal del rayo catódico en un monitor CRT, modificarás la posición del canal I en el espacio YIQ.
Primero crea un duplicado del nodo “Sample 2D Texture” y los nodos que lo conectan para la conversión entre espacios de color RGB y YIQ. Después modifica las coordenadas UV de la pantalla utilizado por el sampler original, agregando un offset al UV base, creando un parámetro del shader “Q offset” de tipo Vector2, y agregando su valor al UV base con un nodo “Add”. Luego, utiliza este nuevo UV modificado con el nodo “Sample 2D Texture” duplicado para obtener el color correspondiente al canal I modificado, y convierte su valor al espacio de color YIQ. De esta salida, extrae únicamente el canal I y lo combinamos con los canales Y y Q del sampler original en un nuevo Vector3, con el cual podrás aplicarle más modificaciones a la señal antes de revertir al espacio de color RGB.
Bandas de ruido aleatorias
Parte de los artefactos visuales causados por el ruido y daño de la cinta y los cabezales se manifiestan como líneas blancas horizontales que aparecen ocasionalmente en la imagen.
Para esto, marcarás una línea horizontal de la imagen como ruido (asumiendo que la imagen va a tener 480 líneas, como la resolución estándar en NTSC), e irás aplicando un offset al UV en el componente V para desplazar esa línea. Si este componente de una línea es menor a 1/480 (es decir, el equivalente en coordenadas normalizadas o “UV” de la posición de la linea en la pantalla), se dibujará de color blanco.
Para que el offset se desplace en toda la imagen, genera un valor aleatorio entre dos números utilizando el tiempo en segundos como semilla aleatoria. Luego, este valor es sustraído al componente V de las coordenadas UV de la pantalla. Esto hace que la línea 1 se mueva verticalmente en la imagen, y en algunas ocasiones, desaparezca al quedar fuera del rango 0,1 del UV, simulando la falta de errores en la señal. Utilizando un comparador, puedes seleccionar que cuando el valor corresponda a la posición de la línea, el shader reemplace la señal con el color blanco en espacio YIQ (es decir, con un Vector3 igual a [1,0,0]).
Desfase del cuadro de imagen
Para mejorar aún más el efecto “retro CRT” de la imagen, puedes agregar desplazamiento en cada una de las líneas horizontales, de modo que simulen ruido en la señal o imprecisión en el monitor CRT.
Similar a la banda de ruido aleatorio, genera un número aleatorio usando el tiempo como semilla para generar un número entre 0 y 1, al cual le agregas un valor “offset” horizontal a las coordenadas UV de la pantalla. En este caso, usa solo el componente V de las coordenadas de pantalla con el nodo de “Gradient Noise” para producir un patrón continuo que indique la intensidad del offset que aplicaremos a cada línea. Este valor multiplícalo con un parámetro tipo float para aumentar o disminuir el desplazamiento del UV que usaremos al extraer los colores de la imagen de la pantalla.
“Smudging”
Finalmente, un artefacto visual adicional que puedes simular es un problema de lectura de los cabezales, los cuales a veces leían la misma línea múltiples veces desde la cinta, produciendo una franja de imagen que parecía borroneada o “smudged”.
El funcionamiento de este efecto se basa en saber qué coordenadas del UV de la pantalla están dentro del área de “smudge” para aplicar el efecto, mientras que el resto de las coordenadas se mantendrán sin cambios. Para eso, compara los valores verticales de las coordenadas UV contra una máscara que mide la distancia vertical desde la coordenada hasta el centro del “smudge”. Para saber contra qué valor comparar las distancias de las coordenadas, usa un parámetro float que indique la anchura del “smudge”, lo cual indicará que límite tiene que sobrepasar la distancia para que el “smudging” no se aplique. Así mismo, para saber el centro del “smudge”, utiliza el tiempo en segundos como base (para que la línea se mueva verticalmente), y multiplícalo por un parámetro de velocidad, resultado del cual extrae su componente fraccionario con un nodo “Fraction” para ajustarlo en términos de la anchura del “smudge”. Por último, reusa este valor del centro del “smudge” para reemplazar el valor V de las coordenadas que estén dentro del “smudge”.
Guarda los cambios y el shader estará terminado.