How to achieve this "portal" effect for nested scenes

[Ellink]

I’m trying to recreate this portal effect i came across on this page : https://boss-halo-store.dogstudio.co/
Any idea on how this is created ?

[PavelBoytchev]

I have no idea how this specifically is created, but if you look for portals in the forum, you will find quite a lot of posts about them. You could start with this one and its demos:

How to create a portal effect or how to fake it

portals can get complex, especially entering them. the easiest is most likely drei/portal. a first rough scaffold of the website you linked could be done in a few minutes. if you want this in vanilla it can only be done with a shader. it’s not enough to render a scene into a webglrendertarget using the same camera and project it onto a plane, that would skew it when you turn the camera. the plane has to act as a mask into the virtual scene instead. const PortalMaterialImpl = shaderMate…

[drcmda]

that’s a classic enter-portal, among the sandboxes that @PavelBoytchev linked this one will do

Enter portals - CodeSandbox

the enter animation differs slightly in that the portal itself grows to capture the full screen whereas in the box the camera goes in. if you want it exactly like that all you would have to do is increase the mesh scale that holds the portal material.