Dzisiaj chciałbym napisać trochę na temat PostProcessingu i PreProcessingu, czym się różnią te obydwa tematy:
- PreProcessingu – oznacza generowanie danych przed generacja właściwej grafiki
- PostProcessing – oznacza operacje przeprowadzone po wygenerowaniu właściwej grafiki
W przypadku shaderów możemy te dwa elementy wykorzystać do upiększenia lub modyfikacji generowanego obrazu:
- PreProcessing – do generowania pikselizacji przeliczanych punktów, generowania paternów, zniekształceń obrazu (przemieszczenie pikseli w pionie lub poziomie), efekt lustra itd.
- PostProcessing – zmiana kolorystyki obrazu, dodania efektów bazujących na kolorze (sepia, efekty mory, lini monitora CTR, nakładanie gradientów, itd)
Poniżej przedstawiam kilka modyfikacji tego samego obrazu:
PreProcessing
Pierwsza główna modyfikacja polega na, modyfikacji sposobu przeliczania pozycji na:
vec2 fragCoord=gl_FragCoord.xy; //--------------------------------------------- // PreProcessing //--------------------------------------------- // // Pixelize // vec2 div = vec2(resolution.x * 1.0 / resolution.y, 1.0); fragCoord=floor(fragCoord/div)*div; vec2 pos=(fragCoord.xy * 2.0 - resolution.xy) / resolution.y; vec2 uv=fragCoord.xy/resolution.xy; |
Pikselizacja
// // Pixelize // vec2 div = vec2(resolution.x * 1.0 / resolution.y, 1.0); fragCoord=floor(fragCoord/div)*div; |
Dot Pattern
// // Dot Mask // float dot = sin(gl_FragCoord.x) + cos(gl_FragCoord.y); if (dot<0.1){ gl_FragColor=vec4(0.0, 0.0, 0.0, 1.0); return; } |
PostProcessing
CTR Monitor Linie
// // Monitor Line // outColor *= 0.8 + 0.2 * sin(10.0 * time + uv.y * 1000.0); outColor *= 0.95 + 0.05 * sin(70.0 * time) * sin(123.0 * time); |
Square border
// // Square border // outColor *= 0.0 + 1.0 * 16.* uv.x * uv.y * (1.0 - uv.x) * (1.0 - uv.y); |
Vignette
// // Vignette // float lenght=length(pos); outColor *= 1.0 - pow(lenght * 0.7, 20.0); |
Color correction
// // Color correction // float gamma=1.5; float brightness=1.0; float saturation=0.0; outColor=pow(outColor,vec3(gamma))*brightness; outColor=mix(vec3(length(outColor)),outColor,saturation); |
Posterize
// // Posterize // float grayscale = dot(vec3(0.222, 0.707, 0.071), outColor); outColor=grayscale * vec3(0.5, 0.4, 1.0); |
Możliwość komentowania jest wyłączona.