Crie um Sistema Solar com React Three Fiber

Este curso foi projetado para introduzir você ao mundo do Three.js e do React Three Fiber, guiando você pelo processo de construção de um modelo de Sistema Solar.

Avaliação: 4.4 de 518 avaliações

Duração Total: 2 horas

Total de Aulas: 7

Nível: Iniciante

Este curso tem como objetivo fornecer o conhecimento e as habilidades necessárias para começar a aprender Three.js e React Three Fiber enquanto trabalha em um projeto prático. Ao longo do curso, você ganhará experiência prática na construção e animação de um modelo de Sistema Solar usando Three.js e React Three Fiber.

Neste tutorial passo a passo, exploraremos o processo de criação de um modelo realista da Terra e da Lua usando geometrias de esfera do Three.js. Seguindo os métodos de codificação declarativa do React Three Fiber, você aprenderá como importar modelos 3D no formato glTF, que é considerado o JPG do 3D, usando um modelo 3D especialmente selecionado da Estação Espacial Internacional fornecido pela NASA.

Iremos mergulhar na aplicação de várias texturas de mapa em nossas geometrias de esfera, incluindo mapas esféricos, normais, especulares e de deslocamento, e descobrir como ajustar suas propriedades para obter os efeitos visuais desejados. Além disso, utilizaremos o hook personalizado useFrame para animar facilmente objetos em nossa cena do Three.js.

Ao longo do tutorial, abordaremos conceitos-chave, como meshes, materiais e suas respectivas propriedades. Também exploraremos como configurar e ajustar as luzes do Three.js, além de como implementar helpers em nossa aplicação React Three Fiber usando o hook useHelper. Além disso, aprofundaremos o tema das sombras do Three.js e aprenderemos como implementá-las em nosso projeto.

Ao final deste curso, você terá uma compreensão sólida dos fundamentos da construção e animação de modelos 3D usando Three.js e React Three Fiber. Você estará equipado com as habilidades necessárias para continuar explorando e criando seus próprios projetos no emocionante mundo do desenvolvimento web 3D.

O que você aprenderá:

• Como construir e animar modelos 3D usando Three.js e React Three Fiber
• Importação de modelos 3D no formato glTF
• Aplicação de texturas de mapa em geometrias de esfera
• Ajuste de propriedades de texturas de mapa
• Utilização do hook useFrame para animação de objetos
• Compreensão de meshes, materiais e suas propriedades
• Configuração e ajuste de luzes do Three.js
• Implementação de helpers no React Three Fiber
• Exploração de sombras do Three.js e sua implementação