A hands-on walkthrough from Eduard Bodak on crafting scroll-driven and interactive animations for his portfolio.

Codrops stands at the forefront of innovation in web design, serving as a boundless source of inspiration and knowledge for designers and developers alike. Through a captivating array of tutorials, demos, and showcases, Codrops invites creatives to embark on a journey of exploration, pushing the boundaries of what's possible in web development. From  CSS techniques and JavaScript animations to immersive user interfaces and experiential storytelling, Codrops empowers designers and developers to unleash their creativity and craft unparalleled digital experiences that captivate and engage audiences.

Codrops

Eduard Bodak breaks down three complex GSAP animations from his portfolio: scroll-triggered 3D card flips using Locomotive Scroll, mouse-responsive card rotations with accessibility considerations, and circular card layouts that rotate on scroll. The tutorial covers technical implementation details, performance optimizations, CSS variable integration, and responsive design patterns for creating engaging web animations.

Built to Move: A Closer Look at the Animations Behind Eduard Bodak’s Portfolio

Cards in a circular position that slightly rotate on scroll

Great article, it gives a really clear explanation on how all the animations were build. Thanks for sharing!

Sites like this are really, really annoying.
We need to let go of this “scroll to animate to get where you want”.