We’ll be honest: If you are a regular Hackaday reader, you probably won’t learn much new information about waveforms from this website. However, the presentation is a great example of using React on a webpage and — who knows — you might just pick up something interesting. At the very least, it’ll be a great resource the next time you try to help someone starting out.

The animated waveform is cool enough. It is also interesting that it changes based on where you are in the text. The really interesting part though is that you can press the M key to unmute your audio and hear what the wave sounds like. You can also use adjustments to control the frequency and amplitude of the wave.

The topics center around audio, although they have some applicability to higher frequencies, too. There’s talk about amplitude, frequency, and phase. There are examples of sine waves, square waves, and more. There is also a really good example of how adding a series of sine waves can create a square wave via harmonics.

If you want more details about synthesis, by the way, we covered it earlier. In fact, we’ve talked about it a few times.

13 thoughts on “Learn About Waveforms Interactively”

1. Al says:

That is one slick page.

2. Ostracus says:

“However, the presentation is a great example of using React on a webpage and — who knows — you might just pick up something interesting. ”

3. John says:

Another example where someone thinks it appropriate to misinform people that complex waves are made from Sine waves. It really is time that was stopped and the truth was taught.

1. Dan says:

Please educate us. What is a better resource for learning the basics of waveforms that isn’t paid off by the sine wave industrial complex?

2. snarkysparky says:

Well it is accepted that “most” complex waves can be represented as sums of sine waves. The two representations are mathematically identical. And it is extremely useful to think of complex waves as sums of sin waves as this is how to select filters to change the original wave.

1. John says:

“can be represented as” and “is”

Spot the difference. It is important in engineering and science to be correct when stating facts. “is” is incorrect.

2. salec says:

As sums of infinite series of sine waves and cosine waves. That’s usually not how complex waveforms are created, but that’s how they will reveal themselves to our instruments as soon as they encounter real world environment stripping their high frequency components off. Sum of sines and cosines is useful paradigm to explain e.g. how we get overshoots at the top of the attack edge of a pulse. Incidentally, it is not very helpful to introduce this nature of repeating patterns before it is necessary to explain such seemingly weird behavior of “square” signals.

3. Drone says:

@snarkysparky says:

“Well it is accepted that “most” complex waves can be represented as sums of sine waves.”

Hmmm… “most” or “ALL” – except for the Ideal Impulse (Dirac Delta) Function and the Ideal Step (Heaviside) Function?

Actually the Dirac and Heaviside functions ARE in a strict Mathematical sense also reproducible by a sum of sinusoids – TIME INDEPENDENT. But this does not translate practically in the applied Newtonian domain. But I’m not sure about the Quatum domain, especially in terms of information theory.

I’ve gotta stop drinking now ;-)

3. salec says:

I am not a native English speaker, but I believe that phrase “made of” doesn’t imply construction or generation method, it can also refer to a breakdown or content. Although there are cases where both meanings apply, especially in descriptions of man-made contraptions, in this case it should be clear that complex periodic functions (and signals) are not necessarily artificial. It seems that you protest against alleged or implied claim that complex waveforms are produced by somehow taking a set of preexisting pure sines and adding them together, while the author just tries to convey idea of frequency domain, in a simplified language.

4. Tomo says:

That’s really nice! Useful in ways rarely found on the interwebs.

5. Drone says:

“You need to enable JavaScript to run this app.”

Of-course any sane person disables scripting in the browser by default. I wish HaD would provide a warning when posting such links.

Also, the base URL mentioned in this post has a .sh extension. This is a Penetration Attractor – so Beware (or maybe the site is a Honeypot?)

1. joem says:

I’d argue that any sane person who reads about an interactive site would expect it to be Javascript-based, so there’s no reason to provide such a warning.

Also, nothing in wikipedia’s article about the .sh TLD mentions a “penetration attractor” or actually anything about it being dangerous. So what are you talking about?

6. Tom Nardi says:

I had a lot more fun fiddling around with this than I care to admit. Very cool stuff.

Please be kind and respectful to help make the comments section excellent. (Comment Policy)

This site uses Akismet to reduce spam. Learn how your comment data is processed.