Playground
A gallery of experimental prototypes and demos showcasing various visual effects and some general nonsense. Built with various web technologies, including WebGL, Canvas, CSS, SVG, WebGPU, and occasionally some ML magic. All demos are "works-in-progress", but you can experience them freely in their current state.
Displacement & Masking article
Glass refraction and masked offset effects that apply to any image or video, straight in the browser.
Two ways to give every image on a site a shared look without editing a single file: SVG displacement filters that bend content like textured glass, and masked offset copies that break it along a pattern. Live presets on real photos and video, with recipes for adding them to an existing site and an honest look at the trade-offs.
[REDACTED] experience
An SVG material study of office paper, printed ink, and dense reproduction-style redactions.
Dappled Light lab
Dappled light composited over DOM content using CSS gobos, a reconstructed shader, or a gobo-seeded shader hybrid.
Turntable tamagotchi experience
A pixel-art mascot that watches your every move. 75 Illustrator turntable frames with mouse tracking, and a little personality.
Magnetic Patterns experience
Using brand logos as interactive patterns can be both fun and functional! It can also be a bit demanding on the hardware.
Text on a Path article
When you need to be creative, add some text on a path.
Dithering about... article
Exploration of dithering techniques implemented as a post-processing effect in Three.js.
Exploration of various dithering techniques, including ordered dithering, error diffusion, white and blue noise dithering, implemented as a post-processing effect in Three.js. This article delves into the implementation details of each technique, showcasing their visual differences and performance characteristics.
Topographic Lines experience
Domain-warped fBM contour lines rendered in a GLSL fragment shader.
Three Senses experience
A multi-sensory beach ad experience: sight, sound and touch.
Depth Map Parallax lab
3D parallax effects using ML-generated depth maps.
3D Text Shadows article
Exploring various approaches for rendering faux 3D headings
Fisheye Distortion experience
SVG-based smooth fisheye displacement filter
Gradient Pills experience
Combining normal-based gradient rendering and 3D capsule geometries for smooth shapes.
3D capsule geometries where GLSL shaders enable non-linear gradients and animations that would be impossible in CSS by using surface normals rather than fixed directions.
las6.net
Back to the main site for work, writing and contact.
