What is the best way to recreate the Spongebob bubble transition?

Hello, I would like to replicate the bubble transition from Spongebob where they float up like real bubbles. I use DOTween for procedural animation and these are my UI scripts to make the UI.[Attachments Below]. Thanks guys.

6882053–804011–BaseUIController.cs (1.49 KB)
6882053–804014–UILayer.cs (1.4 KB)
6882053–804017–UIManager.cs (2.36 KB)

If you post a code snippet, ALWAYS USE CODE TAGS:

How to use code tags: Using code tags properly

Any type of visual effect is going to be 99% scene setup. To help gain more insight into your problem, I recommend liberally sprinkling Debug.Log() statements through your code to display information in realtime.

Doing this should help you answer these types of questions:

  • is this code even running? which parts are running? how often does it run?
  • what are the values of the variables involved? Are they initialized?

Knowing this information will help you reason about the behavior you are seeing.

Beyond that, start with lots of visual effect tutorials (such as how to do a “wipe” as 2D transitions are often called) and work in steps towards what you want.

Those tutorials don’t use the same UI code I use, thus they would be useless