Drop 2 Guitar Voicings
This is mostly a test to see how well this will show up, but I'm experimenting with some text-based (I guess UTF-8) chord diagrams. If anyone plays guitar and/or has some feedback, feel free to chime in.
These are drop 2 chord voicings on the top 4 strings of a standard-tuned guitar. Arranged vertically, with each shape representing each chord piece. The gaps are for clarity, but each line ought to be successive and the patterns repeat themselves.
Edit: Well, it seems some of the symbols aren't rendered at a fixed-width. Though, they are in the font in my editor. Hm. I guess that's what I get for using symbols for an unintended purpose.
EditEdit: Oh, I see. Firefox is using three different fonts to render the symbols. SF Mono is my default monospace font, and it only renders the ◊ symbol. It falls back to Courier New for ○ and Segoe UI Symbol for the rest. Interesting.
▢ = Root
△ = Major 3rd
▽ = Minor 3rd
○ = Perfect 5th
◎ = Diminished 5th
◊ = Major 7th
◇ = Minor 7th
◈ = Diminished 7th
Major 7
Drop 2 Voicings
Top 4
EADGBe
------
||||○▢
||◊△||
||▢|||
||||||
|||○◊△
||||▢|
||△|||
|||||○
|||◊||
||○▢△|
||||||
|||||◊
------
||||○▢
||◊△||
etc...
Dominant 7
Drop 2 Voicings
Top 4
EADGBe
------
||◇|○▢
|||△||
||▢|||
||||◇|
|||○|△
||||▢|
||△|||
|||◇|○
||||||
||○▢△|
|||||◇
||||||
------
||◇|○▢
|||△||
etc...
Minor 7
Drop 2 Voicings
Top 4
EADGBe
------
||◇▽○▢
||||||
||▢|||
||||◇▽
|||○||
||▽|▢|
||||||
|||◇|○
||||▽|
||○▢||
|||||◇
||||||
------
||◇▽○▢
||||||
etc...
Half-diminished 7
Drop 2 Voicings
Top 4
EADGBe
------
||||◎|
||◇▽|▢
||||||
||▢|||
|||◎◇▽
||||||
||▽|▢|
|||||◎
|||◇||
||◎|▽|
|||▢||
|||||◇
------
||||◎|
||◇△|▢
||||||
etc...
Neat. However: Consider that triangle and little circle already mean something in some music notation conventions (major and diminished).
Yea, well awares. Though these shapes are being used in a different context, so there shouldn't be any confusion. I was thinking of just using
●for each chord part (as you might find in a traditional chord diagram), but I was hoping to impart more information on the function of each note. I'll probably just use●after all, though.I don't know jack about music notation, but I do know W3C has a spec for it:
Standard Music Font Layout (SMuFL)
And the relevant section for you are probably:
https://w3c.github.io/smufl/gitbook/tables/guitar.html
https://w3c.github.io/smufl/gitbook/tables/chord-diagrams.html
https://w3c.github.io/smufl/gitbook/tables/chord-symbols.html
How well browsers and fonts adhere to the spec is probably pretty varied though, so who knows how much the spec will really help you at the practical level... ¯\_(ツ)_/¯
Hey, I know a bit about SMuFL!
Basically it's little more than a way to map musical glyphs into fonts ― sort of like how Unicode is for mapping language glyphs* into fonts.
You still need something else to render those glyphs, and put them in the right place, and kern them and all that. For example, LilyPond does something similar to TeX; and VexFlow does something similar to MathJax.
This is a lot more like image editing than plain text editing, unfortunately. For example, where hyphenation is so straightforward that your browser can do it**, for a fully rendered score, a system (line) break might require introduce a lot of new notation in the following system.
And chord diagrams and classical scores are just two of many standard notational tools, each with different rendering and layout rules.
* Actually code points, which may or may not correspond to glyphs. Also SMuFL is itself mapped into the Unicode code space.
** Using CSS
hyphenswithlang="something".Very cool! The chord diagrams are pretty much exactly what I'm thinking of implementing in plain(ish) text. I wonder how to place the fingered fret symbol onto one of the fretboards, though.
It's just a specification, so you would still need a font that adheres to it. E.g. The one used on the W3C site is Bravura.
And then the site you are going to use it on needs to include that font in their stylesheet. E.g. https://w3c.github.io/smufl/gitbook/styles/website.css
But even then, I doubt any browsers currently know how to handle the font metadata correctly or will be able to place the notations properly. However that is not really surprising, since reading through the documentation, the spec appears to be meant more for standardizing fonts for music scoring applications than anything else.
I was mostly just providing it as a reference for you, so you can see how others are implementing something similar to what you're attempting to do here in "plaintext".
With plain dots: