SplineCria uma animação 3D com scroll e integra-a no Framer
Lição 4 de 8Spline 3DPrincipiante12 min
Neste tutorial, aprendemos a criar uma animação 3D com scroll em que uma planta cresce à medida que o utilizador percorre a página. Vamos configurar eventos de scroll, adicionar transições e incorporar movimento de câmara. Por fim, incorporamos a cena 3D interativa num site, usando o Framer como criador de sites.
👇Usa os links abaixo para fazer remix do design mostrado no vídeo:
🪴 Remix do site e da cena final: https://inspired-walkthroughs-144071.framer.app/ 🌱 Design 3D da planta (sem animações): https://app.spline.design/file/c4dc75ac-ebaf-4b00-a6cc-a1e47347f522
---
Descobre mais criadores e projetos incríveis #MadeInSpline em https://community.spline.design/
O que vais aprender
- 0:00Introdução
- 0:18Exercício básico com um cubo
- 1:20Um olhar sobre as definições do evento Scroll
- 2:42Ajustar as definições de reprodução da animação com scroll
- 3:06Animar o crescimento das folhas
- 7:59Adicionar rotação à animação da planta
- 9:10Adicionar movimento de câmara
- 10:29Exportar como Viewer
- 10:40Incorporar a tua animação 3D num site do Framer
