画像から音楽の自動生成

【追記】スマホでも生成した曲が聞けるようにしました。

#はじめに

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr"><a href="https://t.co/KrOyDseJi9">https://t.co/KrOyDseJi9</a><br>画像からMIDI譜面の自動生成ツールを作ってみた。<a href="https://t.co/oc0x2IJWTh">https://t.co/oc0x2IJWTh</a></p>&mdash; a2kiti (@a2kiti) <a href="https://twitter.com/a2kiti/status/1102591686616608769?ref_src=twsrc%5Etfw">2019年3月4日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


まず一点。
毎日のようにAIや人工知能と言った言葉を目にするこのご時世に「画像から音楽の自動生成」なんて言うと，
ニューラルネットワークによって画像から情景や人物の感情を推定してRNNによってうんたらかんたら，，，
みたいな話に聞こえますが，そんな大層なことはしていません。

先週，「世界地図を楽譜にした」というツイートを目にしました。

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">世界地図を楽譜にした結果<br><br>これずけぇー！！！😳✨ <a href="https://t.co/9mV9OMug6q">pic.twitter.com/9mV9OMug6q</a></p>&mdash; Ag さん (@ag_sns) <a href="https://twitter.com/ag_sns/status/993470703008497665?ref_src=twsrc%5Etfw">2018年5月7日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

これは元は海外の人が上げている動画のようですが，ちゃんと曲になっていてすげーと思いました。
くわしくはありませんが，絵になっている楽譜というのはかなり昔から作られているようです。

自分でも何か絵になっている楽譜作ってみたいと思ったので，プログラムの勉強も兼ねて任意の画像から自動で楽譜を生成できるようにしてみました。
やることは単純ですが，ただの音符の羅列では全然曲っぽくならないため色々試行錯誤してみた結果です。

#画像の準備
画像中の画素を音符に変換してくことで楽譜を作ります。当然すべての画素を使うわけにはいかないので，楽譜をみて絵になるように線画に変換します。線画にするにはエッジを抽出する必要がありますが，これは様々な方法がありここではCanny法を用いました。
https://qiita.com/supersaiakujin/items/494cc16836738b5394c8


せっかくなので世界地図の画像を用います。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/201397/158517f2-81d2-6a9f-4aeb-2d8881226406.png)


変換後はこのようになります。ここで縦の画素数が88個になるように縮小したものを拡大しています。
これはMIDIの音階の数にするためです。MIDIの音階は128段階ありますが，一般的なピアノの音階を考え88としました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/201397/6e32b159-98f4-b94d-dbe6-44f377b15c82.png)

このように線画化した画像を使っていきます。

#画素をMIDIの音階に単純に変換
出来た線画の白い画素を単純にMIDIの楽譜にするとこのようになります。
![test_pianorollImage.jpg](https://qiita-image-store.s3.amazonaws.com/0/201397/1f8792d1-406a-96c2-ba5a-917051cb35a3.jpeg)

<iframe width="100%" height="300" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/443466696&color=%23ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true&visual=true"></iframe>

https://soundcloud.com/a2kiti/simple

不要和音だらけで気持ち悪いですね.
前衛音楽のように聞こえなくもないですが，まともに聞きたいとは思えません。

#ドレミファソラシに当てはめてみる
音符には「ド，ド＃，レ，レ＃，ミ，ファ，ファ＃，ソ，ソ＃，ラ，ラ＃，シ」の12種類があります。
しかし曲にはキーと言うものがあり，C長だと基本的にはドレミファソラシだけを使います。（だけではないけど）
それ以外の＃が付いた音階を使うと不協和音に聞こえてしまいます。
そこでドレミファソラシだけに音符を当てはめてみます。

![test_pianorollImage.jpg](https://qiita-image-store.s3.amazonaws.com/0/201397/290ba572-fa1d-a4b0-f0d3-197042327f43.jpeg)

<iframe width="100%" height="300" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/443473677&color=%23ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true&visual=true"></iframe>

https://soundcloud.com/a2kiti/scaleonly

不協和音は消え，ところどころメロディーっっぽくなっている気はします。
でも音が連続してなり続けて出た目めにしか聞こえませんね。

#コード進行を当てはめてみる
曲にはコード進行があります。
詳しくは書きませんが，曲の雰囲気の流れを決めているものです。
横の画素16個を1小節として，あるコードの小節ではそのコードの音を中心的に使うようにしました。
コード進行はカノン進行と呼ばれる「C,G,Am,Em,F,C,F,G」にしています。

![test_pianorollImage.jpg](https://qiita-image-store.s3.amazonaws.com/0/201397/bcf9beac-aa25-eda3-dbd6-ed08411509f8.jpeg)

<iframe width="100%" height="300" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/443468985&color=%23ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true&visual=true"></iframe>

https://soundcloud.com/a2kiti/chord

なんとなく曲っぽくなってきた気がします。
でも音が連続してせわしなく動いているのでなんか疲れます。

#リズムを考慮する
そこで最後にリズムを考慮して音符を配置します。
単純にランダムに音符を省いていくようでは結局デタラメになってしまいます。
そこで制限条件をつけた上でランダムに配置していきます。
音楽は繰り返しが大事なようです。同じような聞こえ方が繰り返されることで安心感が生まれ心地よく聞こえるようです。
そこで前の小説のリズムと似たような感じになるように確率の分布を設定して配置してみました。また小節の頭や表の泊では音がなりやすいようにもしています。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/201397/a8e4807e-d215-c0aa-8653-4000ccee4ef0.png)


<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr"><a href="https://t.co/lAwXc135uq">https://t.co/lAwXc135uq</a> <br>画像からMIDI譜面の自動生成ツールを作ってみた。<a href="https://t.co/LCUaA20HdG">https://t.co/LCUaA20HdG</a></p>&mdash; a2kiti (@a2kiti) <a href="https://twitter.com/a2kiti/status/995504391644835840?ref_src=twsrc%5Etfw">2018年5月13日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

どうでしょう？
かなり曲っぽくなったのではないでしょうか。

#まとめ
音楽の自動生成において曲っぽくさせるためには，音階・コード進行・リズムが重要な事がわかりました。
しかし，音楽的にきれいにするためにいろんな制限をかけて配置していくと，画素の配置がどんどんずれていくので，元の画像から離れていってしまうため(例では最終的に日本がぐちゃぐちゃに。。。），ある意味，画像的な綺麗さと音楽的な綺麗さはトレードオフになるようです。（もっとうまいことする方法があるかもしれません）

せっかくなのでWEBサービスとして公開してみました。
http://image2midi.a2kiti.com/

動画で最後の方に紹介しているように，ピカチュウなどすきな画像で試すことができるのでよかったら試してみてください。
もしいい感じの曲ができたら教えてほしいです。