Music theory fundamentals
Description
Tableau really triggered a wave of enthusiasm for this IRONVIZ contest, blending peoples love for music with their passion for vizzing, frankly the level of submission has been unbelievable, there have been some exceptional visualisations covering classical to gangster rap. and everything in between.
For me it also struck a ‘chord’, some know that my educational background is in Music and the academic study thereof. My musical journey began back in 1985 when I picked up a trumpet at the tender age of 5 to have lessons at school. My first Trumpet was given to me by a family member whom gigged jazz standards for many years. I loved that battered old horn, and it inspired me to progress through many classical orchestras, swing bands, brass bands and the occasional covers bands.
Slightly later I began to learn the Piano, and completed all the necessary grades and exams in both performance and theory to get me into university to do a Bachelor of Arts in Music and later a Master of Music by Research in Electro Acoustic Composition and Sonic Arts. Which inadvertently led me to where I am today in data visualisation, having spent many hours exploring music and sound, data analysis and computer science techniques. with a goal to building live improvising systems to jam with – All in the name of Art.
However I have rarely blended Viz with Music, so really looked forward to submitting something for this round.
Question was – where to start? I had so many ideas but decided to really take the concept back to some fundamentals of music theory and practice, rather than an analysis piece of dataviz using big or complex data sets. The challenge I decided to set myself was one of attempting to present some of the key fundamental building blocks of music theory and understanding, as a learning (Educational) tool for understanding a little bit about music and how it works.
- What are chords, how are they made up (I only had time to look at Major chords but would like to expand this at some point to cover the full circle of fifths diagram with Minor chords and key signatures too)
- If you know what notes make up simple chords, how could you actually play these (on a piano for example).
- The medium for music is aural not visual and you can’t grab hold of it, however how could I bring the visual to the table and introduce an explanation of what sound looks like and how it works?
I have been very occupied with the notion of KISS and the principle of keeping a visualisation simple to enable easier perception, interpretation and comprehension of data. I feel my approach to this IRONVIZ, is no different. However it took some very non KISS Tableau techniques to try and visually achieve a somewhat simple resulting viz in the time frame.
Viz Type
- Buttons – Circle mark types
- Circle of Fifths – Radar chart
- Piano keys – Custom chart
- Piano key notes – Floating mark type circle on a custom x y dataset
- Sine Wave – Line chart
A quick ‘how I constructed the viz’
Key techniques for creating this dashboard were as follows;
- Radar Chart – go to resource Ellen Blackburn – Information lab Data School – A simple way to make a radar chart
- Piano Keys – totally indebted to Klaus Shulte and Lodovic Tavernier’s TC19 talk where they introduced me to spotify Coordinator – a A visual interface for turning an SVG into XY co-ordinates, in their talk on “Creating advanced unique charts”
- I also reached out to the legend that is Ken Flerlage to help me get the correct trigonometry calcs working achieve the sine waves.
The Circle of fifths
I admit a took a bit of a short cut with this and floated the polygon shapes on top of a base chart which depicts the circle of fifths. Mainly because i didn’t want to go back and data prep.
The Keyboard
- The output from Spotify Coordinates, spits out a a csv for X and Ys, with a bit of clean up and generation of a Path Column it is fairly easy to render this pretty cool piano in tableau using simple X and Y data – crazy hey!
The sine wave
The data
There really isnt much of it, a few rows Alteryx’d for the 12 rows of data relating to the chords and related notes used for the circle of fifths and actions throughout, The keyboard coordinates which were helpfully generated for me by coordinator, and a few rows to log each of the 12 frequencies relating to each of the notes on an octave, and a densification table to allow the curve to be plotted on the sine wave (line).
Thanks for reading, drop me a message if any of this sounds interesting.
Adam
