スプーキーズのちょっとTech。

SPOOKIES社内のより技工的な、専門的なブログページです。

Web Audio APIを用いた自動作曲

こんにちは、ロックです!

今回は先々週ぐらいに社内で行った勉強会の内容となります。

ブログを書く手番が回ってきたので、書いていきたいと思います。

概要

  • 日頃からの思いとして、音楽に携わるプログラミングも興味があった
  • 最近AIがブーム

ということで、プログラミングを通じて作曲できないかな?

さらにAIブームに乗って、作曲の自動化とか行けそうではないだろうか。

何を使って実現する?

普段の趣味ではC言語なので、C言語ベースでやろうと思いましたが、

Webで簡単に音を出せるらしいので、そちらで実現していきます。

Web Audio API

HTML5 で音関連も強化されているようです。

ノード同士を繋げていく仕組み

仕組み解説(音量操作の例を通して)

1. 音を出す

音の発生源(node)出力(node) に繋げた(connect)状態で再生(start)を行うと音が聞こえてくる。

f:id:ishiyamacocoa:20170919164857p:plain

2. 音量を調整してみる

音量(node)を間に挟むことで音量を調節できる。

f:id:ishiyamacocoa:20170919164901p:plain

3. 複数音を鳴らしたい!

新しい音の発生源2(node)音量(node)に繋げればok

f:id:ishiyamacocoa:20170919164905p:plain

4. 音の発生源1だけ少し音量を上げたいなあ

音の発生源ごとに音量(node)を作り、全体音量(node)と繋げるようにするとok

マスターボリュームと個別のボリューム!!

f:id:ishiyamacocoa:20170919164909p:plain

以上のようにノードを繋げていく。

音の発生源から出力の間にいろいろ挟むことで楽しくなる。

音程を求める

440Hzが世界標準でラ(A)の音

※例えばドの音は262Hz

周波数を求める式として MIDI tuning standard というもの存在する

2note_number - 69/12・440Hz

※note_number = MIDI のノート番号(0 ~ 127)

ノート番号で言うと、69が440Hzのラ(A)の音である

参考URL :MIDIノート番号と音名、周波数の対応表

無限に鳴らす

音も出せるようになり、音程も操れるようになったので、無限に鳴らせれば任務完了です。

今回は javascript を使っているので、 setInterval() でok

ちょっと音楽っぽくする

和音というものがあります。

いわゆる ドミソ

ピアノで言う左手(コード、ベース)

音楽といえばメロディもありますよね

ランランララランランラン♪

ピアノで言う右手(メロディ、コード)

和音

  • メジャーコード
  • マイナーコード

を選べるようにしておきました。

メジャーコードを選んだら全てメジャーコードに

マイナーコードを選んだら全てマイナーコードになります。

メロディ

和音は3つの音で構成されています(4つとかもあるが)

メロディはこの和音に出てくる音の3つのうちからランダムで流れるようにしてます。

これだけで案外メロディっぽくなるものなのです。

設定項目

  • スケール(今回は全て長調)
  • 和音(メジャーかマイナーを選べる)
  • オクターブ
  • BPM(3桁まで入力可能)

見た目

autoMusic_Image.png (4.3 kB)

実際のものがこちら

autoMusic.html (4.0 kB)

Webに公開する力がなかったので生ファイル。

DLしてブラウザで開くと見れる(はず)

展望

  • コード進行を考えるともっと音楽っぽくなる
  • 対応スケールを増やす
  • パーカッションとかを入れる(楽器を増やせるようにする)

反省

  • AI関係なくなってしまった(一晩でどうにかなるものでもなかった)

先日見かけた自動作曲記事

『Scalaで自動作曲の練習』を社内勉強会で話した - Sexually Knowing

参考サイト(Web Audio API)

Web Audio API - Web API インターフェイス | MDN

HTML5 の Web Audio API で音楽してみる | CYOKODOG

https://www.html5rocks.com/ja/tutorials/webaudio/intro/