Chapter 01

Getting Started

Meet Adrian, Your Instructor
Get the Most Out of This Course
Access to a Private 24/7 Community
Environment Setup

Chapter 02

Introduction to 3D and Three.js

What is Three.js and Why Use It?
Setting Up Three.js — Your First Step into 3D Web
Basic Three.js Structure
Cameras
OrbitControls

Chapter 03

Transformations

Transformations
Position
Rotation
Scale.

Chapter 04

Meshes and Geometries

An Introduction to Meshes
Geometries
BoxGeometry
SphereGeometry
TorusGeometry
PlaneGeometry
Custom Geometry

Chapter 05

GUI (Graphical User Interface)

GUI (Graphical User Interface)
lil-gui library
Range (Slider)
Color Picker
Checkbox Controls
Folders
Dropdown (Select)

Chapter 06

Lights

Introduction to Lights
AmbientLight
DirectionalLight
PointLight
SpotLight
RectAreaLight
HemisphereLight
Final Lesson of Light

Chapter 07

Materials

Introduction to Materials
MeshBasicMaterial
MeshStandardMaterial
MeshPhysicalMaterial
MeshMatcapMaterial
MeshPhongMaterial
MeshToonMaterial

Chapter 08

Textures

Textures
Color/Albedo Map
Normal Map
Roughness Map/Gloss Map
Displacement Map
Metalness Map
Emissive Map
Specular Map
Mask Map
Environment Map

Chapter 09

Models

Let’s Talk About 3D Models
Add First Model
Change colors
🎛️ Adding GUI Controls for Each Mesh
Playing Model Animations
OBJLoader
Loading .obj + .mtl Models
FBXLoader
Loading FBX Models

Chapter 10

Animations

Basic Animation
GSAP & Three.js
Advanced Camera Animation with GSAP

Course

What is Three.js and Why Use It?

Imagine your website... coming to life What if your site wasn’t just a page — but a full 3D experience? A product floating in space, a virtual room your users can walk through, or even something they can drop into their living room using AR. You're not just learning Three.js . You're learning how to make websites that feel like movies, games, and magic — all in the browser.