0 Favourites

[C3][Effects] Skend converted

  • This one is for bilgekaan

    Converted over skend effect.

    Skend.c3addon

    Result below.

    SkendTest.c3p

    New effect (modified version of Skend):

    SkendPow.c3addon

    Also includes parameter to adjust the exponent of the skew variation (originally started at 2.0 for the Skend effect, higher makes the base skew less, lower makes the base skew more.)

    SkendPowTest.c3p

    bilgekaan let me know if it works for you.

    [Changes needed to make the effect work are in subsequent posts.]

  • Mika It's working now. Thank you!

  • Hi, I'm interested in using this fx, but reading the c2 thread it appears it doesn't work when exported? Is this correct for c3?

    [quote:3bisupur]Effects like seamless screw up when exported as it doesnt take into consideration that construct bundles images into sprite sheets. Something similar could be happening with Skend.

    Thanks.

  • Mikal could you post the capx aswell please !

  • Construct 3

    Buy Construct 3

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

    Buy Now Construct 3 users don't see these ads
  • Added SkendTest.c3p to original post for LaurenceBedford

    m00npunk - good question, not sure, I'll leave that as an exercise for the reader. It seems like if there was a concern, you could pad your sprite that you are skending, so the shader would not touch other sprite data in a sprite sheet. The simple SkendTest does work with Remote Preview on an IPhone with Safari.

  • Mikal That's weird. It looks like this in my template.

    I think it tries to skew whole sprite sheet as mOOnpunk mentioned.

  • Mikal That's weird. It looks like this in my template.

    I think it tries to skew whole sprite sheet as mOOnpunk mentioned.

    bilgekaan that looks pretty strange, can you share your *.c3p project, so I can try it also and take a look? It also does not appear to 'Skend' the way I expect (where the amount changing depends on Y coord of the texel/sprite.) Instead, it looks like the entire image is shifting.

    If you use the SkendTest.c3p project I posted above, do you see the same issue?

  • Ok, I see the same error when I add more sprites. Hmmm, let's see if there are some new C3 effect uniforms that can adjust for this.

  • I am not sure why the behavior is different between C3 and C2, but in C3 the wrong skend behavior shows up when there are more sprites in the project (and when sprites are packed into some large textures.) To resolve this I normalized the delta x offset based on srcStart/SrcEnd and also switched back to pixelSize.y. See comments in the effect.fx code below.

    I updated the c3addon in the OP with this new version, bilgekaan please try it again.

    I tried a few tests with a different number of other sprites and checked for how the textures were packed using the chrome debugger, the effect worked across a few cases, but watch for the skend effect changing as you change the number of sprite objects (not instances) and size of the sprite source texture (animation).

    Also the more you skend, you may need to 'pad' in your original texture or you'll get clipping and perhaps sampling neighboring textures in the case of packed textures.

    Here's the new code:

    /////////////////////////////////////////////////////////
    // Skend effect
    varying mediump vec2 vTex;
    uniform lowp sampler2D samplerFront;
    
    uniform lowp float pixelWidth;
    uniform lowp float pixelHeight;
    uniform lowp float Skend;
    uniform mediump vec2 pixelSize;
    uniform mediump vec2 srcEnd;
    uniform mediump vec2 srcStart;
    uniform mediump vec2 srcOriginStart;
    uniform mediump vec2 srcOriginEnd;
    uniform mediump vec2 layoutStart;
    uniform mediump vec2 layoutEnd;
    
    void main(void)
    {	
    	mediump vec2 tex = vTex;
    	mediump vec2 texOffset = tex - srcStart;
    	
    	// Original from C2 effect, did not work with sprite packing in C3 and pixelHeight did not seem to work
    	// tex.y -= (pixelHeight*Skend)*pow(tex.x,2.0);
    	// Instead, calculate the normalised position n of vTex in the foreground rectangle and use that for Skend amount
    	mediump vec2 n = (vTex - srcOriginStart) / (srcOriginEnd - srcOriginStart);
    	tex.y -= (pixelSize.y*Skend)*pow(n.x,2.0);
    		
    	gl_FragColor = texture2D(samplerFront,tex);
    }[/code:1a37uoab]
  • Mikal It still bends the whole sprite sheet that the grass sprite belongs but this version is usable if we create more blank space in the grass sprite. Thank you!

  • I took another crack at it, bilgekaan, want to try a new version? Thanks for all the testing! Updated link in OP.

    I added this:

    tex = clamp(tex, srcOriginStart, srcOriginEnd);[/code:g8bmrfq7]
    Now the texture being sampled should clamp to the edges of the sprites texture in the spritesheet, regardless of how big the spritesheet itself is. Be aware of the clamping, it will repeat the edges of the texture as the tex uv clamp. In this case, since the edges around the grass sprite are transparent, it works well. So, you should no longer need a lot of padding (except to make sure the actual rendered sprite does not clip.)
    
    I also created a new effect SkendPow which lets you adjust the exponent which controls the skew/bend, in the original effect this was fixed at '2.0', but now you have another parameter to play with. Truth be told, '2.0' looks the best to my eye, but high numbers make the lower part of the grass look more 'stiff', something to try for different effects. SkendPow is not directly compatible because it has an extra parameter, something to be aware of.
  • Hi, I'm interested in using this fx, but reading the c2 thread it appears it doesn't work when exported? Is this correct for c3?

    [quote:18o1lchx]Effects like seamless screw up when exported as it doesnt take into consideration that construct bundles images into sprite sheets. Something similar could be happening with Skend.

    Thanks.

    With the changes to the effect using srcOriginStart and srcOriginEnd (for scaling and clamping), it should take care of how C3 bundles images into sprite sheets.

    This post helps explain the reasoning:

  • Thank you Mikal for your hard work in bringing this great fx to c3!

  • I took another crack at it, bilgekaan, want to try a new version? Thanks for all the testing! Updated link in OP.

    I added this:

    tex = clamp(tex, srcOriginStart, srcOriginEnd);[/code:3k80hntj]
    Now the texture being sampled should clamp to the edges of the sprites texture in the spritesheet, regardless of how big the spritesheet itself is. Be aware of the clamping, it will repeat the edges of the texture as the tex uv clamp. In this case, since the edges around the grass sprite are transparent, it works well. So, you should no longer need a lot of padding (except to make sure the actual rendered sprite does not clip.)
    
    I also created a new effect SkendPow which lets you adjust the exponent which controls the skew/bend, in the original effect this was fixed at '2.0', but now you have another parameter to play with. Truth be told, '2.0' looks the best to my eye, but high numbers make the lower part of the grass look more 'stiff', something to try for different effects. SkendPow is not directly compatible because it has an extra parameter, something to be aware of.
    

    The new version works without any problem. Thank you!

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)