YoVDO

Create a 3D Product Configurator using TresJS

Offered By: egghead.io

Tags

WebGL Courses User Interface Design Courses

Course Description

Overview

(placeholder) Our goal is to create an application that allows the user to customize a 3D product with different color materials visually.

Syllabus

  • Getting Started with the TresJS Product Course Repo
  • Add a TresCanvas to Your Vue App
  • Add a Cube to Your TresJS 3D Scene
  • Transform TresJS Objects Using Props
  • Add Ambient and Directional Lighting to Your TresJS Scene
  • Enable Shadows in Your TresJS Scene
  • Animate TresJS Objects with the useRenderLoop Composable
  • Use OrbitControls to Interact with your TresJS Scene
  • Project Overview of the TresJS Product Template
  • Load Models with useGLTF and the TresJS primitive Component
  • Create a Reactive Color Selector in Vue with useState
  • Connect a TresJS Model with Vue State
  • Enhance Your TresJS Scenes with the @tresjs/cientos Package

Taught by

Alvaro Saburido

Related Courses

AR for web using JavaScript
Meta via Coursera
Build Complex 3D models with WebGL
egghead.io
Create 3D Graphics in JavaScript Using WebGL
egghead.io
Code a Virtual 3D Art Gallery - Three.js JavaScript Tutorial
freeCodeCamp
Learn Three.js by Building 5 Projects
freeCodeCamp