Create Interactive 3D Experiences with TresJS
52m 24s
English
Paid
Course description
The course is dedicated to creating interactive 3D web applications using TresJS—a wrapper for Three.js adapted for Vue. You will learn how to integrate the library into Vue projects, set up a scene, work with objects and lighting, add animations, and implement user interaction.
Read more about the course
The course topics include:
- Integrating TresJS into an existing Vue application
- Creating 3D scenes and adding basic objects
- Controlling position, rotation, and scale through props
- Working with lighting and shadows
- Animating objects through the render loop
- Adding controls for scene navigation
- Loading 3D models and working with them through useGLTF
- Linking model properties with Vue's reactive state
- Enhancing scene visual quality using additional TresJS tools
The course aims to provide you with practical skills in creating modern, dynamic, and visually expressive 3D scenes for the web, suitable for personal projects and portfolios.
Watch Online
0:00
/ #1: Getting Started with the TresJS Product Course Repo
All Course Lessons (13)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Getting Started with the TresJS Product Course Repo Demo | 02:07 | |
| 2 | Add a TresCanvas to Your Vue App | 02:09 | |
| 3 | Add a Cube to Your TresJS 3D Scene | 02:56 | |
| 4 | Transform TresJS Objects Using Props | 04:01 | |
| 5 | Add Ambient and Directional Lighting to Your TresJS Scene | 04:49 | |
| 6 | Enable Shadows in Your TresJS Scene | 05:34 | |
| 7 | Animate TresJS Objects with the useRenderLoop Composable | 06:37 | |
| 8 | Use OrbitControls to Interact with your TresJS Scene | 01:43 | |
| 9 | Project Overview of the TresJS Product Template | 02:47 | |
| 10 | Load Models with useGLTF and the TresJS primitive Component | 07:11 | |
| 11 | Create a Reactive Color Selector in Vue with useState | 05:16 | |
| 12 | Connect a TresJS Model with Vue State | 02:59 | |
| 13 | Enhance Your TresJS Scenes with the @tresjs/cientos Package | 04:15 |
Unlock unlimited learning
Get instant access to all 12 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscription
Want to join the conversation?
Sign in to comment