How to add interesting transitions between levels?(Iris, mosaic/pixelization, melting, waves, etc.)

I know there are plenty of tutorials on how to fade in/out transition between levels, but none on other effects. I’m looking to create wave effect, melting effect, iris effect, and pixelization/mosaic effects to transition between levels.

Here are some examples:

Melting effect:

https://i.imgur.com/7yFuLmd.jpg

Iris wipe:
Wave effect:

https://i.imgur.com/1fZRMk4.jpg

Pixelization/mosaic effect:

https://i.imgur.com/Vrj1x8G.jpg

https://

How would I go about implementing this? Since these are two dimensional transitions, I think it might be good to have the game save a screenshot of where the camera/player last was and then have that screenshot laid over the next level. Because I have seen Unreal games that feature the ability to take screenshots in-game.

Now for the iris, I think it would be pretty simple. Maybe animating a transparency/alphamap for the hole expanding at center of the screenshot with the next level underneath. (Ditto for the melting effect. ) Do you think this would work?

For the wave and mosaic transitions, I’m at a loss. I have no idea how I would even begin to do these.

A few questions:
1.How would I make these transitions?
2.Do you think the use of screenshots laid over the next level would be a good idea?
3.How do make the game make screenshots and will the resolution be the same, or would the size of the screenshot depend on the resolution (this is the ideal for me)

He is another video of transitions for reference:
Thanks in advance…

Edit: you might have to right click and press “view image” to see the images in full size. They’re a bit smaller on this forum for some reason

Post Process

You can apply post process effects to in-game screenshots?

Actually to do that transition effect you should combine post process effect with screenshot. Because after changing the level you need to have some information from previous level, to have smooth transition. So you do post process on first level, save screenshot of post processed image of screen, then load next level, and start with postprocess on, which should mix and blend post processed render of current level and previously saved screenshot.

I found these guides and they look extremely promising! Almost exactly what I looking for: :slight_smile:

Here are the links. Have a look:
https://www.parallelcube.com/2017/10…erials-part-1/
https://www.parallelcube.com/2017/10…erials-part-2/

https://www.parallelcube.com/wp_install/wp-content/uploads/2017/10/wave-tr.gif


Now I’m still lost on how to apply these to previous level screenshots. What can I do to do this?

If you want to use this effects in a 3D your best option is to use a Post Process Effect
You have a tutorial explaining how to use this 2D materials into a 3D scene using a post process volume

/

I think this method is easier than taking a screenshot and pass it as a parameter to the “2d” Material, so take a look to the tutorial and give me a feedback with your results

Wow, thanks a lot! I will test this soon.

Will this also work for the wave distortion and radial cutoff transitions in a similar way, or are those different? Please let me know. Those are the only other transitions I would need, except for “blinds” transition? Do you mind doing tutorial on this?

The wave distortion material can be modified in the same way, replace the Texture sample with a SceneTexture node.

The Cutoff transtitions of that tutorial are applied to an image, in full screen, in a widget. You can continue using this materials in 2D with that trick, or you can apply a mask directly to the SceneTexture node.

So the Radial Cutoff Material can be transform from this

to this:

And now can be used in a Post Process Volume, the result is the same.

With regard to blinds transitions I think you have all the knowledge in Transition effects using materials (part 2) – Parallelcube. The most difficult part is to create the gradient mask.

I want to make a short tutorial doing a transition blending to levels at the same time, I dont know when, but I think it would be interesting.

That would be interesting. A lot of people have been wondering how to blend transition between levels, but no one has done it yet (or at least not posted about it online).

It says I need Visual Studio 2017 to open this project. I’ll install it to see it, but when I finally release my game will the users have to download Visual Studio 2017 to run the final packaged game? Because Visual Studio 2017 is a HUGE download size (almost 40GB!).

As any c++ windows application, the users will need to install only the redistributables package (is a bunch of libraries) to be able to run the final game. This package is included in the game build and its size is much lower than a VS installation.

I think my IDE installation is below 40GB. You don’t need to install all the IDE options, to develop only with UE4 just enable Game development with C++

You can follow this guide to see the recommended options

Of course, if you plain to package to other platforms, like Android or IOS, you need to add more options.

Btw, since version 4.20 I think SDK 8,1 is not needed any more