Mikal's Forum Posts

  • In working on the port of the h & v big Blur, I have found interesting behavior with the effect uniform pixelSize. I am wondering about the best way to handle this.

    The first effect and second effect have different 'relative' pixelSize, so it's not possible to use the same value multiplied by pixelSize to blur each. The first effect renders to offscreen FB from source texture from spritesheet, the second effect renders to Canvas FB from the offscreen FB. It seems like due to differences between the two, the pixelSize is relatively different (e.g. between spritesheet texture and offscreen FB texture.) What's the best method to make these similar?

    I am going to experiment with using must-predraw to see if it would make the behavior consistent (then both will render to offscreen FB first and use that texture.)

    Here's an example of the uniforms from one frame of render (captured by Spector.js):

    Another interesting thing for me was how srcOriginEnd and srcOriginStart can be flipped in terms of which one is higher (at least for the Y value), so I cannot just use clamp (vTex, srcOriginStart, srcOriginEnd) to clamp to vTex to the texture bounds, I had to create a 'new' clamp function which uses min and max of the two. 

    	mediump vec2 newTex = vTex + vec2(halfPixelHeight, pos * realSizeH);
	newTex.x = clamp(newTex.x,min(srcOriginStart.x, srcOriginEnd.x),max(srcOriginStart.x, srcOriginEnd.x));
	newTex.y = clamp(newTex.y,min(srcOriginStart.y, srcOriginEnd.y),max(srcOriginStart.y, srcOriginEnd.y));

    Here's the example plugins:

    construct.net/en/make-games/addons/347/bigblurh

    construct.net/en/make-games/addons/346/bigblurv

    Note the example project has opacity set to 99% to add yet another effect to the stack and make the behavior consistent. Set the opacity to 100% to see similar results as above.

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads

  • rraffo I updated the clamp function, so it should handle effect stacks across platforms more consistently. Please try again with the new versions (1.1.0.0).

    It now also works for me on iOS.

    For others with this issue here's what I changed: 

    	mediump vec2 newTex = vTex + vec2(halfPixelHeight, pos * realSizeH);
	newTex.x = clamp(newTex.x,min(srcOriginStart.x, srcOriginEnd.x),max(srcOriginStart.x, srcOriginEnd.x));
	newTex.y = clamp(newTex.y,min(srcOriginStart.y, srcOriginEnd.y),max(srcOriginStart.y, srcOriginEnd.y));

    Also, it seems like pixelSize is not relatively consistent across an effect stack, one way around this is to set the opacity of the object to 99%, so the effects in the effect stack then have consistent pixelSize. Otherwise you may need to use different H and V scaling for the blur.

  • rraffo Interesting - what platform are you running your test on? I see something similar on iOS.

    I have an idea that it may have to do with using glsl function clamp with srcOriginStart and srcOriginEnd. When I stack effects, I think C3 may do interesting things with srcOriginStart and srcOriginEnd (like flip the Y axis or something, so I cannot rely srcOriginEnd.y to be bigger than srcOriginStart.y.) I observe this using Spector.js and my test project.

    Ashley does that make sense - srcOriginStart.* will not always be less than srcOriginEnd.* depending on whether intermediate rendering is required to a different FB, because of effect stacking? So, I would not be able to use clamp(vTexNew,srcOriginStart, srcOriginEnd) instead to do a clamp on y for a texture sample address, I would need to use min(srcOriginStart.y, srcOriginEnd.y) and max(srcOriginStart.y, srcOriginEnd.y) and do separate compares to 'clamp' a texture sample to the edge of the image (original texture or texture used as FB?)

  • You can try adding the pixellate effect to the Spine object. Also perhaps try low quality upscaling.

    Also - when you export, what is the resolution used for the Spine render? It's an interesting issue, thanks for the sample project, I will take a look.

    I also just checked, in the example project, the spine render is being done into a width: 214, height: 353 texture and the rendering from the atlas into the texture is being done using nearest.

    Try scaling the Spine object to 214, 353 it will match the original character in terms of size. There are still some differences, still not as sharp, but looks pretty close.

  • WackyToaster

    Check out these for Blur, they use a fair bit of GPU to do a big blur.

    You need to use both H blur and V blur (this is typically more efficient for texture fetch than doing one common blur filter. However the way C3 stacks effects and uses multiple rendering passes, it may not matter much.)

    construct.net/en/make-games/addons/346/bigblurv

    construct.net/en/make-games/addons/347/bigblurh

  • Nice demo on shadertoy!

  • Enjoy and Happy Holidays to all, happy game dev!

    construct.net/en/make-games/addons/344/melt

  • Thanks sizcoz! Miner Mole has been added to the Stirring Creatures and is now live at kindeyegames.itch.io/yule-log Don't forget to turn up the audio for the nice crackling sounds of the fire.

  • Thanks newt! Added your nice character, now live at kindeyegames.itch.io/yule-log

    Still looking for more characters from other devs :)

  • Added the cute little egg from WackyToaster, I had to downscale a lot (most of my sprites are 40-60 pixels square, which I forgot to mention.) I will also add newt's after I get my gif slicer to create frames from the gif.

    kindeyegames.itch.io/yule-log

    Anyone else wants to add a character? I would be very happy to do it! Only a few days left until the log burns out :)

  • In my case, I am usually enabling something on the server-side. I've used the below guide in the past. Do you control the server?

    enable-cors.org/server.html

  • Thank you both! I will add them tomorrow with the next update.

    In terms of the Yule Log tradition here is a quote:

    whychristmas.com/customs/yulelog.shtml

    The custom of burning the Yule Log goes back to, and before, medieval times. It was originally a Nordic tradition. Yule is the name of the old Winter Solstice festivals in Scandinavia and other parts of northern Europe, such as Germany.

    The Yule Log was originally an entire tree, that was carefully chosen and brought into the house with great ceremony. The largest end of the log would be placed into the fire hearth while the rest of the tree stuck out into the room! The log would be lit from the remains of the previous year's log which had been carefully stored away and slowly fed into the fire through the Twelve Days of Christmas. It was considered important that the re-lighting process was carried out by someone with clean hands. Nowadays, of course, most people have central heating so it is very difficult to burn a tree!

    So, what I have seen for a while is this tradition continuing to TV (e.g. a station broadcasting a log burning for 24 hours, etc.) Of course, now there are YouTube versions of this and there was a Hearthstone version also (now available on YouTube also.)

    So continuing in this tradition, this is a C3 version that is always online, but for fun, I've added little creatures that scurry around while the fire is burning and it's just nice to collaborate with other C3 devs and artists on a little project. In addition I'm updating it by updating the itch website (and also am using Playfab for at least a message of the day, so I can update a countdown and perhaps adjust some of the fire parameters via LiveOps...)

  • So far, I’ve added three characters from awesome Construct devs:

    rilemtwit’s Mighty Goose

    AldenwarGamedev’s Wizard

    __SleepingPanda’s Baby Dino

    Check them out:

    kindeyegames.itch.io/yule-log

    Looking to add some more characters - let me know if you have something you would like to add!

  • Looking forward to a tutorial, thanks for doing the discovery work.