ディレイタイムの計算に使える!テンポに応じた音符の長さを判定するウェブツールを作りました【Delay Time Calculator】

投稿日:2020-12-13



ナカジ(@cp_nakajun)です。

前回のMIDIナンバーから音名と周波数を判定するツールに続いて

MIDIナンバーから音名と周波数を判定するウェブツールを作りました【Midi Number Tools】



テンポに応じた音符の長さを判定するウェブツールを作りました。

ディレイタイムの計算などに使ってもらえたらと思います。

これも結局「装飾」したくなりましてp5.jsでシンプルにビジュアライズしてみました。

簡単な紹介記事とさせていただきます。

Delay Time Calculator

ツールのURLは

です。

描画は前回と同じく「p5.js」でおこなってますが
ディレイ音のリファレンス、「音」の部分は「Tone.js」にしました。

「p5.sound」も「Tone.js」もシンプルなディレイのデフォルト最大ディレイタイムが1秒(1000m/s)のようで

その解決の仕方を見つけられたのが「Tone.js」だったのが単純な理由です…

使い方

  1. テンポを設定します(BPM)

「Setting」のところでテンポを指定するとリアルタイムで音符の長さを表示します。

各音符の右側にある「reference」ボタンを押すと

  • ディレイタイムとして設定された「音」が鳴る
  • 音に合わせて円が描画される(6回)

ます。

特に凝った「装飾」ではありませんが、遊んでもらえたら嬉しいです。

学習にオススメ


・【NFTアート × Python】全くの初心者でもできるジェネラティブNFTの作成から出品まで icon

・【P5.js】プログラミングと数学(物理)を使って遊んでみよう【初心者向け】【わかりやすさ重視】 icon

・改訂版プログラミングで科学を学ぼう! icon

・【JS】ガチで学びたい人のためのJavaScriptメカニズム icon





おすすめのクリエイティブ・コーディング関連カテゴリー


ウェブツール

機能はシンプルなものですが、p5.jsやTone.jsで描画したり音が出たりするので遊んでみてください。
・【Midi Number Tools】:MIDIナンバーから音名と周波数を判定します
・【Delay Time Calculator】:テンポに応じた音符の長さを判定します