The Multiverse Gate is my second project, developed during a four week, halftime period. This project features a projectile that, on impact, compresses unstable particles, shooting up, opening unstable glitching gate to the multiverse. The project was heavily inspired by Spider-Man: Into the Spider-Verse´s stylized aesthetic and, more specifically its glitching effects.
Process & Workflow
Before making the effect I analyzed the art direction and the glitch effects in Spider-Man: Into the Spider-Verse and broke it down into four key components:
The Glitch Effect: The glitch effect applying to the gate, glitching between different types of post process shaders
The System: The system controlling the glitch effects behavior
The Portal Effect: The primary effect tying the components together
The Environment: A post process, making the environment follow the same artstyle as the typical stylized comic book style as the movie
The Glitch Effect
The glitch effect was made using a post process effect connected to a custom stencil, filtering the effect from the rest of the scene.
The post process effect uses the custom stencil to apply the glitch effect, distorting only objects using the custom stencil, which creates the glitch effect. It´s then connected to the system, where the custom stencil is applied to the Niagara system when spawned. Using a material parameter collection the system randomizes the effect, allowing for the effect to feel more chaotic.
The post process uses a texture made in Substance Designer, which is shown below. View shader graph here
The System
The system utilized the bullet blueprint and from there triggered a custom event upon colliding with the ground, spawning the effect as well as applying randomized glitch behavior to enhance its chaotic behavior. View blueprint graph here
The video below showcases the final result of the system, showcasing how the systems randomizer affects the overal glitch effect.
The Portal Effect
The Portal Effect was made using textures done in Substance Designer and then exported into Unreal Engine.
Using the texture below, the portal was then animated and used into Unreal Engine´s Niagara system. View shader graph here
The Environment
The environment was made to be stylized using a post process, where I combined a cel shader with a halftone filter applied to the screen. To further enhance the comic book style I integrated chromatic aberration, adding more depth and distortion, fitting the style of the environment in Spider-Man: Into the Spider-Verse. View shader graph here
If I Had More Time
If I had more time, I would put more time into creating custom trails for the portal effect as it currently uses Niagaras default trails. Creating the custom trails would push the comic effect even further, enhancing the overall effect.
Additionally I would have experimented with alternative ways to use a technique that could add depth in comparison to the bump offset. I would also spend more time looking into methods that would further optimize the shaders, increasing the overall performance.
Conclusions & Takeaways
Conclusions
This project was incredibly fun and allowed me to work with a glitch effect I've always found to be fascinating. I'm very happy with how the final effect turned out, and the experience gave me valuable experience that I'll be able to carry out into future projects.
Takeaways
This project taught me alot about post process effects and how they function overall, as well as how to apply them effectively in Unreal Engine. I was also taught a great deal in how to control the post process behavior in order to achieve the effect similar to the effects in Spider-Man: Into the Spider-Verse. While working with the main effect I gained a lot of experience in adapting VFX to fit a specific artstyle.
Additionally I gained a better understanding of timing and composition, ensuring that the effect had the correct visual impact. Being able to explore color theory, I was able to be more informed when making design choices.