Type: Academic
Tools: p5.js

Throughout middle an high school, my attention often drifted and I would find myself creating doodles in the margins of my notebooks. One of my favorite things to sketch were circular squiggly lines that repeated themselves growing further outward over and over and over again. It wasn’t until recently that I discovered that those doodles closely resemble topographic maps which are unique visualizers of geographic terrain.

For the project I wanted to create three dimensions from two, and add sound and color to create a multi dimensional audio-visual experience. I loaded 10 images of topographic maps and have the program randomly choose three images at a time when the canvas is clicked, to display with varying transparency values controlled by the lerp function. Then, based on the RGB value located at the current mouse position, a three-note chord is generated using p5js oscillators that correspond to a frequency on a scale comprised of the middle notes ABCDEF. The sound can be toggled on or off using a controller in the bottom right of the canvas. (link)