WebGL 2.0

The Long Silence is a browser-based procedural space-exploration game. It generates stars, planets, ring systems, nebulae, and derelicts from a seed rather than using downloadable art assets; the player pilots the Pale Seeker, charts systems, scans discoveries, lands on worlds, and attunes to Resonators across the game’s seven-system objective. It uses WebGL 2, handwritten GLSL, a floating origin, and a logarithmic depth buffer to represent systems spanning millions of world units while keeping the ship near the origin. Planets are baked into cubemaps containing albedo and terrain-height data, with runtime shaders sampling those textures for normals and lighting. Atmospheres use single-scattering raymarches, while GPU auto-exposure and a hand-built post-processing chain provide bloom, anamorphic streaks, god rays, lens ghosts, tone mapping, grain, dithering, and FXAA. The project is developed as a JavaScript package with npm scripts for local development and production builds; the latter produces a static bundle in the dist/ directory. Its renderer adjusts resolution dynamically between 0.62× and 2× to target frame rate rather than removing visual features.

WebGPU is identified in the video as a browser-based GPU technology used to run a background-removal model in the browser.

A framework-free WebGL2 package for rendering Apple-inspired translucent glass surfaces for folders, rectangles, pills, and circles. Its renderer models screen-space refraction using a squircle signed-distance-field thickness field, Snell refraction with a meniscus rim, variable-blur scattering, Fresnel reflection, chromatic dispersion, edge highlights, contact shadows, hit testing, and live backdrops. It provides the original frosted V1 renderer and a separate clear optical V2 renderer, each with its own material contract; both can be used together. The package is distributed through npm, requires WebGL2, accepts CSS-pixel element coordinates, and can load image backdrops.

Three.js is an open-source JavaScript 3D library developed in the mrdoob/three.js project for assembling and rendering procedural scenes in browser applications, including Fable 51 Worlds, Human Atlas, browser FPS worlds, CAD workspaces, and physics games. It creates scenes containing cameras, geometry, materials, meshes, and animations, with WebGL and WebGPU renderers and SVG and CSS3D renderers available as addons. Its official site and repository provide documentation, examples, tools, an editor, community resources, and a JavaScript module distribution.

Viscose is a portfolio carousel rendered as a single full-screen WebGL fragment shader rather than a grid of DOM elements. Project cards travel around a mostly off-screen ring that can be turned by scrolling, dragging, swiping, or clicking; momentum carries the ring and it snaps the nearest card to the front. Signed distance fields make neighboring cards melt together as they approach and form thin, sagging threads as they separate, while pointer interaction softens the field, shifts nearby cards, and creates connecting effects. The same shader pass renders the threads, the refracting glass-like edges at the top and bottom of the viewport, and the cursor tag. On touch devices, swiping turns the ring and press-and-hold triggers the hover effects. The project includes a development-only lil-gui panel with roughly 136 live parameters and is built with Next.js, React, Three.js, GSAP, and Tailwind CSS; it requires Node.js 20 or newer to run locally.