Greyscale Level Sample
a pic i painted for my girlfriend in the right side
Have you ever seen some pics or videos are made up of characters,like a dancing girl/face/body consist of some "$%&*#" kinda stuff.I used to question that"Did they tpye that?" till i figure out it's quite simple.
Firstly we need a texture and mosaiclize(dont know if the word exist) it.(any pic with full level information).Usually when we sample a texture,the uv coordinate is continuous.But when we do a operation like this.
The coordnate becomes blocked.when we use this to sample a texture,we get the mosaic type.And if you are using a greyscale texture,you can just use it to do the next,otherwise you need to desaturate the tex or just use a single red channel.The result should looked like this,bigger or smaller.
In previous step we use a "floor" to get different blocked values.What we gonna do is using a frac/fract(hlsl/glsl) instead as follow.This will give us a 0-1 uv value repeated n times.We can called this Cell.
Now you can use a few "if" to sample the charaters texture,or we continue the math way.We need to subdivide the sampled value into 9(cause there are 9 characters in the texture) index by floor(value*9.),and now they are 0,1,2...8.After that we make it 2 dimensions by divide 3,use the remainder as X(which is frac(Value/3.)*3.) and quotient as Y(which is floor(Value/3.)).So they are (0,0)(0,1)(0,2)....(2,2) now.We can call this Index.Check the right side of the image beneath,each character cover a uv range from n to n+1/3 in both dimension.Finally (Index+Cell)/3.,end of the story.Just use it to sample the characters texture and the result on the top show up.
