
Show HN: Guitar Dashboard – Open source music theory explorer for guitarists - mikehadlow
http://guitardashboard.com/
======
mikehadlow
Just a heads up that I also blogged about the making of Guitar Dashboard:
[http://mikehadlow.blogspot.com/2018/09/what-i-learned-
creati...](http://mikehadlow.blogspot.com/2018/09/what-i-learned-creating-
guitar.html)

~~~
blockchaincloud
Can you explain what you mean by this-

> If you choose the frequency 440hz, jump down one 7-semitone step and up 5,
> you have an A major scale

Also I have one more question about - when making chords using the 3rd and 5th
step, for a note on the right boundary of this n <-> 2n interval, I would jump
into 2n <-> 4n interval, right? But I'd I were not using chords then is "all"
(simplified) music made in only only one x <-> 2x range and it's not crossed?

Another question- why do pianos have different black and white keys? Do you
plan on doing a blog post that explains how "your " explanation of music
theory fits various instruments? I've always wanted to understand music from a
mathematical perspective and your post was eye opening!

I am going to try out your tool once I get hold of a computer.

~~~
steamer25
Each doubling of frequencies is divided into twelve somewhat evenly-spaced
semitones. If you go up seven out of twelve (using index 0 for your initial
frequency), that's essentially half way to the doubling of the frequency with
a ratio of 3:2. E.g., if your starting frequency is 440, going up seven steps
will give you a note with a frequency of 660.

Another way of dividing up the space between a frequency and it's doubling
uses eight of the twelve semi-tone divisions . The eight notes form an
'OCTive'. The octive has a 1-based index for the starting frequency. You can
see seven out of twelve highlighted notes in the dashboard circles . The
eighth note has the same name as the first one as you complete the circle but
it would either be double or half the frequency. Going up seven semi-tones
using the twelve division 'chromatic' scale is the same as going up five steps
in the more selective eight note octive scale.

Yes, the circle continues from 2n<->4n and 4n<->8n and n/2<->n and n/4<->n/8
etc. The boundaries are those of human hearing from about 20hz to 20khz.

The white keys on a piano are the key of C Major. The black keys are the
'accidental' notes--the five notes of the twelve division chromatic scale that
are discarded when selecting the notes for the eight (7 + the 1st/8th note
that is counted twice to complete the circle) note octive.

~~~
blockchaincloud
Thank you, that was a detailed answer that gave me a lot of new things and I
have a new question and some old questions-

You are saying there are 8 notes in an octave, but we only selected 7 notes
after selecting 7th semi tone 7 times. I think you said the 8 note is 2x the
original. Is that correct understanding?

So I got the point about 2^(1/12), what I didn't get is the staring point for
A major and the jump structure. I thought all jumps are selecting 7th semi
tone. So what is meant by "jump down one 7-semitone step and up 5"?

You partially answered my second question I think- saying that for chords it's
okay to go from n <-> 2n scale to 2n <-> 4n scale. My question is for non
chord music is this a common occurrence?

Thank you again!

~~~
sampo
The music tradition sees the notes rather as intervals between two notes.

C to the same C is "unison" (You may need to instruments to play two identical
C notes at the same time.)

C to C#/Db (this note has two names) is "small second"

C to D is "large second". And so on.

C to the next higher C is "perfect octave".

So if we take the C major scale, it has 7 different notes. But if we also
include the next higher up C, you can pair the base C with 8 different notes,
when we include pairing with itself, and pairing with the higher C. When you
have two instruments playing, these are the pairings you can make when you
play two notes at the same time.

[https://en.wikipedia.org/wiki/Interval_(music)#Comparison](https://en.wikipedia.org/wiki/Interval_\(music\)#Comparison)

~~~
chuchana
> C to the same C is "unison" (You may need to instruments to play two
> identical C notes at the same time.)

> C to C#/Db (this note has two names) is "small second"

While C# and Db are the same note (in equal temperament [1]), the intervals
C/C# and C/Db have different names: C# is called 'augmented unison' [2]. For
the name, you start from the basic interval (e.g. C/C) and apply the
accidentals (# or b) [3].

[1]
[https://en.m.wikipedia.org/wiki/Equal_temperament](https://en.m.wikipedia.org/wiki/Equal_temperament)
[2]
[https://en.m.wikipedia.org/wiki/Augmented_unison](https://en.m.wikipedia.org/wiki/Augmented_unison)
[3]
[https://en.m.wikipedia.org/wiki/Accidental_(music)](https://en.m.wikipedia.org/wiki/Accidental_\(music\))

~~~
sampo
This is an example of why the traditional approach to music theory can be
cryptic for a beginner. After the Western music moved to well and equally
tempered scales (starting from the early 1700's), the context in which there
is a difference between C# and Db has disappeared. But we still use
terminology and notation from 500-800 years ago.

------
osteele
This is great!

A suggestion: show pitch constellations[1]. Piano/violin music theorists have
written me that these were helpful in [2]. (I'd offer you code, but it's so
ancient that it's probably not helpful :-( )

[1]
[https://en.wikipedia.org/wiki/Chromatic_circle#Pitch_constel...](https://en.wikipedia.org/wiki/Chromatic_circle#Pitch_constellation)

[2]
[http://osteele.github.io/fingerboard/](http://osteele.github.io/fingerboard/)

~~~
GitRHero
Just a heads up that your fingerboard app seems to be working incorrectly
regarding displaying the names of sharps and flats on the fretboard diagram
(in some cases).

For example, if I load the page and immediately click on an Eb on the piano,
the fingerboard layout is correct, and the correct scale degrees are
highlighted, but Eb are labeled as Db in the fretboard diagram. Similarly Bb
are labelled as Abm etc. It seems like you just switched the sharp/flat symbol
without also switching the note letter.

Otherwise awesome tool, this will be very useful for me!

------
3pt14159
This is really great!

It would be cool if you supported a kapo and turning it flat. That way I could
tune it to e flat without having to do the mental math, and I could put the
kapo on whatever fret so I could visually see quickly.

Super awesome work!

------
jMyles
Very interesting and pretty tool!

I wonder: on the "scales" dropdown, why didn't you include pentatonic? It's so
prevalent across so many styles of music; it seems like a must.

~~~
mikehadlow
That's a very good question. I had plans to add major and minor pentatonic
scales until it became clear that they way they are used, especially in rock
and other blues based music is a subset of dorian modes. There's some real
insight to be gained, especially with regards to harmony, or more practically,
what chords you can play against a major or minor pentatonic. It's a lot more
than one would think!

So, to answer your question, I'm not going to add pentatonic scales, but I do
plan to record a video showing how GD can give you some really cool insight
into how they work harmonically.

~~~
markatto
How about an option to overlay the pentatonic scales over other scales,
similarly to the way you color the root notes but with a different color? You
could use a similar idea to overlay root-third-fifth or other chords. I think
this would be useful for those of us who are still trying to build muscle
memory, but still present information in a way that minimizes "stuck
thinking."

------
supernovae
For those of us scrubs just learning guitar, do you have a guide on how to use
this? or a link to a good guide?

~~~
throwaway8879
While these tools are useful, I recommend oldschool hard copy books to get
started properly, if you're relatively serious about it. There are some great
books for guitar put out by Berklee, I don't recall the names right now, but I
do remember a series that had 4 books from intro to advanced.

I spent a lot of years learning guitar technique while not progressing much on
the music theory side until I started reading Mark Levine's Jazz theory book.
It's probably the best material on music theory I've read, though it's
slightly based on jazz, or at least references it a lot. But I think you could
use it as a general theory guide.

Another favorite of mine is Yusef Lateef's Chord and Melodic Patterns book,
though it's more advanced/exploratory.

~~~
supernovae
Got quite a collection of intro books, but nothing on theory really. I had
hand surgery on my frett hand a few months ago and still do physical therapy
twice a week - just now getting some strength back so while I recover, trying
to learn more music theory since my practice sessions are limited by a screwed
up hand. I tell ya what though, practicing guitar is better than most of my PT
exercises :)

~~~
throwaway8879
That's alright, I've had to relearn my technique after a coma. It's easier the
second time around. I really recommend doing legato exercises to strengthen
the fretting-hand. Look up any neoclassical shred guitar book and they should
have some guitar acrobatic exercise on legato. A good one is the Frank Gambale
warmup instructoinal video. Another is a Paganini for guitar book put out by
Greg Howe in the 90s if I recall correctly. I had a lot of fun learning the 24
caprices from that book.

Definitely agree about the guitar practice being better than PT part. :)

~~~
EADGBE
The Speed Strategy books are really good as well (Chris Brooks). There is a
neoclassical, and a sweep picking one as well.

~~~
throwaway8879
Thanks for the recommendation. I've just gone through his wiki page, and if
Brett Garsed thinks he's great, I have to check him out.

------
sixstringtheory
Awesome project, thank you to the author!

I see a lot of folks asking about resources to learn the ideas in this tool,
so I’ll recommend the Guitar Grimoire series. Granted they are more reference-
type books, but each one has a good introductory chapter that I found taught
the theory in an accessible way to me. I picked up the Scales volume first and
have gathered more over the years, like the practice exercise edition, but
don’t use them much these days (it’s been like 15 years now :)

------
alfonsodev
Great job! One idea: Have some tracks ( from Spotify api?) to play along that
matches the selected scales. I've found that playing on top of songs works
pretty well, improvising up and down is very easy if you are playing the safe
notes of the scale, finding how the singing melody fits the scale, then how
the solo fits the scale..etc is a funnier way to memorise the scale.

~~~
mikehadlow
I've found a looper pedal a fantastic tool for learning theory. Play some
chords from a particular scale, then try improvising over it. You get a real
feel for how the different modes sound.

------
uglycoyote
Very cool. I've also had a side-project developing something similar for a
while: [http://sonicpines.com/fretboard](http://sonicpines.com/fretboard)

I keep being surprised at people having the same idea e.g., see also Grunfy's
post from a few months ago.
[https://news.ycombinator.com/item?id=17272516](https://news.ycombinator.com/item?id=17272516)
He has some very nice stuff there.

My work-in-progress is also derived from "first principles", although I
haven't bothered to try adding alternate tunings yet.

Mostly my focus has been on using it to aid learning improvisation, so one
feature i added to my little app was the ability to set up a particular chord
pattern on the fretboard and "save" it, so that you can have several different
diagrams on the screen at once, e.g., one for each of the three chords in a
3-chord song.

Like you, I also have been using Typescript and SVG, but not D3 (just drawing
SVG elements directly using React seems to work well enough for my purposes)

------
tmpmov
Fantastic work. I've been learning music theory off and on to help with my
guitar. I was hoping for a whole lot of interactive applications like yours,
but found most lacking for me, though I did find a few on the iPhone:
FretTrainer for muscle memory stuff. I figure out what to learn next based on
Musicopoulus. Both are fair, each with quarks.

I've bookmarked you in my, just created, music "Toby" folder. Speaking of
which, here's one last app recommendation that's totally unrelated: if you
don't already have an extension for bookmark management on your computer,
consider "Toby." It's a decent one for chrome, I use it as I have way too many
normal bookmarks and finding stuff via scrolling becomes painful. I'd be
interested if anyone else is using a different bookmark extension for Chrome
as well.

Great job again!

~~~
hyyypr
Regarding Toby, how confident are you that it is not another case of “you’re
the product”?

I still need to dig into their extension code to see how chatty it is, their
FAQ doesn’t mention how data is synced to their servers.

~~~
tmpmov
Frankly, I'm totally clueless. It might be an interesting exercise to see what
they're doing.

------
jihadjihad
This is absolutely fantastic. I've lost my guitar teacher's notes where he
wrote out the modal scale patterns, and the ones online are not good for
developing this kind of intuition. Perfect example of just the right amount of
information while still remaining simple to digest. A+

------
Theo59
Years ago I went to a talk on Neo-Riemannian theory

[https://en.wikipedia.org/wiki/Neo-
Riemannian_theory](https://en.wikipedia.org/wiki/Neo-Riemannian_theory) is a
bit lacking of a simple explanation, but the basic idea is that chord groups
(e.g. Minor chords) are represented as a algebra (e.g. x, x+5, x+7)

and then the chords can all be mapped on a big torus (donut) to represent
transposition, and each chord connects with 2 others that just so happen to
correspond with 'complimentary' chords from traditional music theory. And
there are also different ways to connect to other chord groups.

Beethoven's 9th Symphony famously traces 19 of the 24 possible chords of the
torus, and remember that he was partially deaf so relied on vibrations.

More interesting that all this however is a new instrument called the 'Fluid
Piano' which doesn't restrict itself to Western tuning (multiples of 440Hz
etc.) Check it out
[https://www.youtube.com/watch?v=t7Cq3pbcMkI](https://www.youtube.com/watch?v=t7Cq3pbcMkI)

Music from the country Georgia can't be represented using on traditional
musical staves. I'd be fascinated to understand how so different musical
cultures developed, particularly in relationship to how our brains might have
evolved over the year to regard certain frequencies and melodies as
delightful, eerie, etc.

------
radiowave
Lefty here. The options to flip the fretboard and the nut are much
appreciated.

How about introducing another shading for the 3rd and 5th notes, so that the
relationship between the scales and the chord shapes becomes more apparent?

------
bcheung
This is very nice.

If I might add a suggestion, it takes a while to fine the number of the chord.
For example, if I'm trying to figure out what 1-4-5-1 would be, I have to hunt
until I find the 4 and 5. Would be cool if there was another view that was the
Nashville number system in sequence to make it quicker to find.

For example:

1 2 3 4 5 6 7

C D E F G A B

------
kgwxd
Oh my g o s h, it works with all my crazy custom FF privacy config stuff, this
is awesome! I've never heard of "N Minor" and searching doesn't bring up
anything. Is that a mistake?

~~~
bhrgunatha
Natural minor scale as opposed to harmonic or melodic.

[https://en.wikipedia.org/wiki/Minor_scale](https://en.wikipedia.org/wiki/Minor_scale)

------
djaychela
Looks very good - I'll get a chance to look properly on a laptop tomorrow. One
thing I'd like is the ability to do 9 string tuning - I have a 9,and yet to
get seriously into it, partly because it's so easy to get lost and I'm yet to
get on top of the patterns that I already know well on a 6 string... I know
it's the same intervals as the bottom 4 strings of a 6 string, but seeing the
patterns would help, I think. But as its open source, I guess I should do it
myself!

------
DuckTyping
This is amazing, thank you!

I've been playing guitar for a while now and am now beginning to understand
the importance of theory, but I'm kind of at a loss on how to go about
learning and applying it. Does anyone have a book/mooc that they'd recommend
with lots of exercises and accompanying songs?

I've gone through a few sources but most of them relate everything to a piano.
I understand the underlying theory is mostly the same but I feel like I would
internalize it better seeing it on a fretboard.

~~~
throwaway8879
Another thing, I really do recommend learning music theory on the piano/keys
as well as your primary instrument. Doesn't have to be a fancy keyboard, any
cheap midi thing just to visualise the way the way chords and scales are
structured. I've found that learning other instruments become a lot easier
once you know a little bit of theory and how they're laid out on a keyboard.

~~~
beat
When I was learning theory, my teacher taught all his students, regardless of
their instrument, on piano. It's the most neutral, in terms of scales and
chords.

Guitar, on the other hand, usually has multiple valid fingerings (on different
strings) for the same chord inversion. Part of the process of learning new
chord voicings on the guitar is learning the same chord everywhere it can be
played.

------
jjkmk
The Modes should be in order,

Ionian - I

Dorian - ii

Phrygian - iii

Lydian - IV

Mixolydian - V

Aeolian - vi

Locrian - vii

Otherwise its a really useful tool, great job.

~~~
djaychela
I don't agree - the modes are presented here in the order of change from the
major scale, which I've found is often the best way to get people to
understand how they work. One man's method, etc...

~~~
jjkmk
The Major scale is Ionian (the first mode).

What do you mean order of change from Major scale, wouldn't it start from
Ionian (I)?

------
mirkules
Heh, I am reminded of a little exploration I did a few years ago:
[http://mirkules.com/blog/music-theory-for-
guitar/](http://mirkules.com/blog/music-theory-for-guitar/)

I wish I had this tool back then!

------
mikeyvxt
This is great! I'm not actually sure how prominent the CAGED sequence is in
guitarist circles, but I was thinking it might be helpful to indicate the
chord shapes.

Hope you can continue hosting it - I might use this to practice my scale
visualization.

~~~
sampo
> it might be helpful to indicate the chord shapes

You can select notes on the innermost ring in the circles.

For example, select G as the base in the middle ring. Then select 1, M3 and 5
on the innermost ring. The fretboard will show you all the possible ways to
finger the G major chord.

------
AndyPandy
This tool looks amazing and I will certainly be using it!

One request would be to allow custom tunings. All of the tunings I use are not
listed, and transposing as I go makes it a little harder to use.

------
BookPage
I always wanted something like this. Previously I'd set up custom spreadsheets
to do the fretboard highlighting like you have. Fantastic work and great
effort - thank you!

------
johnnyb128
Just wanted to say thanks for this, it looks great and operates great. Really
nicely done, I'll be using this quite a bit and will provide feedback if there
is any.

------
jmfayard
Can you add a settings to display notes in their true poetic name (do re mi fa
sol la so do) instead of the boring Anglo Saxon variant (abcdecg)?

------
andrewcarter
Really cool tool! I've been getting into more theory stuff after playing
guitar for quite a while, so it's awesome timing! Thanks!

------
thedjinn
Looks decent. I would suggest adding more tunings for us metal players that
play lower tunings (for example, I play 2 whole steps down)

------
vbsteven
I will spend some time on this later next week. At first glance my preferred D
standard tuning (DGCFAD) does not seem to be available.

~~~
zen3d
Ditto for "Open D minor (DADFAD)" tuning that I use. Being able to set up an
arbitrary tuning would serve this purpose as well, although I suspect
generalizing that function might be more work than it is worth.

It would also be nice to see other scales, such as major and minor pentatonic
and blues scales.

I've used jguitar.com in the past for this sort of thing, but I really like
visual aspect and unity of guitardashboard. Nice work!

~~~
asaph
+1 for mentioning [https://jguitar.com/](https://jguitar.com/) which I
created.

~~~
zen3d
There aren't a lot of tools for exploring fingering for non-standard tunings,
and jguitar.com has served my explorations for the past couple of years.

jguitar.com is also very comprehensive in terms of chord fingering, scales,
etc.

One major difference between jquitar.com and guitardashboard.com is that the
facets (tuning, chords, scales, etc.) are separated from one other on
jguitar.com, whereas guitardashboard.com tries to place them all onto a single
screen. My initial reaction to guitardashboard.com is that this approach does
succeed. However, jguitar.com has more to offer in total.

My thanks to both authors for helping us explorers of alternate tunings. Any
help we can get is appreciated.

------
zdk
Damn, this is what I'm looking for. Excellent visualization! Thank you.

------
fromMars
Wow. This is great. I play left-handed, in fourths tuning and these
visualizations are amazing.

Consider adding chords, too!

------
guitar11
the only problem with all of this is that you must ingest the entirety of the
information before becoming unconsciously competent. Do you think skilled
guitarists actually think about this while they play? It's a complete flow
state; prefrontal activity just shuts it down.

~~~
cjhanks
There are different stages of composition in music. By the time you're playing
music, you ideally should not think this way.

But it's nice to have a visual way of seeing substitutions that work with your
progression as you write music.

Having an enumeration of all of the possible voicings is really nice.

When I looked at this (as a bass player), I didn't even really notice the fret
board. This application is applicable to all instruments.

------
mrbad101
Just wanted to say thank you as well for this. Great tool! What are you future
plans for it?

~~~
mikehadlow
Right now, I just want more people to know about it and get some good feedback
on what works and what doesn't. I'd be super happy if guitar teachers and
other music educators pick up on it. It'd be great if I got some good pull-
requests too. I'd like to make more YouTube videos, relating Guitar Dashboard
to the theory and showing some examples. I'm not a keyboard player, but Piano
Dashboard seems like an obvious addition :)

------
akuji1993
I really really like this and will for sure use it! Thank you for this!

------
colospoin
No real comment, other than to say thanks! This looks very useful.

------
plainOldText
Nicely done! Finally a proper aid for learning the fretboard.

------
slantedview
This is wonderful. Is there anything like this for piano?

------
drblast
Great job on this, it's an excellent visualisation.

------
beeskneecaps
Animated arpeggios on the fretboard view please!

------
sibeliuss
Bravo man! This is an incredible resource.

------
nickporter
Very cool project, thanks for making this!

------
wwarren
Really awesome, thank you so much!

------
s_m
This is really cool!

------
cjhanks
Very nicely done.

------
markbnj
Very well done.

------
brickmort
fantastic!

------
openloop
This is awesome.

