Blanco y negro

Esta vez aprenderás a hacer que las imágenes se decoloren y regrese al tono de escala de grises, este efecto es bastante utilizado ya sea para evocar un recuerdo en #cinemáticas o para indicar que tu personaje ha muerto en el #gameplay. afortunadamente es un shader muy simple de hacer.

Ya llevo bastantes blogs hablando de efectos de que modifican en las coordenadas UV para distorsionar la imagen, también ha habido bastantes blogs de varios tipos de desenfoque que aprovechan en el fondo las coordenadas UV, pero hemos hablado muy poco del color en si.

Los shaders de color en general no tienen un uso practico excepto para cuestiones muy concretas, también son algo costosos si usas demasiados materiales que modifiquen el color, afortunadamente el decolorar una imagen se usa mucho y su ecuación es muy simple así que no supone un problema.

Mas adelante escribiré acerca de shaders que modifican el #brillo, el #contraste, la #saturación y el #tono, mientras tanto tome este blog como un shader bits, donde explico cosas pequeñas pero que son útiles.

Shader "Mobile Friendly/Image FX/GrayScale" {
Properties {
    _MainTex ("Albedo (RGB)", 2D) = "white" {}
    _LuminosityAmount("GrayScale Amount", Range(0,1)) = 0.5
    }
SubShader {
    Pass{
    CGPROGRAM
    #pragma vertex vert_img
    #pragma fragment frag
    #pragma fragmentoption ARB_precision_hint_fastest
    #include "UnityCG.cginc"
    
    uniform sampler2D _MainTex;
    fixed _LuminosityAmount;
    
    fixed4 frag(v2f_img i) : COLOR {
        fixed4 source = tex2D(_MainTex, i.uv);
        return lerp(source, Luminance(source), _LuminosityAmount);
        }
    ENDCG
    }
}
FallBack "Diffuse"
}

Se preguntará cual es el truco aquí, todo se trata de la función #Luminance, le entregas un color y el te la regresa en blanco y negro en el valor de un flotante, esta función ya viene integrada en unity su formula es un producto punto entre el el color y un coeficiente, el coeficiente para unity es:

 fixed3(0.22, 0.707, 0.071)

pero es común usar otros coeficientes como el espacio de color CIE:

fixed3(0.299, 0.587, 0.114);// CIE Color coefficient

Si quieres usar tu propia función de luminancia, solo bastaría multiplicar y sumar o hacer un producto punto

fixed Lum(fixed3 color){
    return 0.299 * color.r + 0.587 * color.g + 0.114 * color.b;
}
//OR
fixed Lum(fixed3 color){
    return dot(color,fixed3(0.299,0.587,0.114));
}

Para complicarse menos la vida es mejor usar lo que ya trae unity porque evita que en un futuro escribamos código redundante, las optimizaciones ya correrían por cuenta del mismo motor.

Te animo a probar a hacer esta función con distintos coeficientes y ver los cambios, con el tiempo aprenderemos que mas funciones ocultas nos tiene unity para ahorrarnos trabajo.

no siendo mas nos vemos en otro blog y espero que te haya sido útil para tus futuros proyectos.