PROJECT DOSSIER // [THREE.JS JOURNEY]VIEW SOURCE BACK TO PROJECTS →

01 // PROJECT AT A GLANCE

THREE.JS JOURNEY

JSGLSL

A complete real-time 3D course for the browser, followed from the basics to hand-written graphics effects.

A complete course followed independently, devoted to 3D in the browser: displaying objects, lighting them, giving them realistic materials, writing custom visual effects, importing scenes modelled in Blender, and finally building interactive experiences with React. Each lesson is a standalone project, kept with its code.

The Three.js Journey course followed in full: 42 lessons covering Three.js, GLSL, Blender integration and React Three Fiber, each lesson being an independent Vite project.

PRIMARYJavaScript

DELIVERYTEAM RECORD

VERIFICATIONnpm (Vite)

SOURCEINSPECTOR READY

MEDIA ATTACHMENTS (Images, Photos, Videos)

02 // PROJECT SIGNALS

DATE:: 2022
PRIMARY LANG:: JavaScript
GRADE:: —
DURATION:: 2 months
SECONDARY:: GLSL
STACK:: Three.js / React

03 // KEY OUTCOMES

Programming the graphics processor directly in GLSL
A complete production chain, from Blender modelling to an optimised online scene
Culminating in React Three Fiber: game, portfolio and physics

BEYOND THE BRIEF

Draco compression integrated on the imported models, with the decoders embedded in each relevant lesson
Each lesson kept with its own package.json and Vite configuration, which makes the examples individually runnable

04 // SOURCE TREE

READING SOURCE…

Loading…