An insanely interactive live-input spectrogram with sound creation built in.
Click here to view the live demo.
This project uses your microphone data to plot frequency over time in a moving window graph (The colors indicate the weight of that frequency at that time). You can use the scale controls button to change the y-axis (frequency) of the graph. Besides the graph, the menu allow you to turn the sound on as well as a bevy of new controls (more coming soon...) . Here are the sound making controls:
Once the sound is "On", you can draw on the spectrogram graph using your mouse or touch input to create a sine wave at the frequency specified. You can change volume/amplitude of the sine wave by sweeping left and right. Other controls include timbre choices, a scale mode to snap your notes to a scale, and various effects. There's also a tuning mode packed in to make it easier to tune instruments.
Square:
Sawtooth:
Triangle:
Tuning Mode Example (also showing changing the graph limits):
To install, simply clone and install using npm install. You'll need Node.js. Once installed, to test out the development version, use npm run start.
The format is based on Keep a Changelog and this project adheres to Semantic Versioning.
First Release!
- Everything! Spectrogram, Menu, Controls, etc...
- None
We welcome contributors.
- Matthew Rice - Web Developer
- Victor Minces - Postdoctoral Researcher at UC San Diego
This project is inspired from a Spectrogram by Boris Smus You can read more about his spectrogram here
MIDI Icon by Jonathan Higley from the Noun Project