Web Browser VJ

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/c252dd5b-c515-405a-9d08-dea81b2a6841/web-browser-vj-detail.gif

概要 / Overview


大学の研究会の個人制作で、GoogleChrome上でVJをできるものを作りました。研究室の最初の学期の課題として、「作品のコピーをする」というものがありまして、

直感的にSoundCloudをビジュアライズ! 指で音を独自に演出できる音楽ハック「Web Browser VJ」 #MusicHackDay | All Digital Music

の作品Web Browser VJを出来る限りコピーしました。

コピー元になったのは、音楽ハッカソン「Music Hack Day Tokyo 2014」でMasakazu Watanabeさん(VJ)が作った外部デバイスで音楽を制御するウェブアプリです。

MIDI コントローラー(nanoKONTROL2, nanoPAD2)と連携して音を出せたり映像を出せます。

また、マイクの音量を取得しSVG画像の不透明度を変えられます。

また、ブラウザ上で、音の加工(ゲイン、ハイパスフィルター、ローパスフィルター)が出来ます。

システム / System


・Web Audio API

音楽の読み込み、加工、解析

・Web MIDI API

音楽の再生、ビジュアライズの入力

・WebRTC

マイクの入力