Sound Wave Maths in Processing

Simon has created animations visualizing sound waves (Triangle, Sawtooth, Square and Sine waves) in Processing (Java), using wave functions.

These are the functions he used for the Sawtooth, Square and Sine waves:



Not to confuse “sine” with “sgn” (sgn standing for sign):


He was inspired by the logarithmic and power functions that he was studying during his math class yesterday. Simon was trying to draw both types of functions in Grapher on his laptop, but only succeeded for the power functions (because there were no subscript option for the logarithms).

Sound Visialization

Simon has followed another batch of wonderfully enriching tutorials by Daniel Shiffman on p5.js, this time all about sound, and made these sound visualisations. The first one is based on the Amplitude Analysis tutorial (the amplitude of a song (any sound input) is being analyzed to control elements of a p5.js sketch):


The next project comes from the Microphone Input tutorial:


Graphing Amplitude tutorial (using the getLevel() function from the p5.js Sound Library to graph the amplitude over time):


And the Frequency Analysis tutorial, analyzing the frequencies (spectrum array) of a sound file. Simon created a “graphic equalizer” like visualization. For this project he used the p5.FFT object from the p5.js library. FFT (Fast Fourier Transform) is an analysis algorithm that isolates individual audio frequencies within a waveform.

Sound Synthesis in JavaScript

Familiar synth noises at our home again! This time synthesized in JavaScript. Simon has been following Daniel Shiffman’s Sound Tutorials and studied the codes to create oscillators and ADSR Envelope. ADSR stands for Attack, Decay, Sustain, Release.

Here Simon is working on sound synthesis code offered in the tutorial:


He drew an ADSR Envelope graph and explained it:


Here I filmed Simon from behind, without him really being aware of it. This is to show the usual way he studies – by talking to himself:

Some more synth tricks he learned to apply to the original code:

The code to create a slider that functions as an oscillator:

Simon made this graph in Word:


The shapes of soundwaves

This afternoon Simon gave me an introductory lesson to soundwave shapes: triangular, saw tooth, ramp, pulse 0 to 100% duty cycle. It turned out he can imitate all of them easily, and that is next to his perfect pitch. Recently at a construction site he heard a truck buzzing and screamed: “F sharp in the highest octave!!” Well, now he can also say which wave shape that was.