> Recording learning, sharing technology, exploring computer graphics and web art effects
Implicit and explicit geometry representations, algebraic surfaces, CSG, distance functions, Bezier curves and B-splines, Bezier surfaces, mesh subdivision (Loop/Catmull-Clark), mesh simplification (quadric error metrics), mesh regularization, shadow mapping
Deep dive into the HTML-in-Canvas proposal by the Chrome team — letting Canvas natively render real, interactive, accessible HTML content. From basic usage to WebGL 3D textures, from pitfalls to cross-browser polyfill strategies — bridging DOM and pixel worlds in one article.
Noise function principles (Perlin gradient noise, Simplex simplex noise, FBM fractal Brownian motion), cloud/terrain/fire/vertex deformation practical examples, noise animation, frequency & amplitude, five homework cases
Z-buffer depth test, Blinn-Phong reflectance model, shading frequencies, graphics pipeline and shaders, texture mapping, barycentric coordinates, bilinear interpolation, Mipmap and trilinear interpolation, environment mapping, normal mapping, shadow mapping
Built-in GLSL math functions (mix/step/smoothstep/sin/cos/pow), vector operations (dot/cross/normalize), drawing basic shapes with math, fract/mod periodic functions, coordinate transforms and UV mapping
fovY wrap-up, viewport transformation, raster display devices, triangle sampling and anti-aliasing, MSAA/FXAA/TAA/DLSS
Vertex/Fragment shader execution flow, gl_Position / gl_FragColor, attribute / uniform / varying channels, ShaderMaterial vs RawShaderMaterial, GLSL strong typing and built-in functions
2D affine transforms, homogeneous coordinates, composing transforms, 3D transforms, Euler angles, MVP transform, view and projection transforms
Cloning two core interactions from the moeru.ai landing page: dot grid physics repulsion + 3D tag Verlet rope simulation. From theory to implementation, a line-by-line breakdown of the key CSS/JS code.
requestAnimationFrame vs GSAP, gsap.to/from/timeline, KeyframeTrack, AnimationObjectGroup, AnimationMixer model animation