How do you think this Interactive Ad from Royal Match was made?

How do you think this water was made? It is a playable interactive Ad from Royal Match. Where you rescue a character by moving bodies of water. I am interested only in the water mechanics.

Do you think it uses meta-ball physics, similar to this tutorial here?

construct.net/en/tutorials/create-water-games-2172

How would you make a water system similar to the interactive Ad above?

What kind of tricks would you use to make it performant?

What kind of shader would you use?

Thanks in advance!

PS: i want to make flooding water mechanic for my levels in a 2d platform. But it can use pseudo(fake)-physics too. Hence the question :)

Have you ever play the game? Most of them are fake not real-time footage from actual game.

What you showed was the non-interactive part which could be a fixed video, although I’ve seen that ad where it is interactive.

It’s probably a mix of pre-baked videos of the fluid and actual fluid simulation in local areas, although it’s just a guess. Most fluid simulations are grid based or particle based or some mixture of the two. Or maybe they were clever and found a way to just reuse water animations and blend them together.

This channel shows two ways that fluid simulations can be done in general (it’s not construct related).

m.youtube.com/watch

m.youtube.com/watch

You poke around the forum for construct related examples. The simplest would be to using a lot of small physics balls to do the simulation. It doesn’t scale well though. Another is just simulating the surface.

Overall the event system is a bit heavy to implement a water sim. The physics behavior is a bit better but it doesn’t behave the same and also is a bit heavy with that many objects. JavaScript would be the fastest way to go, or maybe using an existing library. It’s just the matter of getting it to play nice with constructs engine.

The main issue getting some custom library to render in construct. You need to modify how the library renders so it just uses constructs renderer which may or may not have all the features you need. Another approach is trying to modify constructs renderer instead, but it’s not designed to allow that easily and officially it’s discouraged and not supported. A third way is to just have a separate canvas with its own renderer and you’d layer the canvas’ on top of each other.

Anyways. Just some general ideas. Personally I’d try to somehow fake it as much as possible.

Thank you R0J0hound. The information you provided is very helpful. I will try to do particle physics only on the surface of the water. And a some rectangles and polygons for below the surface. Maybe I will post my results on this topic and get some feedback.

By the way you were right about the footage. I've posted the wrong video which was probably a rendered video. Definitely not interactive. For people who might visit this page in the future, I will post the real interactive Ad footage here. (which is very annoying to record, because when you click to play on the Ad, it forwards you to App Store page of the game because of the click).