Skip to main content
Feynman's Blog
Home
Posts
Tags
Series
About
Language
中文
3d
12 posts
2026
12 | Noise Functions
8/31/26
In the previous lesson, we used GLSL math functions to draw shapes and gradients. This lesson enters the “soul tool” of shaders …
threejs
typescript
webgl
3d
glsl
shader
noise
perlin
fbm
Read more
11 | GLSL Math Functions
8/25/26
Last lesson covered GLSL basics and ShaderMaterial data channels. This lesson dives deep into math functions — mix / step / smoothstep for …
threejs
typescript
webgl
3d
glsl
shader
math
sdf
Read more
10 | GLSL Basics
8/15/26
The first 9 lessons all used Three.js built-in materials (MeshStandardMaterial, MeshBasicMaterial…). This lesson starts writing …
threejs
typescript
webgl
3d
glsl
shader
vertex
fragment
Read more
09 | Animation System
7/30/26
In the first 8 lessons, all animations were manually written in the requestAnimationFrame loop. This lesson introduces GSAP tweening and …
threejs
typescript
webgl
3d
gsap
animation
keyframe
Read more
08 | Model Loading
7/28/26
In the first 7 lessons, we created geometry with code. In real projects, 3D models are usually made in Blender/Maya, exported as GLTF/GLB, …
threejs
typescript
webgl
3d
gltf
model-loading
animation
Read more
07 | Scene Graph and Transformations
7/24/26
The scene graph is the skeleton system of Three.js. Understanding parent-child relationships, transform inheritance, and coordinate system …
threejs
typescript
webgl
3d
scene-graph
transform
Read more
06 | Textures and Mapping
7/23/26
Textures are how you “dress up” 3D objects. Understanding UV coordinates, learning to load and control textures, and mastering …
threejs
typescript
webgl
3d
textures
uv-mapping
environment-map
Read more
05 | Cameras and Controls
7/19/26
The camera determines “where you look from” and “how much you see”. Master the difference between perspective and …
threejs
typescript
webgl
3d
cameras
controls
Read more
04 | Lights and Shadows
7/17/26
Lights are the soul of a 3D scene. Master 5 light types and the three shadow elements to transform your scene from “flat” to a …
threejs
typescript
webgl
3d
lights
shadows
Read more
03 | Material System
7/16/26
Materials determine how object surfaces interact with light. Master 6 material types and PBR parameters to transform 3D objects from …
threejs
typescript
webgl
3d
materials
pbr
Read more
02 | Geometry and Primitives
7/10/26
Geometry is the building block of the 3D world. Master 5 basic primitives and you can combine almost any shape. 01 Learning Objectives This …
threejs
typescript
webgl
3d
geometry
Read more
01 | Building 3D Project Architecture from Scratch
7/7/26
Everything in Three.js starts with three objects: Scene (stage), Camera (lens), Renderer (projector). Master this trio and you have your …
threejs
typescript
webgl
3d
Read more
All Tags
Back to Home
Menu
Home
Posts
Tags
Series
About