Shaders the Way Photoshop Treats Pixels

Disclaimer: I am an actuary. ASA not yet achieved; all requirements are met and the designation is expected in June or July depending on application timing. The thoughts and analyses here are my own explorations, not professional advice. Draw your own conclusions.

Most "creative coding" tools want you to read a book before you ship a frame. You learn a domain-specific language, you set up a build, you fight a context. Three days later you have a pretty cube and you still haven't made the thing you actually wanted.

basement.studio shipped something different. They call it Shader Lab, and the trick is that it treats shaders the way Photoshop treats pixels: stack them, blend them, animate them, export them. You don't write GLSL. You drag a CRT layer on top of a Dithering layer on top of a Text layer, drop in a Gradient, and pull a slider until the vibe is right. It's at eng.basement.studio/tools/shader-lab and the source is Apache-2.0 on GitHub.

What you actually get

Layers, like in Figma, but each layer is a shader effect. CRT, dithering, halftones, gradients, text, patterns — five or six dropped into a stack and you have a credible "old terminal display" or "dystopian magazine cover" in about a minute.

The properties panel is the part that earns its keep. Every layer exposes the dials you'd actually want — opacity, blend mode, hue, saturation — plus the ones specific to that effect. The CRT layer ships with Slot-Mask Monitor, scanline intensity, mask scale, barrel distortion, convergence, vignette, beam focus, brightness, highlight drive. That's not a shader; that's a small piece of analog hardware exposed as sliders.

There's a timeline at the bottom. Auto-key is on by default, so you tweak a slider with the playhead at 4 seconds and you've made a keyframe without thinking about it. Eight-second loops out of the box. Export when you're done.

That's the whole tool. There is no project file format to learn, no plugin architecture, no asset pipeline. You drop layers, you turn knobs, you export.

Why this matters for the kind of writing I do

A blog like this one wants visual identity without runtime cost. I'm not going to ship a WebGL canvas to every reader on every page just so the title can have a scanline. That's an irresponsible budget for a vibe.

But a four-second WebM loop, exported once, baked into the page as a background — that's free at runtime. It's a static asset. The browser doesn't care that the source was a shader; it sees an MP4. The visual budget at runtime is the same as a JPEG.

That's the move Shader Lab unlocks. Author once, in the browser, with sliders. Export to video. Drop it in. The expensive part of the pipeline runs on my laptop while I'm composing, not on the reader's phone while they're trying to read.

What I'd build with it

Three things, in order of effort to payoff.

Header loops for the blog. A subtle dithered monochrome loop behind post titles. Not the whole hero — just enough motion that the page feels alive without becoming a music video. Strict black-and-white keeps it consistent with the whitepaper aesthetic the longer essays already use.

Boot animations for internal tools. I run a personal command center on the home network. A four-second CRT-warmup loop on first load gives it the texture of a thing rather than the blandness of a dashboard. Cheap to make, durable as a static asset.

One-off social cards. When a post goes out, the OpenGraph image is the only ad it ever gets. Authoring those in something that exposes scanline intensity as a slider is genuinely faster than fighting Figma's blend modes.

The common thread: I'd never ship the live shader runtime, but I'd absolutely ship its output.

The general principle

Most tools ask you to learn them before they let you produce. The best ones invert that — they let you produce on day one and earn your investment in their depth gradually, by making the next thing you want easier than the last. Photoshop did this. Excel did this. Figma did this.

Shader Lab is in that lineage for shader effects. It does not ask you to learn a thing. It asks you to drag a layer.

That's a low ask, and the output punches above it.

Try it

eng.basement.studio/tools/shader-lab — runs in the browser, no signup, free.

If the output is interesting, the source is at github.com/basementstudio/shader-lab under Apache-2.0, so you can fork it and run a private instance if you live in a terminal-first environment like I do.