Building in Public

While level-ing up in my guitar practice, I’ve frequently returned to a book called The Advancing Guitarist, by the esteemed (if not well-known) jazz guitarist Mick Goodrick. In it, he (lightly) prescribes a few exercises for learning scales by playing them vertically (up-and-down) a single string, as opposed to horizontally (eg. CAGED, pentatonic forms), the way most guitarists initially learn to do. In his book (p. 12), he recommends the guitarist write down every combination of an individual string and modal scale on a piece of paper, cut the paper into strips and randomly select the combinations from a hat to spur your practice. But I’m so lazy, I couldn’t be bothered with writing things down on paper, let alone searching for scissors, so instead I built a website to do it for me. I’m excited to announce the release of a new application/website I’ve been working on over the past couple months: https://unostring.com.

The basic premise of this app/website is to randomly generate combinations of a single guitar string from the set E-A-D-G-B-E, and a single modal scale (eg. Ionian, Dorian, Mixolydian). As a bonus, I wanted it to also provide some backing tracks, either a drone corresponding to particular mode, or an actual musical vamp (jazz, rock, etc).

I built UNOString using JavaScript, GatsbyJS, and regular ol’ CSS. On top of this, I embedded some organ drone MP3 samples to accompany the practice of each modal scale. I initially tried using the Web Audio API to create synth sounds programmatically, but this proved to be too difficult for the initial release. Digital audio is a deep subject, and I might have underestimated how hard it would be to use out of the box as a beginner. I had no problem creating some basic synth sounds using a couple OscillatorNode‘s but ran into problems trying to reduce the initial volume. Ultimately, I fell back to just recording some MIDI organ samples in Logic Pro X, and then exported WAV files from the DAW, which worked fine for this initial release.

There’s a lot of things I’d like to improve about the site. The user experience is a bit clunky, and the style/layout could use some polishing, but overall it has landed at a good stopping point. Next up, I will probably provide more interesting backing audio samples for each mode, something more musical (eg. jazzy, groovy, rock-and-roll, etc). I’ve also thought about giving users/students the ability to track how many mode/string combinations they have practiced over how many minutes/hours, but that’s probably way down the road.

One more note about implementing the site: I will eventually switch from using plain CSS to using styled-components, but in this first phase, I was curious to see how far I could get using vanilla CSS (HINT: just far enough). And, I definitely want to return to learning more about Web Audio API, as I think there’s a lot of interesting possibilities for improving this application with it.

Play around with the site and let me know what you think! Feedback and request for features are most welcome.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s