Hello Everyone,
I struggled to understand the FFT aka fast fourier transform visually. Like i read so many articles, watched videos but nothing clicked for me because im more of a visual thinker - i need to see things moving and changing to actually get whats happening under the hood.
So i just sat down and used claude to help me frame my thoughts into code and made this streamlit webapp. basically the idea is - any image can be broken down into bunch of sinusoidal waves right? and the fft tells us which frequencies matter. so i wanted to actually SEE that happening.
the app has like 6 pages:
- wave synthesis where you add sine waves one by one and watch them combine into patterns
- frequency window thing where you put a circular window at center of spectrum and see how the image goes from blurry to sharp as you expand it
- phase vs magnitude swap (this one blew my mind honestly, phase carries all the structure not magnitude)
- spatial convolution with actual kernels like blur sharpen edge detect etc
- bandpass filtering with the mask shown on the spectrum so you can see what frequencies youre keeping
- and a how it works page explaining everything
one thing i learnt while building this - you cant really generate new meaningful images by randomly tweaking frequencies. the combination that makes a face vs random noise is insanely specific. that only made sense when i could play with the sliders myself.
anyway would love to hear what you guys think. what else would make fft click visually?
