タグ

Web Audio APIに関するkabochaoのブックマーク (13)

  • WebAudio Drum Machine

    Save a Beat For security reasons, web browsers don't make it easy to save files directly to your hard drive. But to save your beat just copy and paste the data block below into a text file. To load the beat later click the Load button then paste the data block from your text file into the blank window.

  • Web Audio Drum Loops

  • Web Music Documentation

    Web Music とは, Web (ブラウザ) をプラットフォームにした音楽アプリケーション, あるいは, そのような Web アプリケーションを実装するために必要となる, クライアントサイドの JavaScript API の総称です. これは, 一般的な技術用語ではなく, ある種の技術マーケティング的な造語です. 具体的には, 以下のような, クライアントサイド JavaScript API の総称です. Web Audio API HTMLMediaElement (HTMLAudioElement) WebRTC Web MIDI API WebCodecs API Web Audio API, HTMLMediaElement, WebRTC に関しては, サイト制作開始時点の 2023 年時点で W3C recommendation となっており, モダンブラウザであれば利

    Web Music Documentation
  • Web Audio API 解説 - 01.前説 | g200kg Music & Software

    : サイト内検索 トップ 製品 KnobMan 偏ったDTM用語辞典 過去記事一覧 ソフトウェア/VST WebMusic その他 g200kg > Web Audio API 解説 > 01.前説 Web Audio API 解説 2019/01/1901.前説 « Prev 01.前説 02.とりあえず音を出す 03.オシレーターの使い方 04.ノードの接続 05.ノードのライフタイム 06.バッファソースでワンショットサンプルから音を出す 07.パラメータとオートメーション 08.a-rateパラメーターとk-rateパラメーター 09.スクリプトプロセッサーの使い方 10.フィルターの使い方 11.オシレーターのカスタム波形 12.アナライザーの使い方 13.ディレイの使い方 14.ウェイブシェイパーの使い方 15.コンプレッサーの使い方 16.コンボルバーの使い方 17.パンナー

    Web Audio API 解説 - 01.前説 | g200kg Music & Software
  • Web Audio でマトリックスシーケンサーを作ってみた - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) 今回のお題は「マトリックスシーケンサー」。 昔Flashで実装された物があったのをふと思い出し、今ならWeb Audio APIで作れそう!と思って作ってみました。 きっと同じ事考えて作って見た人はいるはず。 マトリックスシーケンサーとは マトリックスシーケンサーとは、整列配置されたボタンをトグルしてループミュージックを奏でる事ができるシーケンサーです。 多くの場合縦軸が音階を、横軸がフレーム(時間)を表し、 左から右にフレームが移動してONにされたボタンに割り当てられた音が鳴る仕組みです。 縦軸の「音」はスケール(調)に則って配置されているので、 相当いい加減にやってもまともな演奏になってしまう所がマトリックスシーケンサーの魅力の一つです。 ハードで知られているのがYAMAHAの「TENORI-ON」ですが現在は生産完了品で、

    Web Audio でマトリックスシーケンサーを作ってみた - Mach3.laBlog
  • Web Audio API の Oscillator で楽器を作りたい話 - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) 横浜で行われたHTML5飯でWeb Audio APIでモールス信号を表現してみる話をさせて頂いたのが今月頭の話。 その際に「Oscillator使えばよい」というアドバイスを頂いたので調べてみたところ、 「これで楽器をつくってみたい」と思って試してみた話を Yokohama.js でしゃべらせていただきました。 Oscillator で楽器を作りたい! こちらが当日の資料です。ざっくり言うと… Oscillator はオシレーターであってオスシレーターではない Oscillator は周波数・デチューン・波形をいじることでいろんな音になる 作ってみた物の紹介・デモ といった内容をお話しました。 作ってみたデモ(Oscy.js) そして作ってみたデモがこちら。 触ると音が出るのでご注意ください。 Oscy.js (http://

    Web Audio API の Oscillator で楽器を作りたい話 - Mach3.laBlog
  • HTML5 の Web Audio API で音楽してみる | CYOKODOG

    HTML5 の Web Audio API の存在をご存知でしょうか? 購読してる専門誌でも紹介されてるのを見かけた記憶がなかったのでよく知らなかったのですが、検索してみると興味深い記事が結構目につきます。 CANVAS や WebGL など見た目系機能が注目されがちな HTML5 ですが、音声方面も面白いかなという事で、今回調べたことをまとめがてら紹介してみたいと思います。 モジュラールーティング Web Audio API を扱う上で「モジュラールーティング」という思想の理解が大事になります。 簡単に言うと「音の発生源」「音の加工」「音の出力」をモジュール単位で管理し、それらをお好みのパターンで接続しあい音を出力させることができます。 楽器で例えると、エレキギター → エフェクター → アンプの接続のような関係です。例えばエフェクターを使いたくなければ直接アンプに繋いでも良いですし、エ

  • Learn web development  |  web.dev

    Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.

    Learn web development  |  web.dev
  • Getting started with Web Audio API  |  Articles  |  web.dev

    Getting started with Web Audio API Stay organized with collections Save and categorize content based on your preferences. Before the HTML5 <audio> element, Flash or another plugin was required to break the silence of the web. While audio on the web no longer requires a plugin, the audio tag brings significant limitations for implementing sophisticated games and interactive applications. The Web Au

    Getting started with Web Audio API  |  Articles  |  web.dev
  • 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 は多機能なんだけど、部品が細かすぎて使いこな

    neume.js - library for web audio programming - 音の鳴るブログ
  • Web Audio

    Ring Visualizer By Felix Turner is a fantastic WebGL visualizer. Have fun interacting using the mouse and scrollwheel. WebGL City By alteredqualia, Nick Royer, nofeedbak, and Erik McClure. Enjoy this rich 3D environment. To hear the spatialized helicopter, disable the music track "m", and enable the helicopter "n".

  • http://mdn.github.io/audio-buffer/

  • Web Audio API の使用 - Web API | MDN

    Web Audio API の入門を見てみましょう。ここではいくつかの概念を短く確認してから、簡単な boombox の例で、音声トラックの読み込み、再生と一時停止、音量やステレオ位置の変更の方法を学びましょう。 Web Audio API は <audio> メディア要素を置き換えるものではなく、むしろその機能を補完するものであり、 <canvas> が <img> 要素と並行して存在するのと似ています。どちらを利用するかは、その目的によります。音声トラックの再生を制御したいだけであれば、 <audio> メディア要素の方がよりよく、 Web Audio API よりも早く解決できるでしょう。再生だけでなくもっと複雑な音声処理が必要であれば、 Web Audio API ははるかに強力な制御を行うことができます。 Web Audio API の強力な要素の一つは、厳格な「音声の呼び出しの

    Web Audio API の使用 - Web API | MDN
  • 1