Web Audio API の Oscillatorで、今度は音階を意識して奏でられる楽器をつくる

1. 2
Oscillator で
楽器をつくりたい！

2. 自己紹介
まっは
@mach3ss

3. 前回までのあらすじ
・Web Audio API の Oscillator で楽器をつくってみた
- http://mach3.github.com/oscy.js ( デモ）
- http://github.com/mach3/oscy.js（ リポジトリ）
・わりとフリーダムな感じ
・音階を意識して演奏とか無理（幼少からの訓練が必要）

4. 今回は、思い通りの音階で
弾けるやつをつくりたい

5. 音階をつけれるようにする
A B C
・インターフェースはピアノの鍵盤風の物を採用。
・ただ鍵盤をおして音階を奏でるのでは普通のシンセなので、
弦楽器のように中間音を出せるようにしたい。

6. 音階の変更のおさらい
周波数（frequency）を指定する事で、音階を変更する事ができる
var ctx = new AudioContext();
var osc = ctx.createOscillator();
var gain = ctx.createGain();
osc.frequency.value = 440; // A の音
osc.connect(gain);
gain.connect(ctx.destination);
osc.start(0);

7. どの音階が
どの周波数なのか？

8. 音階と周波数の関係
A0
220Hz
A1
A2
440Hz
880Hz オクターブ
オクターブ
（12 音）
（12 音）
・基本となる A の音が440Hz
・オクターブ（12 音）下がると1/2 の220Hz、上がると2 倍の880Hz になる
・あがるごとに2 の12 乗根（1.05946309436）が乗算されていく（via 知恵袋）
・初項440、公比1.05946309436 の等比数列になる

9. a n = ar n-1
つまりきっとこんなかんじ
周波数 = 440 * Math.pow(1.05946309436, n-1)

10. 実装してみよう

11. A B C D
・Canvas で鍵盤を描き、触ったポジ
ションによって周波数を切り替える
・鍵盤の中心がそのキーの音に合うよ
うにし、その周辺は中間音にする
A

12. やってみた結果
・むずかしい
・ちょっとキーの中心からずれると音痴に聞こえる
・訓練が必要（幼少からでなくてもよい）

13. おまけ
・iOS8 になっても、まだ接頭辞をつけなければいけない模様。
（ webkitAudioContext）
・ iOS8 になっても、やっぱりユーザーアクション（タッチイベント
等）を起点にしないと音を鳴らせない模様。

14. ご清聴ありがとうございました。