6 ms·

Show HN: 19 Tone Equal Temperament Piano in Web Audio

68 points by outputchannel 11y ago

amelius 11y ago
Is there something that makes 12 special? I am no expert in music theory, but I can imagine that it could be useful that 12 has many factors: 12 = 2x2x3. Since 19 is prime, would that be a bad choice?
- kaoD 11y ago
  I found these: https://www.quora.com/Why-are-there-only-12-pitch-notes-C-C-B-in-the-world https://www.quora.com/Why-are-there-only-12-pitch-notes-C-C-... https://www.quora.com/How-did-Western-music-settle-on-a-12-tone-scale https://www.quora.com/How-did-Western-music-settle-on-a-12-t...
- exabrial 11y ago
  Related, why you can't tuna fish, or tune a piano: [Minute Physics] https://www.youtube.com/watch?v=1Hqm0dYKUx4 https://www.youtube.com/watch?v=1Hqm0dYKUx4
  - ashmud 11y ago
    Thanks for this. I was unfamiliar with Henry Reich's videos.
- TheOtherHobbes 11y ago
  Two reasons: 1. Harmonic intervals in 12TET are good enough to sound okay with no obvious sour notes. 2. Hand and finger size. Factors and primes aren't the issue - it's how closely the octave divisions approximate perfect whole-number interval ratios. 12TET hits the sweet spot. The tuning is close enough for practical keyboard and fretted instruments to cover a wide pitch range but still fit human hand and finger sizes. So they're not impossibly difficult to make, tune, and learn, but you can still make complicated music on them. Finer subdivisions like 19TET - or more - are closer still to the ratios, but you need computers and electronics to make practical instruments. Or highly skilled string players: https://www.youtube.com/watch?v=MPHLS5mJrJk https://www.youtube.com/watch?v=MPHLS5mJrJk
- dfan 11y ago
  With an equal-tempered n-tone scale, two pitches that are x units apart have a frequency ratio of 2^(x/n). "Nice-sounding" intervals have small integer frequency ratios. It so happens that 3/2 = 1.5 is very close to 2^(7/12) = 1.498, 4/3 = 1.333 is very close to 2^(5/12) = 1.335, and 5/4 = 1.25 is very close to 2^(4/12) = 1.260. So 12 works very well as the number of pitches to divide an octave into. The fact that 12 is highly divisible is handy for certain aspects of music composition. For example, if you have a diminished seventh chord, which consists of every third pitch, due to its symmetry you can think of it as being in any of four different keys. So it is easy to use it to pivot from one key to another. But none of that has to do with the reasons that it sounds good.
- s-phi-nl 11y ago
  There are some mathematical reasons. In particular, the two most consonant (best-sounding) intervals are the octave and the fifth. The frequencies of the two pitches in an octave have a ratio of 2.0, and the frequencies of the two pitches in a pure fifth have a ratio of 1.5. We would like the pitches we obtain from powers of these two ratios (stacking these intervals on top of each other) to be the same. However, since the integers are a unique factorization domain, they will never be (except for 2^0 = 1 = 1.5^0, of course). [1] Thus, we pick powers of the two that are 'close enough' and call those the same pitch. The following Python (3) code subtracts the log-base-two of the powers of 1.5 from the integer they round to in order to find the closest ones: from math import log fifth = log(3/2, 2.0) print(0, 0.0) minDist = 0.08 for i in range(1,100): pow = i* fifth; dist = abs(pow - round(pow)) if dist < minDist: minDist = dist print(i, pow, dist) This has output: 0 0.0 5 2.924812503605781 0.07518749639421918 12 7.019550008653875 0.019550008653874684 41 23.983462529567404 0.01653747043259557 53 31.003012538221277 0.003012538221277339 From this, you can see that 12 is the closest that the powers of 2.0 and of 1.5 come being equal until 41. This is a primary reason why we use a chromatic scale with 12 notes. (As an aside, a scale with 5 notes is also common around the world, called the pentatonic scale [2]) [1] For an explanation of this, see http://blogs.scientificamerican.com/roots-of-unity/the-saddest-thing-i-know-about-the-integers/ http://blogs.scientificamerican.com/roots-of-unity/the-sadde... [2] https://en.wikipedia.org/wiki/Pentatonic_scale https://en.wikipedia.org/wiki/Pentatonic_scale
  - voynich61 11y ago
    This is a great explanation. To add onto this, I would imagine a lot of non-musicians would wonder whether there's a good reason for equal temperament, as most songs in every genre utilize it instead of more consonant scales (e.g., just intonation). There are two main reasons. The first is a matter of switching between scales, as in, many songs will modulate to out-of-scale-but-mathematically-related chords. As 12TET has each scale using the same notes, one doesn't have to tiptoe around shared notes which are 'slightly' off. The second is pure convenience: using a set of notes for each key (or pushing the root note a few Hz up or down) would be a laborious process. With that being said, an interesting direction some electronic producers take is to experiment with scales, given how ubiquitous waveforms with integer harmonics are. Here's an example from Richard D James: https://youtu.be/pTn1tmhA8L8 https://youtu.be/pTn1tmhA8L8
- Intermernet 11y ago
  There's a great description here: http://www.math.uwaterloo.ca/~mrubinst/tuning/12.html http://www.math.uwaterloo.ca/~mrubinst/tuning/12.html It's too in-depth to summarize, but worth a read.
- nirajshr 11y ago
  If you have time, this is an excellent article that describes where the "12" comes from and the derivation of the chromatic scale and just intonation scales. http://arxiv.org/html/1202.4212v1 http://arxiv.org/html/1202.4212v1
- abruzzi 11y ago
  12 tone is a historical scale. Initially (Pythagoras) the scale was based on perfect fifths. Over time the notes in between the diatonic scale note were added. Tuning started becoming a big deal because if you tune all your fifths to be perfect, some intervals outside of the scale got really weird. Equal temperament was the compromise solution. Instead of tuning perfect fifths, you just make every half step the same. That means that your other intervals are all out of tune, but it is small enough that you don't have some keys that are horrible. Bach's 24 preludes and fugues (in each major and minor key) was partly a demonstration of a similar tuning system--well tempered, also known as Werkmeister. Other music traditions such as indian classical/raga, use different tunings. I'll also add that the all-key tunings like equal and well tempered are hugely important for the development of music from back to today, its not mere esoterica. Look at something like a late Beethoven piano sonata. In the course of a single piece, it may modulate a hundred times through a half dozen keys. The development of all key tunings, while they made 5ths worse, made it possible for a pieces of music on a fixed tuning instrument like a piano to range through any key, and that was huge to the development of music.
bobajeff 11y ago
I tried this on my phone (via Chrome for Android). The keys didn't do anything when I pressed them.
- moron4hire 11y ago
  If you just want to play around, I wrote a keyboard that works in Chrome as well as Firefox on Android back in November. http://s.codepen.io/SeanMcBeth/debug/meaQvj http://s.codepen.io/SeanMcBeth/debug/meaQvj
grncdr 11y ago
Very cool. You might consider adding a short (a few ms is enough) fade in/out when toggling notes to avoid clickiness.
- Kristine1975 11y ago
  A few samples is enough, actually. Just enough to prevent the sudden change from high to low, which is what causes the click. You don't even need to compute new samples. Merely repeat the last sample while lowering its volume until you reach zero.
mattmanser 11y ago
There's a bug where if you mouse down and move the mouse out, the note plays indefinitely.
- abruzzi 11y ago
  is that a bug? I was using that to hear chord, until I got to the bottom and saw I can also do it with my keyboard.
  - kencausey 11y ago
    I agree, seemed like a feature to me.
ableal 11y ago
Another interesting page in the site: https://academo.org/demos/perlin-noise/ https://academo.org/demos/perlin-noise/ Made me look it up: https://en.wikipedia.org/wiki/Perlin_noise https://en.wikipedia.org/wiki/Perlin_noise Smooth.
jarmitage 11y ago
This library and web audio demo has 3000+ tuning systems: https://github.com/abbernie/tune https://github.com/abbernie/tune It's part of the proceedings of the 2nd Web Audio conference which are now available: Abstract: https://smartech.gatech.edu/handle/1853/54580 https://smartech.gatech.edu/handle/1853/54580 Proceedings: https://smartech.gatech.edu/handle/1853/54577/browse https://smartech.gatech.edu/handle/1853/54577/browse
6stringmerc 11y ago
Very clever and quite fun to poke around in, and educational with the whole math breakdown. Nicely done and glad to be able to play around with it. I'm tickled by the opportunities to play around with customary tones! Z-R-V-Z-R-B-Z-R-N-Z-R-B-Z-R-V is a nifty little arrangement.
hatsunearu 11y ago
The tones in the piano don't have a lot of harmonic content (at least what I can hear from my ears), and if there are more harmonics the beating of the harmonics can be more easily heard. Just a suggestion.

68 points by outputchannel 11y ago

Is there something that makes 12 special? I am no expert in music theory, but I can imagine that it could be useful that 12 has many factors: 12 = 2x2x3. Since 19 is prime, would that be a bad choice?

kaoD 11y ago
I found these: https://www.quora.com/Why-are-there-only-12-pitch-notes-C-C-B-in-the-world https://www.quora.com/Why-are-there-only-12-pitch-notes-C-C-... https://www.quora.com/How-did-Western-music-settle-on-a-12-tone-scale https://www.quora.com/How-did-Western-music-settle-on-a-12-t...
exabrial 11y ago
Related, why you can't tuna fish, or tune a piano: [Minute Physics] https://www.youtube.com/watch?v=1Hqm0dYKUx4 https://www.youtube.com/watch?v=1Hqm0dYKUx4
- ashmud 11y ago
  Thanks for this. I was unfamiliar with Henry Reich's videos.
TheOtherHobbes 11y ago
Two reasons: 1. Harmonic intervals in 12TET are good enough to sound okay with no obvious sour notes. 2. Hand and finger size. Factors and primes aren't the issue - it's how closely the octave divisions approximate perfect whole-number interval ratios. 12TET hits the sweet spot. The tuning is close enough for practical keyboard and fretted instruments to cover a wide pitch range but still fit human hand and finger sizes. So they're not impossibly difficult to make, tune, and learn, but you can still make complicated music on them. Finer subdivisions like 19TET - or more - are closer still to the ratios, but you need computers and electronics to make practical instruments. Or highly skilled string players: https://www.youtube.com/watch?v=MPHLS5mJrJk https://www.youtube.com/watch?v=MPHLS5mJrJk
dfan 11y ago
With an equal-tempered n-tone scale, two pitches that are x units apart have a frequency ratio of 2^(x/n). "Nice-sounding" intervals have small integer frequency ratios. It so happens that 3/2 = 1.5 is very close to 2^(7/12) = 1.498, 4/3 = 1.333 is very close to 2^(5/12) = 1.335, and 5/4 = 1.25 is very close to 2^(4/12) = 1.260. So 12 works very well as the number of pitches to divide an octave into. The fact that 12 is highly divisible is handy for certain aspects of music composition. For example, if you have a diminished seventh chord, which consists of every third pitch, due to its symmetry you can think of it as being in any of four different keys. So it is easy to use it to pivot from one key to another. But none of that has to do with the reasons that it sounds good.
s-phi-nl 11y ago
There are some mathematical reasons. In particular, the two most consonant (best-sounding) intervals are the octave and the fifth. The frequencies of the two pitches in an octave have a ratio of 2.0, and the frequencies of the two pitches in a pure fifth have a ratio of 1.5. We would like the pitches we obtain from powers of these two ratios (stacking these intervals on top of each other) to be the same. However, since the integers are a unique factorization domain, they will never be (except for 2^0 = 1 = 1.5^0, of course). [1] Thus, we pick powers of the two that are 'close enough' and call those the same pitch. The following Python (3) code subtracts the log-base-two of the powers of 1.5 from the integer they round to in order to find the closest ones: from math import log fifth = log(3/2, 2.0) print(0, 0.0) minDist = 0.08 for i in range(1,100): pow = i* fifth; dist = abs(pow - round(pow)) if dist < minDist: minDist = dist print(i, pow, dist) This has output: 0 0.0 5 2.924812503605781 0.07518749639421918 12 7.019550008653875 0.019550008653874684 41 23.983462529567404 0.01653747043259557 53 31.003012538221277 0.003012538221277339 From this, you can see that 12 is the closest that the powers of 2.0 and of 1.5 come being equal until 41. This is a primary reason why we use a chromatic scale with 12 notes. (As an aside, a scale with 5 notes is also common around the world, called the pentatonic scale [2]) [1] For an explanation of this, see http://blogs.scientificamerican.com/roots-of-unity/the-saddest-thing-i-know-about-the-integers/ http://blogs.scientificamerican.com/roots-of-unity/the-sadde... [2] https://en.wikipedia.org/wiki/Pentatonic_scale https://en.wikipedia.org/wiki/Pentatonic_scale
- voynich61 11y ago
  This is a great explanation. To add onto this, I would imagine a lot of non-musicians would wonder whether there's a good reason for equal temperament, as most songs in every genre utilize it instead of more consonant scales (e.g., just intonation). There are two main reasons. The first is a matter of switching between scales, as in, many songs will modulate to out-of-scale-but-mathematically-related chords. As 12TET has each scale using the same notes, one doesn't have to tiptoe around shared notes which are 'slightly' off. The second is pure convenience: using a set of notes for each key (or pushing the root note a few Hz up or down) would be a laborious process. With that being said, an interesting direction some electronic producers take is to experiment with scales, given how ubiquitous waveforms with integer harmonics are. Here's an example from Richard D James: https://youtu.be/pTn1tmhA8L8 https://youtu.be/pTn1tmhA8L8
Intermernet 11y ago
There's a great description here: http://www.math.uwaterloo.ca/~mrubinst/tuning/12.html http://www.math.uwaterloo.ca/~mrubinst/tuning/12.html It's too in-depth to summarize, but worth a read.
nirajshr 11y ago
If you have time, this is an excellent article that describes where the "12" comes from and the derivation of the chromatic scale and just intonation scales. http://arxiv.org/html/1202.4212v1 http://arxiv.org/html/1202.4212v1
abruzzi 11y ago
12 tone is a historical scale. Initially (Pythagoras) the scale was based on perfect fifths. Over time the notes in between the diatonic scale note were added. Tuning started becoming a big deal because if you tune all your fifths to be perfect, some intervals outside of the scale got really weird. Equal temperament was the compromise solution. Instead of tuning perfect fifths, you just make every half step the same. That means that your other intervals are all out of tune, but it is small enough that you don't have some keys that are horrible. Bach's 24 preludes and fugues (in each major and minor key) was partly a demonstration of a similar tuning system--well tempered, also known as Werkmeister. Other music traditions such as indian classical/raga, use different tunings. I'll also add that the all-key tunings like equal and well tempered are hugely important for the development of music from back to today, its not mere esoterica. Look at something like a late Beethoven piano sonata. In the course of a single piece, it may modulate a hundred times through a half dozen keys. The development of all key tunings, while they made 5ths worse, made it possible for a pieces of music on a fixed tuning instrument like a piano to range through any key, and that was huge to the development of music.

bobajeff 11y ago

I tried this on my phone (via Chrome for Android). The keys didn't do anything when I pressed them.

moron4hire 11y ago
If you just want to play around, I wrote a keyboard that works in Chrome as well as Firefox on Android back in November. http://s.codepen.io/SeanMcBeth/debug/meaQvj http://s.codepen.io/SeanMcBeth/debug/meaQvj

grncdr 11y ago

Very cool. You might consider adding a short (a few ms is enough) fade in/out when toggling notes to avoid clickiness.

Kristine1975 11y ago
A few samples is enough, actually. Just enough to prevent the sudden change from high to low, which is what causes the click. You don't even need to compute new samples. Merely repeat the last sample while lowering its volume until you reach zero.

mattmanser 11y ago

There's a bug where if you mouse down and move the mouse out, the note plays indefinitely.

abruzzi 11y ago
is that a bug? I was using that to hear chord, until I got to the bottom and saw I can also do it with my keyboard.
- kencausey 11y ago
  I agree, seemed like a feature to me.

ableal 11y ago

Another interesting page in the site: https://academo.org/demos/perlin-noise/ https://academo.org/demos/perlin-noise/ Made me look it up: https://en.wikipedia.org/wiki/Perlin_noise https://en.wikipedia.org/wiki/Perlin_noise Smooth.

jarmitage 11y ago

This library and web audio demo has 3000+ tuning systems: https://github.com/abbernie/tune https://github.com/abbernie/tune It's part of the proceedings of the 2nd Web Audio conference which are now available: Abstract: https://smartech.gatech.edu/handle/1853/54580 https://smartech.gatech.edu/handle/1853/54580 Proceedings: https://smartech.gatech.edu/handle/1853/54577/browse https://smartech.gatech.edu/handle/1853/54577/browse

6stringmerc 11y ago

Very clever and quite fun to poke around in, and educational with the whole math breakdown. Nicely done and glad to be able to play around with it. I'm tickled by the opportunities to play around with customary tones! Z-R-V-Z-R-B-Z-R-N-Z-R-B-Z-R-V is a nifty little arrangement.

hatsunearu 11y ago

The tones in the piano don't have a lot of harmonic content (at least what I can hear from my ears), and if there are more harmonics the beating of the harmonics can be more easily heard. Just a suggestion.