AltEdu2022 Day4の解説記事

Day4以降はNoteに記載します。

今日のテーマは文字を使ったグラフィック を作成してください。文字を示す内容とグラフィックが近づくように工夫してください。

今日はp5.jsとWeb Audio APIでSound Visualizationとサウンドビジュアライゼーションを作成しました。Sound Visualizationという文字の大きさが音に合わせて変化するものです。

実装した成果物は以下にあります。

ArtOFCode/Festival/Year2022/AltEdu2022/day4 at main · HosodaMath/ArtOFCode

デモは以下にあります。

Vite App

p5.jsの標準にあるオーディオ関数を使っていないためソースコードの桁数が大きくなりました、しかしサウンド周りで複雑なことをするにはWeb Audio APIの習得は必須だと思うのでかなり仕様書を読んで実装するとかなり勉強になります。

本日は以上です。