音を操るWeb技術 - Web Audio API入門 - ICS MEDIA
Webにおける表現はどんどん進化しています。Webサイトには当然のように動画が埋め込まれるようになり、CSSやSVG、canvasでのさまざまな表現が頻繁に見られるようになりました。さらにAR、VRといった表現も台頭し筆者も毎日ワクワクしながらインターネットの海を泳いでいます。 その中であまりメジャーではないと感じるのは「音」による表現です。もちろん音を用いた素晴らしいWebサイトはたくさんありますが、環境の制約が視覚表現以上に大きいため多くは見られないのでしょう。 とはいえ、音と視覚表現を組み合わせることによって表現できる世界観、インタラクション、その他諸々は計り知れないと筆者は思っています。今後オーディオなどの技術の進歩によって上記で述べた制約も乗り越えられるようになるかもしれません。時代を先どりしたい読者に向けて、今回の記事ではWebで音を扱う技術Web Audio APIについてお
Reactでシンセサイザーを作った話 - Speee DEVELOPER BLOG
こんにちは、nishayaです。 管理部のエンジニアとして、社内向けのシステムを作ったり、 社内で開催されるイベントでコーヒーを淹れたりしています。 社内向けだからこそできる冒険もある、ということで、 現在はReact/Reduxを用いたSPA開発を行っています。 今回のSpeeeKaigi(下記の記事を参照)では、 ReactとReduxを使ってシンセサイザーを作る話をしました。 tech.speee.jp 発表資料 使用したもの React Redux Web MIDI API Web Audio API Web MIDI APIを使用しているため、今回のターゲットブラウザはGoogle Chromeのみとしました。 そのため、webkit プレフィクス付きのAudioContextにも対応していません。 モチベーション 業務でSPA開発にReact/Reduxを使用するという決定をし
WebMusicハッカソンで使えそうな俺俺ライブラリ 5選 - 音の鳴るブログ
7月25日に WebMusicハッカソン #4 @kyoto というのがあるのですが、ちょうど良い機会なので僕が作ったウェブ音楽用簡単超絶便利ライブラリを紹介したいと思います。 WEB AUDIO SCHEDULER 2 つの時計のお話 - Web Audio の正確なスケジューリングについて - HTML5 Rocks Web Audio で必須な割に難しいのがスケジュール管理で、いちおう上の記事のやり方が推奨なのですが、そのままやるとかなり面倒くさい。のだけど、このライブラリを使うと面倒な部分は気にせず、いつ何をしたいのかを書くだけで良くなる。以下は簡単なメトロノームの例。 var gcguard = []; var audioContext = new AudioContext(); var scheduler = new WebAudioScheduler({ context: a
neume.js - library for web audio programming - 音の鳴るブログ
またか。と言われてしまいそうだけど、またウェブ楽器プログラミング用のライブラリを作った。 以前に timbre.js というライブラリを作ったのだけど、それの刷新版という感じです。 デモ ドキュメント 名前の由来 特徴1: 機能性よりパフォーマンスを重視 以前は多くの動作環境をサポートするためにすべての信号処理を JavaScript で書いていたのですが、それゆえにパフォーマンスに問題があって(Issueでよく指摘された)、neume.js では IE や node.js での動作を諦めて Web Audio API の機能を大活用することでパフォーマンス問題を解決しました。デモでは three.js や gretro と一緒に動作する様子が確認できます。 特徴2: Web Audio API の面倒な部分を抽象化 Web Audio API は多機能なんだけど、部品が細かすぎて使いこな
JavaScriptだけでMIDIで遊べる！最高に乱暴なWeb MIDI API利用方法 - Qiita
JavaScriptだけでMIDIで遊べる！最高に乱暴なWeb MIDI API利用方法 Web MIDI API / Web Audio APIを使ったハッカソンイベント「Web Music ハッカソン #3」が近づいていますので、ここでWeb MIDI APIの使い方を振り返ってみましょう。 はじめに断っておきますが、これは 乱暴者による乱暴者向けの記事です。 最低限の手間で、Web MIDI APIに対応してる気分を味わう までを目指します。 [2015/02/08 追記] さらに手間をかけたくないという超絶手抜きな人（ワシです）向けに、アホみたいなラッパー(poormidi.js)作りました。 使い方 良かったら使ってみてください。 ちゃんと勉強したい方は、下記リンクを見てください。 ちゃんと勉強したい方向けリンク集 Web MIDI API (W3C) Web MIDI APIの
Web MIDI API Wrapper 公開したよ^^ (1)
2013年7月1日にChrome CanaryにMIDI InputがやってきたWeb MIDI API。そろそろOutputも来るはずですが、今のところ Jazz-Plugin をインストールして Web MIDI API Shim を使って動かします^^ でも「MIDIって難しいんでしょ？」という声が聞こえて聞こえてきそうなので、聞こえてくる前にWrapperなるものを作ってみました。 Web MIDI API Wrapper Wrapperの話に入る前に「MIDIってなんぞ？」ってところを少し書きます。一言で言うと「メーカの枠を超え、電子楽器と電子楽器を接続する為のプロトコル」なんです。歴史は30年前のNAMM Show(National Association of Music Merchants Show)という楽器の見本市でお披露目され(今年はちょうど30周年に加えテクニカルグ
VSTプラグイン作家のためのWeb Audio API入門 〜 adelayの作成 - aike’s blog
全国100人くらいのVSTプラグイン作家の方こんばんは。今日は皆さんおなじみのadelayのウェブブラウザバージョンを作ってみたいと思います。最近のウェブブラウザはAudio APIが急速に充実してきて簡単に音声信号処理ができるようになってきました。 adelayといえばVST 2.X SDKのサンプルコードとして大変なじみ深く、こんなシンプルなコードであのディレイが作れてしまうのかというインパクトもあり、プラグイン作家であればアルゴリズムをそらで暗唱できるくらい体に染み付いているかと思います。（←大げさ） 一方、Web Audio APIで用意されているDelayNodeは単に入力信号を遅延させて再生するものでDry/Wetのバランス設定やFeedbackもありません。ディレイプログラムはGainNodeなどと組み合わせて作ることが想定されているものと思いますが入門者が学習するにはちょっ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web Audio APIでMIDIファイル再生