Hacker News new | past | comments | ask | show | jobs | submit login
Fourier Visualizations (bgrawi.com)
166 points by csh_projects on Feb 1, 2016 | hide | past | favorite | 29 comments



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.


To be honest, this kind of multiphasor animation is cute, but not very useful (or insightful, in my opinion).

One set of two small phasors (one rotating CW relative to the main phasor, and one rotating CCW to the main phasor) is useful for thinking about amplitude and phase modulation. But I find it hard to believe that having four phasors stacked on top of each other strengthens anyone's intuition about Fourier transforms.


> 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.


> 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.


That's very sad - I'm sorry that happened to you.

It makes me curious about one point. It sounds as if the class you took covered what my engineering program called "Communication Theory". We were expected to have two terms of differential equations and one each of linear algebra and statistics under our belts as prerequisites. (I think. This was a long time ago...)

Were you missing, at least, having at strong basis in differential equations? If you didn't, that would have made the class double-tough.


I had plenty of differential equations, but I never took linear algebra. I'm fairly certain it was introduced in one of the semesters of calculus, but IIRC there was a separate linear equations class offered. I never took statistics, but it always seemed like it was one of the more practical and useful math classes.

To be clear, my problem wasn't that there was a lot of math. My problem was that there was no context, and what we were copying off the board could easily have been copied from a book or pamphlet. I'm not sure what the practical reason is to spend multiple classes deriving one version of the FFT from another with zero context.


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


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.


In my case, I had few lecturers, who went completely bonkers, when they read anonymous questionaires, with the fact, that lectures were some blank copy paste of lecturer's notes -> blackboard -> students' notebooks. They could not admit that. I believe next year those lecturers were changed, though damage to our and older generations were done (badly delivered studies).


The way a teacher introduces the topic is extremely important. Shitty teachers perpetuate the myth that math is so hard. It's hard if the teacher either doesn't actually know what it is about, or has forgotten what it was like to be new to the topic.

I had similar classes in robotics (the lower-level kind: control theory, path planning, joint configurations, robot dynamics, inverse kinematics, stability), where we often had zero idea what was going on. The professor showed some slides dense with walls of text and badly typeset large equations, where we couldn't even keep track of what letter stood for what, the abstraction levels were mixed like spaghetti - sometimes talking about exact voltages, about mathematical tricks and shortcuts - but things weren't glued together with an overarching motivation.

So we learned stuff like Lyapunov-stability, the K-step ahead prediction, etc. but basically nobody had a clue what we were actually doing. And there was lots and lots of in-detail stuff.

This was in Hungary by the way. When I spent a semester in Germany and had a robotics course (slightly different focus), I thought it was so easy. There was a lot less material and we progressed much slower, but people actually followed what was happening. When you came out of a lecture, you could summarize in a few sentences what you've been doing. In my home university robotics class, we had no idea: we just saw a bunch of slides of incomprehensible math with no time to digest it.

When I see MIT lectures online, it also seems very "easy", in the sense that all the intuitions and motivations are laid out for you. I think this also has disadvantages. I can remember having many Heureka moments when disentangling the mess and finally putting puzzle pieces together, when learning from not so high-quality materials. I was proud about a lot of these "connections that I discovered", only to learn that some universities start with these high-level overviews and they don't count as exciting insight at elite universities, it's just part of the "boring, dry curriculum" as seen by students there.


I have the exact same storry here. It was apparently evident to him, it's only years later when I wondered how MP3 compression worked that I connected WTF I learned at uni.

Never assume something is evident for everyone else.


Along the same lines, I thought this article is really good at building some intuition about the Fourier transform:

http://betterexplained.com/articles/an-interactive-guide-to-...


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.


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... which is used on the main Wikipedia page about Fourier Series themselves.


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


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.


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.


You are correct. Thanks for pointing that out.


How would one go about calculating the Fourier series for an elliptical trajectory?


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!



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


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


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


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.


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


Does it do anything? Not in Safari.


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.


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?




Join us for AI Startup School this June 16-17 in San Francisco!

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: