0 Favourites

[effect] Ascii Art FX

  • So for the end of this day here is another fx called Ascii FX;

    It's convert sprite to "selected ascii chars on glsls code" like .*/+-; etc ..;

    Parameter: Zoom for chars factor. 1 normal 2.0 more zoom ...

    Demo:

    http://gigatron3k.free.fr/html5/C2/FX/Ascii

    Fx file:

    http://gigatron3k.free.fr/html5/C2/FX/ascii.rar

    Have Fun

  • Whoa, awesome! To modulate it, hold ctrl and roll your mouse wheel to zoom; the rez of the ascii field will change.

  • AWESOME, thanks!

  • This is creepy AF

    I love it

  • Using this shader, i saw the chars are made using a binary matrix, so i can draw any 8x12 thing to be used adding how much light represent from 0 to 1.

    The bad thing are the characters not appears correctly <img src="{SMILIES_PATH}/icon_e_sad.gif" alt=":(" title="Sad"> .

    I mean, seems there have some transition of pixels between one char and other. SOme image:

    The chars on the shader code are: ".,-+*#@" . But if you see the image they are mostly broken/glitched like as i said a transition between one and other.

    Is possible just represent exactly that char defined on the matrix inside the shader code?

    @Gigatron can you fix it?

    I saw your shader is based on this one: https://www.shadertoy.com/view/4ll3RB . There works perfectly even with colors. Is possible?

    Also other shader that can be great to port for ascii are:

    https://www.shadertoy.com/view/lssGDj

    Also have their own bitmap editor to add more kind of chars:

    http://thrill-project.com/archiv/coding/bitmap/

  • Well i solved the color problem with:

    // vec3 col = vec3(1.);

    By

    vec3 col = tex.xyz/max(tex.x,max(tex.y,tex.z));

    But still can't figure how fix the chars display correctly.

  • matriax

    The zoom parameters cause this problem... i have an another version of this fx on my SSD;

    this one must work now with zoom to 1 or 2;

    precision highp float;
    uniform float textureSizeWidth; //width of the texture
    uniform float textureSizeHeight; //height of the texture
    uniform float texelSizeX; //width of one texel
    uniform float texelSizeY; //height of one texel
    uniform mediump float seconds;
    uniform mediump float pixelWidth;
    uniform mediump float pixelHeight;
    varying mediump vec2 vTex;
    uniform sampler2D samplerFront;
    vec2 iResolution = vec2( 1.0/pixelWidth, 1.0/pixelHeight);
    uniform float zoom;
    #define P(id,a,b,c,d,e,f,g,h) if( id == int(pos.y) ){ int pa = a+2*(b+2*(c+2*(d+2*(e+2*(f+2*(g+2*(h))))))); cha = floor(mod(float(pa)/pow(2.,float(pos.x)-1.),2.)); }
    
    void main()
    {
    		vec2 uv = -vec2(floor(gl_FragCoord.x/8./zoom)*8.*zoom,floor(gl_FragCoord.y/12./zoom)*12.*zoom)/iResolution;
    		ivec2 pos = ivec2(mod(gl_FragCoord.x/zoom,8.),mod(gl_FragCoord.y/zoom,12.));
    		vec4 tex = texture2D(samplerFront,vTex);
    		float cha = 0.;
    
    			float g = tex.r+tex.g+tex.b;
    
    			if( g < .125 )
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,0,0,0,0,0,0);
    			P(9,0,0,0,0,0,0,0,0);
    			P(8,0,0,0,0,0,0,0,0);
    			P(7,0,0,0,0,0,0,0,0);
    			P(6,0,0,0,0,0,0,0,0);
    			P(5,0,0,0,0,0,0,0,0);
    			P(4,0,0,0,0,0,0,0,0);
    			P(3,0,0,0,0,0,0,0,0);
    			P(2,0,0,0,0,0,0,0,0);
    			P(1,0,0,0,0,0,0,0,0);
    			P(0,0,0,0,0,0,0,0,0);
    			}
    			else if( g < .25 ) // .
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,0,0,0,0,0,0);
    			P(9,0,0,0,0,0,0,0,0);
    			P(8,0,0,0,0,0,0,0,0);
    			P(7,0,0,0,0,0,0,0,0);
    			P(6,0,0,0,0,0,0,0,0);
    			P(5,0,0,0,0,0,0,0,0);
    			P(4,0,0,0,1,1,0,0,0);
    			P(3,0,0,0,1,1,0,0,0);
    			P(2,0,0,0,0,0,0,0,0);
    			P(1,0,0,0,0,0,0,0,0);
    			P(0,0,0,0,0,0,0,0,0);
    			}
    			else if( g < .375 ) // ,
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,0,0,0,0,0,0);
    			P(9,0,0,0,0,0,0,0,0);
    			P(8,0,0,0,0,0,0,0,0);
    			P(7,0,0,0,0,0,0,0,0);
    			P(6,0,0,0,0,0,0,0,0);
    			P(5,0,0,0,0,0,0,0,0);
    			P(4,0,0,0,1,1,0,0,0);
    			P(3,0,0,0,1,1,0,0,0);
    			P(2,0,0,0,0,1,0,0,0);
    			P(1,0,0,0,1,0,0,0,0);
    			P(0,0,0,0,0,0,0,0,0);
    			}
    			else if( g < .5 ) // -
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,0,0,0,0,0,0);
    			P(9,0,0,0,0,0,0,0,0);
    			P(8,0,0,0,0,0,0,0,0);
    			P(7,0,0,0,0,0,0,0,0);
    			P(6,1,1,1,1,1,1,1,0);
    			P(5,0,0,0,0,0,0,0,0);
    			P(4,0,0,0,0,0,0,0,0);
    			P(3,0,0,0,0,0,0,0,0);
    			P(2,0,0,0,0,0,0,0,0);
    			P(1,0,0,0,0,0,0,0,0);
    			P(0,0,0,0,0,0,0,0,0);
    			}
    			else if(g < .625 ) // +
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,0,0,0,0,0,0);
    			P(9, 0,0,0,1,0,0,0,0);
    			P(8, 0,0,0,1,0,0,0,0);
    			P(7, 0,0,0,1,0,0,0,0);
    			P(6, 1,1,1,1,1,1,1,0);
    			P(5, 0,0,0,1,0,0,0,0);
    			P(4, 0,0,0,1,0,0,0,0);
    			P(3, 0,0,0,1,0,0,0,0);
    			P(2, 0,0,0,0,0,0,0,0);
    			P(1, 0,0,0,0,0,0,0,0);
    			P(0, 0,0,0,0,0,0,0,0);
    			}
    			else if(g < .75 ) // *
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,0,1,0,0,0,0);
    			P(9,1,0,0,1,0,0,1,0);
    			P(8,0,1,0,1,0,1,0,0);
    			P(7,0,0,1,1,1,0,0,0);
    			P(6,0,0,0,1,0,0,0,0);
    			P(5,0,0,1,1,1,0,0,0);
    			P(4,0,1,0,1,0,1,0,0);
    			P(3,1,0,0,1,0,0,1,0);
    			P(2,0,0,0,1,0,0,0,0);
    			P(1,0,0,0,0,0,0,0,0);
    			P(0,0,0,0,0,0,0,0,0);
    			}
    			else if(g < .875 ) // #
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,1,0,0,1,0,0);
    			P(9,0,0,1,0,0,1,0,0);
    			P(8,1,1,1,1,1,1,1,0);
    			P(7,0,0,1,0,0,1,0,0);
    			P(6,0,0,1,0,0,1,0,0);
    			P(5,0,1,0,0,1,0,0,0);
    			P(4,0,1,0,0,1,0,0,0);
    			P(3,1,1,1,1,1,1,1,0);
    			P(2,0,1,0,0,1,0,0,0);
    			P(1,0,1,0,0,1,0,0,0);
    			P(0,0,0,0,0,0,0,0,0);
    			}
    			else // 
    			{
    			P(11,0,0,0,0,0,0,0,0);
    			P(10,0,0,1,1,1,1,0,0);
    			P(9,0,1,0,0,0,0,1,0);
    			P(8,1,0,0,0,1,1,1,0);
    			P(7,1,0,0,1,0,0,1,0);
    			P(6,1,0,0,1,0,0,1,0);
    			P(5,1,0,0,1,0,0,1,0);
    			P(4,1,0,0,1,0,0,1,0);
    			P(3,1,0,0,1,1,1,1,0);
    			P(2,0,1,0,0,0,0,0,0);
    			P(1,0,0,1,1,1,1,1,0);
    			P(0,0,0,0,0,0,0,0,0);
    			}
        
    vec3 col = vec3(tex.xyz);
    gl_FragColor = vec4(cha*col,1.);
    }
    
    [/code:i1chtnow]
  • Gigatron Still same problem no matter the number of zoom :S . I tried to add this shader to Sprite and a layer and nothing.

    You said the problem is the zoom, but the zoom funtions are the same. What i see this code erases the "gray" function to use full color in letters meanwhile in the real shader only uses 1 color for each letter. ¿? Also there is some wrong on wich chars are chosed because mainly all are "@" the high luminosity.

  • Gigatron I edited the Pixellate Shader on C2 to separate the pixelation on width/height so i can get the 8x12 of the ASCII matrix and then works correctly:

    So, the shader needs some kind of pixelation to get the same size of the chars to avoid the problem that can be a solution, but i don't know how to implement o the ASCII one.

  • Construct 3

    Buy Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Buy Now Construct 3 users don't see these ads
  • Amazing! Gigatron

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)
Similar Topics Posts Views Last Post
Unread sticky
0 Favourites
Artists post your art
423 423,450
RanKiyomi's avatar
RanKiyomi
Unread sticky
276 261,912
gamecorpstudio's avatar
gamecorpstudio
Unread hot topic
164 38,108
totoe's avatar
totoe