Three.js Journey

Lessons

My working files as I go through the course — each lesson is a standalone scene.

11 lessons so far

21 Advanced Techniques

Imported Models

Loading glTF models — plain, binary, embedded and Draco-compressed — and playing their baked animations.

GLTFLoaderDracoAnimationMixer

Open lesson

20 Advanced Techniques

Physics

Rigid bodies falling and colliding on a floor, with a physics world stepped alongside the render loop.

Cannon-esCollisionsRigid Bodies

Open lesson

19 Advanced Techniques

Scroll Based Animation

A one-page portfolio where the scroll position drives the camera and the objects on screen.

ScrollMeshToonMaterialParallax

Open lesson

18 Classic Techniques

Galaxy Generator

A procedurally generated galaxy, tweakable in real time from lil-gui.

PointsBufferGeometrylil-gui

Open lesson

17 Classic Techniques

Particles

Rendering thousands of sprites with Points and BufferGeometry.

PointsBufferGeometryPointsMaterial

Open lesson

16 Classic Techniques

Haunted House

The full scene build — house, graves and fog, with PBR texture sets for the walls, roof, floor and bushes.

PBR TexturesFogTimer

Open lesson

15 Classic Techniques

Shadows

Directional and ambient light over a sphere and floor plane, with lil-gui controls for light position and material response.

DirectionalLightMeshStandardMateriallil-gui

Open lesson

14 Classic Techniques

Lights

Ambient and point lights over a standard material, shading a sphere, cube, torus and floor plane.

AmbientLightPointLightMeshStandardMaterial

Open lesson

12 Basics

3D Text

TextGeometry with a loaded font and matcap materials, surrounded by a field of scattered donuts.

TextGeometryFontLoaderMatcap

Open lesson

11 Basics

Materials

Every built-in material side by side — from MeshBasic to MeshPhysical with transmission, lit by an HDR environment map.

MeshPhysicalMaterialRGBELoaderlil-gui

Open lesson

04 Basics

Transform Objects

Position, rotation and scale on a mesh, with an axes helper for orientation.

MeshPositionAxesHelper

Open lesson