I felt that my puzzle game lacked juice. So I decided to add an extremely satisfying level completion animation.

There are two parts here, the player getting sucked into the portal and the screen shatter effect. The latter is more interesting so I’ll start with that.

There are many ways to do a screen shatter effect. The basic idea is to write the screen image to a rendertexture and apply it on something. What I did was:

1. Saved a copy of the current screen image after rendering. This is done through a Scriptable render pass that fetches the data from the camera and blits(copies) it to a texture. Nothing special here, just reusing the one in Unity’s github.
2. Since I have HDR colors in the game, I also had to set the rendertexture color format to 16 bit. Otherwise, the HDR colors would just get written as white after post processing. I actually thought this was a bug until I read this forum post.
3. Prepared a bunch of quads that fill the entirety of the screen. I calculated the screen size and then created, scaled and positioned the quads based on the number I wanted to have on screen.
4. Fed the texture into the quads. Set the texture offset and tiling based on their position. In other words, the bottom left quad should have tiling and offset such that it only has that corner of the screen on it. Since the offsets are different for each quad, I used MaterialPropertyBlocks to set it once for each of them during the creation process.
5. Then I just used dotween to rotate and move the quads towards the camera. I slightly randomized the rotation and movement amount so that the paths of each of the quads are different.
6. One thing worth noting is that Dotween has gimbal lock problems if you go past 360. So I used the solution here.
7. Additionally, since my game was 2Dwith an orthographic camera, moving the quads forward did nothing. So I have a separate perspective camera that only renders these quads and overlaid them on top of my orthographic camera. As a result, I can have a cool 3d effect in my 2d game on demand.
8. The text effect is also done with Dotween. 

So, just a lot of steps but not actually complicated. I actually didn’t even have to google anything outside of the gimbal lock and HDR color issue.

It’s worth noting that I used quads purely out of convenience. The screen image texture is just that, a texture. As long as you have a 3D mesh(or even a sprite), you can use it. So, you could pre-break a mesh and put this texture on to create a shattered glass effect. Or whatever you want really.

For the player animation, I also used Dotween. There are some scaling, rotation and movement tweens applied to the player. Additionally, I also have a trail renderer attached to give that sense of motion.

The screenshake is done through a Cinemachine impulse source. It actually responds to the portal direction(my game has upside down portals, don’t ask why). I just pass it the transform.up direction of the portal as the impact vector and it shakes the screen accordingly.

And that’s all.

You can check out the game Here or on Steam . There's currently a demo you can download for free.

Keep an eye on my Twitter for regular updates.