Scoll based animation

Question 1

Como ativar o efeito de parallax com o mouse?

Answer 1

Capturando mousemove, normalizando de -0.5 a 0.5, e suavizando o movimento com easing usando deltaTime.

Question 2

O que é cameraGroup e por que usamos ele?

Answer 2

Um THREE.Group que encapsula a câmera para permitir aplicar parallax separadamente do movimento de scroll.

Question 3

Qual o papel do gradientMap no MeshToonMaterial?

Answer 3

Define a transição entre luz e sombra com aparência de cartoon, especialmente com NearestFilter para preservar bordas nítidas.

Question 4

Como evitar que partículas sobreponham incorretamente umas às outras?

Answer 4

Usando depthWrite: false e transparent: true no PointsMaterial.

Question 5

Como saber qual seção o usuário está visualizando?

Answer 5

currentSection = Math.round(scrollY / sizes.height)

Question 6

Qual biblioteca é usada para animar rotações ao trocar de seção?

Answer 6

GSAP (gsap.to(…))

Question 7

Por que usamos deltaTime nas animações?

Answer 7

Para garantir consistência na velocidade das animações entre diferentes taxas de frames (FPS).

Question 8

Como posicionar as partículas ao longo das seções?

Answer 8

Com y = objectsDistance * 0.5 - Math.random() * objectsDistance * sectionMeshes.length