The technical magic behind Doctor Strange’s portals in Marvel Rivals

Boasting an expansive roster of playable heroes and villains from across the Marvel multiverse, many with bespoke mechanics, Marvel Rivals presented developer-publisher NetEase games with a myriad of technical challenges to overcome, especially when optimizing the hero shooter for consoles.

Tieyi Zhang, a senior graphics engineer at NetEase Games, hosted a talk at GDC this year to demystify the process behind one specific mechanic: Doctor Strange's portals. If you haven't seen these portals in action in Marvel Rivals, Doctor Strange can open a portal from where he's standing to anywhere on the map within a certain distance. That portal will (in most circumstances) show where players will end up after passing through once the portal is placed. They work and look very similar to those seen in the recent Doctor Strange movies.

Although teleporting a player from one point of three-dimensional space to another already presents technical challenges for the device rendering the environment, the talk mostly focused on a greater challenge: how NetEase managed to render multiple angles of the same environment at the same time with minimal frame loss.

Zhang walked the audience through the many steps of the rendering techniques used to produce the effect, discussed the inspirations behind the effect, and showed the differences in frame rate between various iterations of the technique during his talk.

Related:Unity’s CEO, CTO promise ‘stability’ after runtime fee debacle

He started the talk by showing how the mechanic functioned when using a tool baked into Unreal Engine called Scene Capture 2D, which works like a virtual camera without any optimization changes. He introduced the tool, saying, “For those of you who are familiar with [Unreal Engine 5], the go-to solution for portals is the Scene Capture 2D component. As a built-in tool, it is perfectly documented and supported by many tutorials,” before going on to praise the tool’s “Consistent visual quality in creating captured content.”

Despite the tool’s apparent reliability, the frame rate dropped drastically as Doctor Strange passed through the portal in the videos shown in Zhang’s slideshow. The example shown onstage exhibited a doubled required rendering time, causing the game’s frame rate to plummet to roughly half. However, this could vary in extremity based on the complexity of lighting in the scene. Regardless, given Marvel Rivals' competitive bent, dropped frames during a match can be fatal, especially in such a competitive landscape where less than one fifth of active PC players play new titles.

Related:The scratch coding and sharp constraints at the heart of Animal Well

It Takes Two offered a guiding light

Then, the engineer dredged up a surprising point of inspiration for his solution to this framerate issue: 2021’s widely acclaimed co-op hit It Takes Two. Hazelight’s use of Unreal Engine to render two simultaneous views without drawing an overwhelming amount of power from the computer or console running it led Zheng to utilize a similar rendering technique for the portals Come from lol646ph . Zheng joked about It Takes Two’s largely airtight framerate, quipping, “Does this game use some kind of magic? I don't know!”

Using lagless split screen rendering techniques pioneered by Hazelight and EA’s heavy hitter, Zheng worked out an optimized, frame-efficient solution that took advantage of tech that’s usually reserved for local split-screen co-op, essentially placing another player into the game in order to render the view from the other side. This approach allowed NetEase to use the GPU on board the device much more efficiently, drastically decreasing dropped frames. But NetEase pushed things even further by skipping roughly every 5-10 frames per second within the portal, conserving the computer’s power even more.

Doctor Strange’s portals have proven to be one of Marvel Rivals’ most beloved mechanics, with players finding clever placements and strategies that highlight just how versatile this tech can be, including a now-patched exploit that allowed players to essentially trap their opponents inside of a map’s geometry.

Related:How Assassin’s Creed Shadows makes environments look great up close and at a distance