Jump to content
Search Community

Is It Possible to Create a 3D Rotating Gallery around ThreeJs Model with GSAP....?

Suyash Surve test
Moderator Tag

Recommended Posts

Of course, definetly possible. I've been using gsap to animate 3d elements in both threejs and r3f. 

Don't expect ready solution, but I would strongly suggest watching Yuri Artiukh streams on youtube - this one has something similar to what you're looking for, just need to modify it to your needs

  • Like 1
Link to comment
Share on other sites

Checked that, but that seems kind of different than what I want to achieve. He used webgl too which I'm unfamiliar with. So is there any other way that it can be possible with GSAP...? Like by adjusting position of each block and then on scroll it should move similar to the Active Theory's website....?

Link to comment
Share on other sites

1 hour ago, Suyash Surve said:

Checked that, but that seems kind of different than what I want to achieve. He used webgl too which I'm unfamiliar with. So is there any other way that it can be possible with GSAP...? Like by adjusting position of each block and then on scroll it should move similar to the Active Theory's website....?

Not sure what you mean, it uses threejs which is a library that is based on webgl, Yuri uses threejs and vanilla javascript so it's all the same. 

GSAP can animate almost anything in threejs, so you can easily create some planes on the canvas, give them textures, rotatations and position them the way you want, then wrap in group  and use gsap to animate that group like gsap.to(group.rotation, { y: 360 }) and adding scrollTrigger to it.

  • Like 3
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...