Recently, I came across some great inspiration for 3D animations. There are so many possibilities, but it can be tricky to find the right balance and not overdo it. Anything 3D on a website looks especially impressive when scrolled, as the motion reveals the magic of 3D to our eyes, even though the screen is flat (still) 🙂
This one gave me a lot of inspiration for an on-scroll effect:
And then this awesome reel by Thomas Monavon, too:
So here’s a small scroll experiment with rotating 3D panels, along with a page transition animation using GSAP:
You’ve surely heard the news that GSAP is now completely free, which means we can now use those great plugins and share the code with you! In this specific example, I used the rewritten SplitText and SmoothScroller.
This is just a proof of concept (especially the page transition).
I really hope you enjoy this and find it inspirational!