
Fourier Visualizations - csh_projects
http://bgrawi.com/Fourier-Visualizations
======
kbenson
In college, I took a CS elective that was shared with the electrical
engineering major. It was taught by a PHD student, and was 90 minutes twice a
week. I believe it was something along the lines of wireless technology.

The first day, the teacher walked in, wrote an equation (FFT) on the board,
and spent the next 90 minutes manipulating it into different forms (from his
in-hand notes), with no explanation of what or why we were doing so.
Occasionally he would stop, say something along the lines of "and you can
convert what we have here to this..." and write another equation on the board,
and continue "which is one of your homework problems for next time."

The next class was identical. When the third class started the same way, I
walked out 40 minutes into it and dropped it. I had _zero_ incentive to
continue, the teacher hadn't explained _at all_ what the purpose of what we
were doing yet. It had literally been us writing down his math notes for three
straight hours while he explained _how_ the mathematical manipulations worked,
but not _why_ it mattered or how it was _relevant_.

I've vacillated over the years between being upset with myself for abandoning
that class, and not "getting" fourier related things, and being mad at the
teacher at _being so horrible_ at teaching, at least for the portion I was
there for.

This is simple. This is obvious. Something like this would have gone a long
way towards explaining _what the fuck I was doing_. I'm no longer upset at
myself. I am _doubly_ upset at that teacher now.

~~~
catchmrbharath
> I am doubly upset at that teacher now.

You shouldn't be. Wireless Technology is an advanced class for Electrical
Engineering majors. Electrical Engineering majors would have gone through a
class of Linear systems, where they would have learnt the intuition behind
Fourier transforms as shown in OP's demo. I think the teacher might have done
you a disservice by not mentioning the prerequisites, but thats the only thing
you can be upset about.

~~~
kbenson
> I think the teacher might have done you a disservice by not mentioning the
> prerequisites, but thats the only thing you can be upset about.

It was offered as a double elective for CS and CEE, which meant it was
supposed to be accessible to both majors (if admittedly harder for CS majors).
I can accept the class being hard, I can't accept the first three hours of
class time being spent copying notes of his math notes as he copied them out
of his binder onto the board, with a total of class discussion being less than
10 minutes in total for those two class periods. There wasn't even and
explanation of what our goal in this was, just "Here's an equation. It's
useful. Now we are going to derive some other useful forms of it."

Never before or since have I ever been in a class where the teacher walks in,
introduces himself, says what we'll be covering (FFT), turns to the board and
starts copying his _math_ notes onto the board, and doesn't stop until the
class is over, keeping in mind, it wasn't how to solve an equation, it was how
to transform a given equation into another given form with no explanation as
to why. Things have come close in some of the more dry history classes I've
had, but even then you generally get some additional context from the teacher
expanding on the notes presented.

~~~
eru
Have you tried speaking up about it? Teachers don't have magic powers of mind
reading.

~~~
kbenson
Well, it was close to 15 years ago now, so read "I'm doubly mad" as "when
something makes me remember it, I feel sense of loss, both for what I could
have learned if the situation was different, and how I've felt about it and
myself over the years regarding it."

I'm mad about it, but in the weird way multiple years can change that into
into something that's not quite the same as the word usually implies.

------
bbtn
I don't know if this kind of visualizing Fourier transform is helpful to
anyone doing/will do work using this idea, but it is not useful to me, and I
don't think it is useful to anyone, apart from being somewhat interesting
representation, in a way an illusion.

Here is how I see this:

-Sinus (and cosinus etc) is defined using a right triangle, unit length hypotenuse simplifies things, so they are shown on a right triangle inside a unit circle.

-Time dependent sinus function, sin(wt), can be represented using a uniform circular motion and y coordinate of position.

-Fourier says that you can represent (may be almost all) functions using sinus functions with proper frequencies and amplitudes. There is a way to find those coefficients using some mathematics: infinite or finite sums or integrals depending on application.

-Oh well, I have a wonderful idea, great analogy, listen: why not show Fourier transform/series using a circle on circle on circles, uniformly moving (constant speeds) particles and projections of their position to sideways as a function of time.

I don't think understanding its mathematical form is more complicated than
understanding what a function is. It is already very simple, too much enforced
simplification makes it complicated.

~~~
diger44
Hi, creator here,

I appreciate your feedback, my eventual goal of this site is to expand to
concepts like directly using FFTs with arbitrary waves where your suggestion
might be constructive, as yes circles on circles does make it seem more
complicated than it is. One of the goals of this specific visualization was to
demonstrate how fourier series relate to oscillators and sound, in which case
a circle representing a frequency or set of tones added together made more
sense.

For reference, I did not personally come up with this particular style of
representing Fourier Series, I based it on this:
[https://commons.wikimedia.org/wiki/File:Fourier_series_squar...](https://commons.wikimedia.org/wiki/File:Fourier_series_square_wave_circles_animation.gif#/media/File:Fourier_series_square_wave_circles_animation.gif)
which is used on the main Wikipedia page about Fourier Series themselves.

------
eru
Incidentally, this also shows why adding epicycles to your solar system model
works.

~~~
qubex
I keep mentioning that the apparently surprising fact that geocentric models
of the solar system allowed successful prediction of celestial events is due
to the (accidental) approximation afforded by low-degree Fourier
transformations, up to and including excessively-awed mumbling about what the
Antikythera Mechanism implies about ancient greeks' knowledge of heliocentrism
and gravitation.

~~~
bonoboTP
Aside from approximating the elliptical orbits as circular, there is no
further approximation in the epicycle geocentric model. It really is like
that, it's not some low-degree approximation. Again, aside from the
circularity instead of the ellipses.

~~~
qubex
You are correct. Thanks for pointing that out.

------
dolguldur
Question: I came across some super-nice interactive textbook-style website
which gently introduced the Fourier transform with many intuitive and
interactive graphics. It was top-notch modern, with dynamic SVGs and looked
excellent. This was about 6 months ago and I can't find the page anymore and I
forgot to bookmark it. If this rings a bell, please share the link! Thanks!

~~~
alisey
[https://jackschaedler.github.io/circles-sines-
signals/](https://jackschaedler.github.io/circles-sines-signals/)

~~~
dolguldur
Awesome, that's exactly what I was looking for. Thanks!

------
diger44
Hi, I am the creator of this visualization. I didn't know that it was posted
last night, but I can answer any questions you have now. I've added a
"Tips/things to try" modal to it. I don't know how many of you tried the audio
portion of the visualization, but it's a cool and more unique part of the
demo!

The github link is here: [https://github.com/bgrawi/Fourier-
Visualizations](https://github.com/bgrawi/Fourier-Visualizations)

------
Salgat
This one simple visualization would have saved weeks of trying to gain an
intuitive understanding in class...

~~~
eru
Another thing I needed to understand Fourier-transforms: for any a, b, c and
d:

f(x) := a * sin(b + x) + c * sin(d + x)

there are some constants m, n so that:

f(x) == m * sin (n + x)

It's easy to prove --- but it allowed me to see why one coefficient plus phase
was enough for each frequency.

------
FraKtus
Does not work on Safari 9.0.2 for me but nicely in Chrome...

------
tempodox
Does it do anything? Not in Safari.

~~~
diger44
Creator here, sorry about that! It's because Safari does not fully support
WebAudio yet, and I can't really test it to see what's causing the issue. Use
chrome for now to see the whole thing work.

------
phyllostachys
I see some people here mentioning Fourier Transforms. I'm under the impression
that this only really visualizes Fourier series approximation and has nothing
to do with Fourier Transforms, right?

