Processingで音楽に合わせて円を描画した

前回、Unicessingを触ったのでせっかくなので、Processingを触ってみた。ジェネラティブアートをつくるというよりは、個人的にはメディアに関連さえせて使いたいなーと思ってたところ、けそうだったのでためしてみた。

今回つくったもの

www.youtube.com
www.youtube.com

アイネクライネのPVが好きすぎて、この気持ちをなんとか表現したいなーと思っていたところ、Processingを勉強する中で高速フーリエ変換の使い方を学んだので、これを使ってアイネクライネのPVとProcessingをMIXしてみた。
※ほんとうは、アイネクライネの音楽をインプットにしていろいろやっていたのですが、著作権的にあげちゃ駄目なんじゃ・・・と思いPVと作品を別々であげました。ぜひ2つの動画を同じタイミングで再生してみてほしいです。

使用した環境

• Processing 3.3.7

書いたコード

github.com

読んだ本

Processing クリエイティブ・コーディング入門 - コードが生み出す創造表現

この本でProcessingで何ができるか基礎的なことを学んだ。他の本を読んでないけど、自分の作品を作れるくらいの基礎は学べたと思う。3Dの情報が少なかったけど、調べればなんとかなると信じてる

[普及版]ジェネラティブ・アート―Processingによる実践ガイド

電車の中で5分で睡魔に負けた本。他の人のレビューだとジェネラティブアートにおける聖書のような存在らしいので、ちゃんと読んでおきたい。

Processingで書いた処理

• 音源を読み込む処理
• 画像を表示する処理
• FFTによるスペクトラム解析とその値をインプットにした半径の計算

今回、音源を読み込む処理はProcessingのSoundライブラリをインポートして実装。画像の読み込みもPImageクラスを使用して描画した。今回はスペクトラムを2000倍ほどした値を半径にして、さらにその値に左の円はrandomで0.3 - 0.7 、右の円はrandom で 0.4 - 0.6 をかけている。これは、左右対象だと面白みがないのですこし値を変えて円の直径に差を出すようにしている。

着想としては、アイネクライネのPVにでてくる男性が左の円で女性が右の円。アイネクライネのPVだと悲しんでいる女性の前に男性が現れているので、男性側は温かみのある色にしたかったのと、女性はすごく純粋な感じがしたので白っぽくなるように調整した。自分がやってるのはジェネラティブアートとは違うと思うので、この【調整】というのが大事になってくるのかなと思った。

感想

音楽のビジュアライズってすごく面白い。音楽に合わせた動画をつくるのもいいけど、本当に音楽の音色をビジュアライズできたら音楽＋別の表現でMVの良さがもっと出せるんじゃないかなーと思った。調べてたらデータのビジュアライズ化とかもあったので、これも試してみたい。