Interactive fretboard 🎸

I have a great passion for playing guitar. Lately I am trying to understand the guitar better and especially how the chords and scales are created and how they relate to the positions on the guitar. So I’ve build a online visualization that helped me on that. It started mostly as tool for myself, but I noticed this might be useful for others too. I still have to learn a lot myself, I starting to get some parts from theory perspective, but I don’t have them all “in the fingers” yet.

I noticed while creating the website that the theory behind chords actually is relative simple actually, just some “intervals over intervals”, from a programmer perspective that was wasn’t the hardest part. Mapping the theory to real guitar playing is of course a lot harder. Then it helps when you can easily visualize everything during practice sessions. For example, I like to switch between note names and intervals (since lots of online tutorials talk about such steps) and switch easily to different keys.

The website is build with Haxe 4 + coconut.vdom (react/vue alternative for Haxe), which is a really great experience. Type-safe, reactive views, component based, pure Haxe.

Check it out on: https://interactive-fretboard.com