I need some advice on this animation

Questions
1

Hi there,
I’m a beginner with threejs.
I would like to create an animation like this.
When scrolling down, the paper will be floated to the bottom of the browser.
I’m using PlaneGeometry but have no idea what I will do next.

Thank you.

2

You can opt for 2 options.

  1. Use physics engine like ammo or cannon or enable3d to add softBody object as cloth.
  2. Create similar animation in Blender using cloth simulation and turbulence force field and then you can Bake into keyframes which can be easily triggered on scrolling (for baking refer this: Cloth Bake: Save frames in timeline as shape key? - Blender Stack Exchange)

Considering you’re new to three.js, you might want to opt for second options.

1 Like
3

I think I will go with second options.
Thank you so much!