Welcome to the missing manual for three.js! Discover three.js is a completely free tutorial series designed to get you up to speed fast, so dive straight in and take your websites to the third dimension!
3D Optimization for Web—How I Got a Model From 26MB Down to 560KB
For Q4 investment time, I worked on creating a scrollable, 3D website with a coworker using R3F. From this project, I’d like to highlight my process for optimizing 3D models for web.
Here's a list of all the web animations tutorials we've done so far. From Awwwards website to CSS awards websites, we like to reverse engineer the most creative animations.
Making an interactive digital frame with head-tracking using Three.js and TensorFlow.js | Charlie Gerard | Senior frontend developer & Creative Technologist Charlie Gerard | Senior frontend developer & Creative Technologist
Over the past few weeks, I've been working on a new side project to replicate a visual effect called 'head-coupled perspective' to make interactive art with head tracking, using Three.js and TensorFlow.js.
Painting with Math: A Gentle Study of Raymarching - Maxime Heckel's Blog
A compilation of my Raymarching and Signed Distance Field learnings and work. In it, I teach you how to leverage those techniques along with lighting models, smoothmin, soft shadows, and some math to create beautiful 3D raymarched scenes ranging from abstract shapes to infinite realistic-looking landscapes.