HomeEngineering & MaterialsConvolution: Filters, Signals and Sliding Windows

🎛️ Convolution: Filters, Signals and Sliding Windows

Interactive 3D signal and kernel visualization where choosing a filter kernel slides it across an input signal, generating the convolved output sample by sample.

Engineering & Materials3DModerate60 FPS
convolution-filters-lab ↗ Open standalone

A kernel slides across a 3D input signal, computing a weighted sum at every position to build a filtered output signal one sample at a time.

🔬 What It Demonstrates

Discrete convolution: the output at each step is the dot product of a small kernel with the samples it currently overlaps, and swapping the kernel's weights changes the filter's behaviour entirely.

🎮 How to Use

Pick a kernel and an input signal, then watch the highlighted window slide across the back row while the front row fills in with the convolved result. Adjust slide speed or pause to inspect any step.

💡 Did You Know?

This same sliding dot-product, extended to 2D pixel grids, is the fundamental operation inside every convolutional neural network used for image recognition.

⚙ Under the hood

Interactive 3D signal and kernel visualization where choosing a filter kernel slides it across an input signal, generating the convolved output sample by sample.

convolutionsignal-processingfiltersdspkernelsengineering

3D · Three.js / WebGL renderer · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)