OpenGL SL - Mosaic effect

Mosaic effect is similar to lowering the resolution of an image. Let's see example image.

And full source code likes below.

void mainImage( out vec4 fragColor, in vec2 fragCoord ){

    // Normalized pixel coordinates (from 0 to 1)

    vec2 uv = fragCoord/iResolution.xy;

    if (uv.x > 0.7 && uv.y < 0.4){

        //left bottoom small image

        uv.x -= 0.6;

        uv *= 2.0;

        fragColor = texture(iChannel0, uv);

        fragColor += vec4(0.2);

        return;

    }

    //mosaic effect

    uv = uv * 30.0;

    vec2 uv = floor(uv);

    uv = uv/30.0;

    fragColor = texture(iChannel0, uv);

}

The key function of mosaic effect is "floor"

If you want to make it sharper, multiply uv by a larger number.

genType = floor(genType x);

returns a value equal to the nearest integer that is less than or equal to x.

By using floor function, You can lower the resolution by dividing the color interval, which is a mosaic effect.