OBSとWeb Audio APIを使って音に合わせてオーディオスペクトラムをWebカメラ映像に重ねて配信する - stefafafan の fa は3つです
大したネタでもないですが、この前ふとこれやりたいなと思ってできたのでついでにブログに書いてみます。 DJ配信 みなさんやってますよね。え、やってない？ではいますぐDJ機材買いましょう。 それはそうと、昨今STAY HOMEの影響でDJの人もどうやらクラブでイベント全然できなくなって、仕方ないからDJ配信するか～とTwitchなどで盛り上がってるようです。 僕はただのインドア系のWebアプリケーションエンジニアなので、DJなんてパリピなものよく知らないんですが、家にたまたまDJ機材があったので、配信とかしてみたいな～と思いはじめつつ、OBSというソフトをインストールしたりWebカメラをセットアップしたりしてみてるのですが、DJ中の自分の様子をカメラで写しても盛り上がりにかけることに気づきました。 DJ機材の前でポーズをとっている男性 こんな映像がインターネットに流れてきても絶対にみようという
自粛で暇だから自宅でVJごっこしてみた - GMO Research & AI Tech Blog
こんにちは。 COVID-19（コロナ）禍の中、みなさん何事もなくおすごしでしょうか。 日本はじめ世界中のみなさんが平和に暮らせるよう祈っています。 とはいえ、自粛に疲れてきた方も多いと思うので、今日は自粛中でも家で遊べるプログミングの紹介をしたいと思います。 Processingというクリエイティブコーディング用のライブラリを使用して、自作のサウンドトラックを可視化してみます。 Processingはとてもシンプルで分かりやすく設計されているので、プログラミングに詳しくない人でもとっつきやすくておすすめです。 ダウンロードすると専用のエディタがあり、再生ボタンがついているので、コーディングして再生ボタンを押すとすぐに結果を確認できます。 言語もjava,javascript,pythonなどに対応しています。 自粛やリモートに少し飽きたり、疲れたりしてきた方も、Processingであら
音を操るWeb技術 - Web Audio API入門 - ICS MEDIA
Webにおける表現はどんどん進化しています。Webサイトには当然のように動画が埋め込まれるようになり、CSSやSVG、canvasでのさまざまな表現が頻繁に見られるようになりました。さらにAR、VRといった表現も台頭し筆者も毎日ワクワクしながらインターネットの海を泳いでいます。 その中であまりメジャーではないと感じるのは「音」による表現です。もちろん音を用いた素晴らしいWebサイトはたくさんありますが、環境の制約が視覚表現以上に大きいため多くは見られないのでしょう。 とはいえ、音と視覚表現を組み合わせることによって表現できる世界観、インタラクション、その他諸々は計り知れないと筆者は思っています。今後オーディオなどの技術の進歩によって上記で述べた制約も乗り越えられるようになるかもしれません。時代を先どりしたい読者に向けて、今回の記事ではWebで音を扱う技術Web Audio APIについてお
オーディオファイルの扱いが簡単に！JavaScriptライブラリ「Howler.js」 | DevelopersIO
オーディオファイルの取り扱いを簡単にしてくれるJavaScriptライブラリ「Howler.js」を紹介します。 ウェブでオーディオファイルを扱うのは「正気の沙汰ではない（要出典）」と言われており、Web Audio APIやHTML5 Audio（HTMLMediaElement）を見ると、確かにそっ閉じしたくなる感じです。 そんなオーディオファイルの読み込みからブラウザごとの再生できるファイルの判定など、面倒な処理を任せてしまえるオーディオ関連のJavaScriptライブラリHowler.jsを紹介します。 公式サイト（サンプルあり）：howler.js - JavaScript audio library for the modern web リポジトリ：howler.js - GitHub 使い方 npmなら npm i howler -D CDNから読み込むなら <script
phiary
先日紹介した 『Web Audio API で音を再生しよう』 は, 音楽ファイル(.mp3や.wav)を読み込む前提の方法でした. 今回は, Data URI Scheme のデータを読み込んでそれを音楽用のバッファに変換して Web Audio API で使う方法を紹介したいと思います. この方法であれば, ファイルに埋め込めるようになるのでクロスドメインの制約に引っかからなくなります! Flow 1. 音楽データを用意する wav なり mp3 なりを Data URI Scheme に変換します. var DATA = 'data:audio/wav;base64,UklGRnoGA...'; 先日作った下記のツールを使えばカンタンに変換できます. Web Tool - File to Data URI Scheme | phiary 2. Data URI Scheme を Ar
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
