Harmonics Waveform Generator published: 8th April 2025
Intro
Carefully listen to the sounds around you. The sound of a moving car, someone speaking in the distance, rustling of the tree leaves, birds chirping, all of these sounds that you hear can be recreated mathematically using a sine wave. Well not one sine wave but a combination of sine waves but that's for later in the article. Hmmm ok but what is a sine wave? A sine wave represents a motion, a motion that moves from a highest point, down through a middle point, to a lowest point and then back up again. Imagine this, you are on giant ferries wheel which takes 8 minutes to complete a rotation. It will look like the motion in figure A.
Figure A: Ferries wheel front view
Figure B: Ferries wheel side view
But let's say instead of looking at the wheel from the front we look at it from the side. Then what you will see as visualised in figure B is a line and the position of the rectangle move up and down the line. The 2 dimensional motion (vertical and horizontal) from the front view is converted to a one dimensional motion (vertical) on the side view. So if we start at time 0 in 2 minutes we reach the top of the wheel, in 4 minutes you're half way around, in 6 minutes you're at the bottom of the wheel and on the 8th minute you come back to where you started completing the full motion. Let's plot the position versus the time on a graph. The curve that you see is a sine wave. It represents a continuous periodic motion. The movement of the rectangle is up and down but when you plot this vertical movement on a time axis that's where the time axis gets its shape. A sine wave oscillates back and froth from the start position to a maximum amount in the either direction which is called its amplitude.
Another key concept thing to note here is if you a smaller ferries wheel but it still takes the same amount of time as the bigger wheel and we compare their sine wave with time only their amplitude changes i.e. the smaller wheel has lower amplitude than the bigger one and the wave only gets stretched in the vertical direction the as shown below.
Figure C: Large and small ferries wheel motion
Secondly, if you have 2 same size wheels but one takes longer to complete a full rotation the sine oscillation gets faster and you'll see that the sine wave only stretches in the horizontal direction i.e. the time axis as shown below.
Figure D: Slow and fast ferries wheel motion
And lastly, there is another way to plot this sine wave motion by plotting it against the position versus the angle of the motion from the start position instead of time. This angle is called phase which is measured in degrees. To conclude, the oscillation of the sine wave repeat over and over as the time goes on. It's essentially a smooth, repeating up and down motion. It is one of the most fundamental and elegant pattern in nature and mathematics.
Figure E: Phase of the ferries wheel motion
Etymology
An interesting tidbit about the etymology of the word sine: it can be traced back to Sanskrit mathematic word jīvā or jyā. The arc of a circle is like a bow and so is called a dhanu or chāpa which in Sanskrit means "a bow". The straight line joining the arc of a circle is like the string of a bow and this line is the chord of the circle. This chord is called a jyā which in Sanskrit means "a bow string". This word in turn is a translation of the Greek khordē “gut string” (which was borrowed into Latin as chorda and is the source of the word chord in English). The Indians borrowed Greek trigonometry and translated khordē literally as jyā, but they used this word not for a chord but for a half-chord. Indian astronomers and mathematicians realised that computations would be more convenient if one used the halves of the chords instead of the full chords and these half-chords were called ardha-jyā or jyā-ardha. Aryabhata frequently abbreviated this term to jyā or its synonym jiva. The Arabic astronomers inherited this Greek and Indian systems of astronomy and the Sanskrit word jyā was transcribed as jīb but Arabic is written without vowels and that the word in question is spelt jb. In the twelfth century the Arabic-Latin translator Gerard of Cremona from Italy misread the letter as jyab meaning "breast pocket" and used the Latin equivalent word sinus. So the word sine is a Greek word first translated into Sanskrit, then transcribed into Arabic, and then mistranslated into Latin.
Why sine wave?
Ok so we've seen what a sine wave is but why do we need a sine wave to recreate a sound? Well to answer that let's understand what sound is? Sound is a perceived phenomenon resulting from vibrations in our surroundings. For any object to make sound it has to vibrate/oscillate which will produce a disturbance in the air and then that disturbance (air pressure changes) has to reach our ears for us to perceive the sound of that object. When objects vibrate naturally the resulting air pressure variations follow sinusoidal patterns due to the laws of the physics which govern the vibration/oscillation. Sine waves is what nature uses to create sounds. An 18th century French mathematician Jean-Baptiste Joseph Fourier proved mathematically that any periodic waveform can be represented as a sum of sine waves. Sine waves are the fundamental components that make all sounds. The mathematical elegance of sine waves as periodic motion helps us to create any existing or new sounds. Not just sounds sine waves show up different instances like: the pendulum motion, alternating current, radio waves, etc.
How do I create sounds from a sine wave?
You can't create sounds from just a single sine wave. If you play
the demo below with just one harmonic you'll hear the pure tone of
440Hz. A sine wave oscillating at 440Hz produces a pure tone which
doesn't have a lot of properties. In nature a pure sine does not
exist, it actually has harmonics. You'll never hear a pure sine tone
of a particular frequency in nature. What differentiates a sine tone
from a natural sound is harmonics. Harmonics are the additional
frequencies present in natural sounds. Each sine wave corresponds to
exactly one frequency which is just one component of the natural
sound. By combining different sine waves of different frequencies we
can recreate all naturally occurring sounds.
Let's take a vibrating string on a guitar as an example. If the
guitar string when plucked os vibrating at 440Hz which is called the
fundamental frequency, it is not just vibrating at 440Hz but also at
880Hz, 1200Hz, 1600Hz, 2000Hz, 2400Hz and so on and so forth till
infinity. But what happens is the energy at the higher frequencies
is less than the fundamental frequency. The energy at higher
frequencies follows the formula: 1/n2 where n is the
fundamental frequency which means the second harmonic 880Hz has 1/4
the energy of the fundamental, 1200Hz has 1/9 the energy of the
fundamental and so on and so forth. You hear the fundamental
frequency the loudest and the higher harmonics add additional timbre
to the fundamental frequency which gives each sound its unique
fingerprint. The reason you can distinguish between a trumpet and a
flute playing the same note is because both instruments have a
different distribution of energy on the higher harmonics. Harmonics
follow a simple integer relation to the fundamental which makes them
pleasing to our ears. But you also find harmonics that are not in
this simple relation with the fundamental and such frequencies are
called inharmonic frequencies. There is another term used for higher
harmonics in the sound called as overtones. Any higher frequency in
the sound other than fundamental is called an overtone but only the
frequencies that are in the simple integer relation to the
fundamental are called harmonics.
All harmonics are overtones but not all overtones are
harmonic.
The 3 fundamental sound waves that we use to synthesis sounds is
triangle, sawtooth, and square waves. These waves can also be
created using a bunch of sine waves and carefully maintaining the
energy in each harmonic. Let's see how you can create these
individual waves from just sine waves.
Sawtooth wave
- Start with a fundamental sine wave frequency at your desired frequency: f.
- Add harmonics at integer multiples of that frequency eg. 2f, 3f, 4f,...
- Set each harmonic's amplitude to be inversely proportional to its number.
- 1st harmonic (fundamental) amplitude = 1
- 2nd harmonic amplitude = 1/2
- 3rd harmonic amplitude = 1/3
- 4th harmonic amplitude = 1/4
- and so on...
Triangle wave
- Start with a fundamental sine wave frequency at your desired frequency: f.
- Add only odd numbered harmonics e.g 3f, 5f, 7f, etc.
- Alternate the phase (positive and negative) for each successive harmonic.
- Set each harmonic's amplitude to be inversely proportional to the square of its number.
- 1st harmonic (fundamental) amplitude = 1
- 3rd harmonic amplitude = -1/9
- 5th harmonic amplitude = 1/25
- 7th harmonic amplitude = -1/49
- and so on...
Triangle waves contain only odd harmonics with rapidly decreasing amplitudes. This gives them a softer, more mellow sound compared to sawtooth waves. The alternating phases (+ and -) are crucial for creating the symmetrical triangular shape.
Square wave
- Start with a fundamental sine wave frequency at your desired frequency: f.
- Add only odd numbered harmonics e.g 3f, 5f, 7f, etc.
- All harmonics are in phase with the fundamental
- Set each harmonic's amplitude to be inversely proportional to the square of its number.
- 1st harmonic (fundamental) amplitude = 1
- 3rd harmonic amplitude = -1/9
- 5th harmonic amplitude = 1/25
- 7th harmonic amplitude = -1/49
- and so on...
Square waves contain only odd harmonics with amplitudes that decrease more slowly than triangle waves. This gives them their characteristic bright, hollow sound with strong higher harmonics. The absence of even harmonics creates the symmetrical positive/negative pattern of the square wave.
Fundamental Frequency: 440Hz
Harmonics
Important: ok so after playing with the triangle, sawtooth and square
waves you'll find that they they do not sound like those waves and
sound more like a sine tone. Well for now all I have is 10 harmonics
which is not enough to make it sound like for example a triangle wave
even though the waveform might look like one. To correctly model the
sonic properties of these waves we need to have at least 20-30
harmonics minimum. Adding individual harmonics to create new sounds is
called additive synthesis so maybe I could actually work on making a
synthesiser which does that but making a synthesiser as a web app with
JS? No Sir! Maybe WASM and JS will make up for interesting project.
Anyway just play around with the sliders for now.