[C3][Effects] ReflectY experimental

Post reply

❤Follow Topic(4)

0 favourites

5 posts

- Mikal
- - Joined 22 Apr, 2016
  - 111 topics • 1,184 posts
- 1
- 14 Jan, 2018
- Quote
Experimental effect.

I wanted to create a water reflection for my game and used the Paster plugin and it worked well, however then I added effects to the objects that I was reflecting and found out that Paster did not work with objects with effects. So, I started looking at trying to make an effect that does a reflection of the 'background' across the Y axis as I needed in my game. Here is my first result which will hopefully work for me and may work for others.

If you don't need to use effects on objects, you may also want to check out Paster instead.

In this implementation, you must update the OffsetY parameter of the effect, depending on the location of the sprite using the effect. See the *.c3p for an example. In this example I set the origin of the sprite to the top, so the reflection starts at the top of the sprite. I imagine rendering order / layers / z-order matters for this effect, but I have not tested many variations (the example has only two layers.)

The example is also using the Skend effect to show that it works with an effect. You can grab the C3 Skend effect here: Skend C3 Thread.

Effect: ReflectY.c3addon

Project: ReflectYSkendTest.c3p - also requires Skend effect.

[Edit] Updated project file to handle zooming viewport.
Example with moving sprite reflection:
- bilgekaan
- - Joined 29 Dec, 2012
  - 99 topics • 533 posts
- 1
- 16 Jan, 2018
- Quote
Mikal Great effect! Thank you for sharing.
- Mikal
- - Joined 22 Apr, 2016
  - 111 topics • 1,184 posts
- 1
- 16 Jan, 2018
- Quote
Here's an example from my game. I am using the normal map effect, so I could not use Paster directly.

Some learnings putting the effect into real development:
- Need to use ViewportTop/Bottom instead of LayoutHeight to calculate OffsetY (since in my example, I am zooming in and out and the Viewport is changing.) Updating the example with this change (even though not needed in the example which is not zoomed.)
- Placement of effect in z-order and layer order matters (not surprising since it's basically blending)
- Adding some 'blur' effects also is good for non-perfect reflected surface (e.g. water in this case.)
Try Construct 3

Develop games in your browser. Powerful, performant & highly capable.
Try Now Construct 3 users don't see these ads
- Frozen Well Studios
- - Joined 12 Jan, 2014
  - 9 topics • 204 posts
- 1
- 16 Jan, 2018
- Quote
That's a cool effect good work.

And the game is coming on well looking forward to seeing it when complete
- Mikal
- - Joined 22 Apr, 2016
  - 111 topics • 1,184 posts
- 1
- 30 Oct, 2018
- Quote
Updated for C3 runtime based on discussion with Ashley:

It looks like the effect depends on running in screen space to get the texture co-ordinates to work as expected (which makes sense for a reflection shader). Previously the C2 runtime always did a pre-draw step for anything marked as background blending, and the first bounce moves from object space to screen space as it draws to an intermediate surface. The C3 runtime has an optimisation where it can skip the pre-draw stage for unrotated background blending effects, which improves performance but in this case causes the effect to render in object space since it hasn't had a pre-draw step yet, which given the way the shader is written results in the wrong texture co-ordinate calculations.

If you set "must-predraw": true in addon.json it restores the previous behavior and works as expected again in the C3 runtime, so that's your workaround. This is a compatibility difference between the runtimes, but given it's due to an optimisation for the C3 runtime that we want to keep, the solution is to alter the effect instead.