yoppa.org


芸大 – メディアアート・プログラミング I 2021

p5.js Libraryを使う – p5.soundでサウンドプログラミング 2

今回も前回に引き続きp5.soundを使用したサウンドプログラミングを行います。今回は、前回最後に紹介した波形の二乗平均平方根 (Root mean square, RMS) によるサウンドの解析の手法をさらに発展させて、FFTによるサウンドのビジュアライズに挑戦します。FFTクラスを使用すると、音に含まれる周波数成分をリアルタイムに解析することが可能となります。この機能を使うことで、音の周波数成分を可視化して「音を視る」ことが可能となります。今回は、Soundライブラリーを用いたサウンドファイルの再生から、FFTを使用した音のビジュアライズまでを順番に解説していきます。FFTによって分析されたスペクトルの情報を、色や大きさに変換することで、音を様々な手法で視覚化していきます。

映像資料

スライド資料

本日の課題

本日の映像資料を参考に、FFTを用いてサウンドを視覚的に表現してください。いつものようにOpenProcessingに作成し下記の投稿フォームからURLを提出してください。

投稿フォーム

サンプルコード

周波数を対数軸でFFTをグラフ化 (画面クリックで再生開始)

色の濃度でFFTをビジュアライズ

色相で色を変化させて、左右対称に

円の大きさでビジュアライズ

応用: 回転するパーティクル

応用: 飛び散るパーティクル