How can I do an infinite scroll zoom parallax effect for a website using Adobe XD?

[Alessandro25033554w2wb]

like this site: 

http://2011.beercamp.com/

https://365ayearof.cartier.com/

Thanks

[Spas K. · Accepted solution]

You can't exactly replicate it in Xd. You can simulate it by making each "page" a component, and using the 3D transform, changing the Z coordinate value. But it won't work with scrolling.

You can have the menu transition between artboards with Auto-animate, and when it's time to develop it, you will let the developers know this should also work with scrolling in 3D space.

Made a simple example for you. Here's the Xd file, and here's the prototype. Pay attention to the Z values of each page, and the Z value of the menu, so it stays on top. You will have to compensate with resizing the menu when you change its Z value, since it will get bigger as it gets closer to the camera.

[Alessandro25033554w2wb]

You've been enormously helpful.