How do I make a dissolve with burn edge effect?

1 favourites
  • 6 posts
From the Asset Store
On the Edge is a puzzle game where you have 40 levels to have fun with.
  • Hey everyone, is it possible to create this dissolve with burn edge effect in Construct 3? I have no idea how to achieve it. Any suggestions? Here’s the effect I’m referring to: godotshaders.com/shader/2d-dissolve-with-burn-edge

    Tagged:

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads
  • Here's the dissolve portion.

    dropbox.com/scl/fi/4xlpja8hk97ttb9lwvlm4/dissolveexample.c3p

    It involves using a noise texture from the advanced random plugin on a drawing canvas, placed above the target sprite on a layer with force own texture enabled, setting the blend mode to destination in, and using an alpha clamp effect with the threshold tweened from 0 to 100%.

    Set the blend mode of the drawing canvas to normal if you need help to visualize what's happening. You can also use the destination out blend mode instead, and tween the alpha clamp threshold from 100 to 0 instead for more or less the same result.

    For the fire part, I imagine you would do exactly the same thing, using the same noise pattern, on a fiery colored texture, but timed so that it starts slightly ahead of the dissolving part.

    The linked effect uses simplex noise instead of perlin noise, but perlin is what we have to work with here in the advanced random plugin, short of importing the simplex algorithm manually or through a JS library.

  • Wow, this is amazing! I don't have much experience with the drawing canvas, but your explanation really helps. I'll experiment with the dissolve part first, and then try to incorporate the fire effect as you suggested.

    Thank you so much for your help

  • Here is my attempt. You'll need a special noise texture, I made mine in Gimp (color to alpha).

    dropbox.com/scl/fi/5117fzjlxjtlm1z59gr55/dissolveexample_dop2000.c3p

  • Thanks, guys! I’ll test both solutions. After years using Construct 3, I didn’t know it was possible to do something like this. Thanks so much for your help!

  • dropbox.com/scl/fi/4v2sedjay6c4tcwm278fb/dissolveandburnexample.c3p

    Now with burn layer.

    Pretty happy how the effect itself turned out - you can change the look and feel significantly by adjusting the tween duration and ease, octave setting for the noise, burn texture, timing between the dissolve and burn, noise type, adding some motion/rotation/animation to the burn texture ect.

    Pretty not happy with how many layers it takes and the redundant base sprite and burn/dissolve masks, along with all the associated events. I'm 99% certain it can be refactored but my brain is not cooperating at the moment. I've never been particularly comfortable layering blend modes in Construct but I'm sure there's a more compact way to do this somehow... aiming for a single base sprite with the flame texture and one mask (maybe 2 are needed for this approach).

    Also the burn texture can probably be drawn with some simple noise on the drawing canvas too, instead of using a sprite.

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