YMO Giga CapsuleのビューワをElectronで作ってみている(8)

公開:2015-10-13 21:22
更新:2020-02-15 04:37
カテゴリ:electron,音楽・動画,javascript,html5,ymo,gigacapsule viewerを作る,d3.js

昨日からRemix部分を作り始めている。今のところはフェーダーが7個並んでいるだけというさみしい画面である。

https://68.media.tumblr.com/e2070562e394efd09d0568347024faef/tumblr_nw5qpsaO8p1s44dwzo1_1280.png

このRemix機能というのは「Behind The Mask」「Rydeen」「Solid State Survivor」「Technopolis」「Tong Poo」の5曲のうちから1曲選んで、その曲の各トラックのミュート・音量をコントロールしてミックスできるというものだ。マルチトラックレコーダーは24chだったからそれぞれのトラックをミキシングできればすごくうれしいのだが、残念ながら7トラックにまとめられている。まあそれでも結構すごいことなのだ。ドラムはコンプとかがかかっていない素の音が入っていたりして、それがまたうれしかったりする。

今のところ、トラックデータを取り込んでミックスできるようにはなった。Web Audioにはディレイやコンプ、リバーブ、パンもあるのでそれを使うと結構面白いことができそうだ。ただ音源データの取り込みにすごく時間がかかる。BufferからArrayBufferへ変換して、さらにデコードするから1トラックあたり数秒程度かかってしまう。これを何とかしたいが。

ちょっと思ったのはNative Moduleを作ってVSTをつなげるようにしたりとか、WASAPIで出力できるようにしたりすると楽しいだろうなぁと思ったけど、私にはちょっと無理かなぁ。。

フェーダー(Slider)はd3.jsのBrushというのを使って作った。コードは下記のサンプルほぼそのままだが。

https://bl.ocks.org/mbostock/6452972#index.html

問題は複数のフェーダーをマルチタッチで同時に操作しようとしてもできないところ。フェーダーは作り直す必要があるかもしれない。