# Como criar uma esfera 3D reativa com movimento e interação - Spline avançado | A fundo nas funcionalidades - Spline Academy (https://spline.design/pt-pt/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)

> Hoje mostramos-te como criar esta esfera 3D interativa de inspiração tecnológica com o cloner e os eventos do rato no Spline, perfeita para qualquer projeto…

1. [Academy](https://spline.design/pt-pt/academy)
2. [Cursos](https://spline.design/pt-pt/academy/collections)
3. [Spline avançado | A fundo nas funcionalidades](https://spline.design/pt-pt/academy/collections/spline-advanced-feature-deep-dive)
4. Como criar uma esfera 3D reativa com movimento e interação

# Como criar uma esfera 3D reativa com movimento e interação

Lição 3 de 17Spline 3DIntermédio7 min

Hoje mostramos-te como criar esta esfera 3D interativa de inspiração tecnológica com o cloner e os eventos do rato no Spline, perfeita para qualquer projeto web, como landing pages, montras de produto ou qualquer projeto de design que queiras.

Esta cena foi feita por Vlad Kolokolnikov. Explora a comunidade do Spline para encontrares esta e outras cenas 3D gratuitas para fazer remix.

Demonstração: <https://app.spline.design/community/file/306ca2a5-d1ab-46ac-a27c-198575c82db0>

## O que vais aprender

1. [0:00Introdução](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=0s)
2. [0:18Criar o objeto base e adicionar materiais](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=18s)
3. [1:30Usar o Cloner](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=90s)
4. [2:25Adicionar um evento Follow](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=145s)
5. [3:46Adicionar um evento Distance](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=226s)
6. [4:32Aperfeiçoar a animação](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=272s)
7. [5:17Animar o grupo do cloner](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=317s)
8. [5:47Design final](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=347s)
9. [6:13Dicas de exportação](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=373s)
10. [6:20Encerramento](https://www.youtube.com/watch?v=ol3f-vwZhBI&t=380s)

## Recursos relacionados

- [Reactive OrbTemplate](https://app.spline.design/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction?redirect-duplicate-template-uuid=684c8aec-6fec-4d6b-ae37-a3a1fd5fac27&is-2d-file=false)
- [Cloner MotionDocumento](https://docs.spline.design/designing-in-3-d/cloner-motion)
- [How state-based animation worksDocumento](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Materials & ShadingDocumento](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)

## Visão geral

- Spline 3D
- 7 min
- Intermédio

## A seguir

[Usa variáveis para criar conteúdo 3D interativo24 minAvançado](https://spline.design/pt-pt/academy/collections/spline-advanced-feature-deep-dive/use-variables-to-create-interactive-3d-content)[Continuar](https://spline.design/pt-pt/academy/collections/spline-advanced-feature-deep-dive/use-variables-to-create-interactive-3d-content)

[Spline](https://spline.design/pt-pt)

O editor 3D e 2D para equipas e os seus agentes. Publica na web, em iOS e em Android.

#### Pergunta à IA sobre o Spline

#### Produtos

- [Design 3D](https://spline.design/pt-pt/3d-design)
- [Hana](https://spline.design/pt-pt/hana)
- [Omma](https://omma.build)
- [Geração 3D com IA](https://spline.design/pt-pt/ai-generate)
- [Spline MCP](https://spline.design/pt-pt/mcp)
- [Spline Arena](https://spline.design/pt-pt/arena)
- [Preços](https://spline.design/pt-pt/pricing)
- [Empresas](https://spline.design/pt-pt/enterprise)

#### Runtimes

- [Web](https://spline.design/pt-pt/web)
- [iOS](https://spline.design/pt-pt/ios)
- [Android](https://spline.design/pt-pt/android)

#### Apps

- [Transferir](https://spline.design/pt-pt/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Transferir o Spline Mirror](https://spline.design/download-mirror)

#### Aprender

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/pt-pt/academy)
- [API do Spline](https://www.npmjs.com/package/@splinetool/runtime)
- [Soluções](https://spline.design/solutions)

#### Comunidade

- [Comunidade Spline](https://community.spline.design)
- [Blog](https://spline.design/pt-pt/blog)
- [Novidades](https://spline.design/pt-pt/changelog)
- [Educação](https://spline.design/pt-pt/education)
- [Contra](https://spline.design/contra)
- [Afiliados](https://spline.design/pt-pt/affiliate)

#### Empresa

- [Clientes](https://spline.design/pt-pt/customers)
- [Carreiras](https://www.ycombinator.com/companies/spline/jobs)
- [Segurança](https://spline.design/pt-pt/security)

#### Informação legal

- [Termos e condições](https://spline.design/terms)
- [Privacidade](https://spline.design/privacy)

#### Contacto

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.