Strudel is a music live coding environment for the browser, porting the TidalCycles pattern language to JavaScript.
Strudel REPL
Strudel is a music live coding environment for the browser, porting the TidalCycles pattern language to JavaScript.
Webでどこまで遊べるか試してみた - Qiita
Sound Walker という Web アプリを作りました。 ↓ここで遊べます↓（スマートフォンで開いてください） https://www.sound-walker.app リポジトリはこちら https://github.com/Leonardo-mbc/sound-walker ホーム画面に追加することで、インストールしたアプリのように遊べます。 Webでどこまでできるかをやってみようと思って作り始めて、 ほっといて数年たったら技術がみるみる変わっていて、いろいろ味が出てきました。 Service Worker, Add To HomeScreen などなど Webでできるゲームってだけだったのが、普通にスマホで動くゲームになる時代になっております。 Sound Walker で使ってる技術は WebGL(Three.js), WebAudioAPI, ServiceWorker,
ブラウザを誰でも簡単に扱える楽器にしてみた - Qiita
uzura です。 ファーストサーバ Advent Calendar 2017 の8日目を担当させて頂きます。 僕は会社では主にフロントエンドの開発を行っています。 今回 Advent Calendar に記事を投稿するということで、弊社サービスの Zenlogic にも使用されている Ruby on Rails や React.js を使いつつ、せっかくなので以前から作ってみようと思っていたサービスを（個人で）作ってみて、それについての記事を書きました。 rechord https://rechord.cc ソースコード (GitHub) どんなサービスなの？ コード進行を入力するだけで誰でも簡単に演奏/共有することができる Web サービスです。 コード進行って何？？ 音楽の知識が無い方には少々分かりにくい概念と思いますが、伴奏をする時の指針となるものです。 簡単に言うと、これ通りに弾
Introduction To Web Audio API | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! Web Audio API lets us make sound right in the browser. It makes your sites, apps, and games more fun and engaging. You can even build music-specific applications like drum machines and synthesizers. In this article, we’ll learn about working with the Web Audio API by building some fun and si
ブラウザで動くシンセサイザーを実装する為のスクリプト・「beep.js」
beep.jsはブラウザ上で動く、WebAudio APIを使ったシンセサイザー構築の為のJavaScriptフレームワークです。シンプルなコードで動かせるように作ったそうです。デモページではコンソールを開いてtextareaを編集する事で動作テストを行える様になっています。使い方や詳細及びライセンスはGithubをご参照下さい。 beep.jsOn Github
perfume.js iPhone, iPad に対応させた - 音の鳴るブログ
http://mohayonao.herokuapp.com/perfume3 Perfume のモーションデータを使って JavaScript で踊るやつ。Safari や iOS では動かなかったんだけど修正して動くようにした。（Windows版の Safari では動かないみたい） やったこと 動かなかった最大の原因はオーディオファイルの形式で、公式で配布されている wav を ogg に変換して使っていたのだけど、Safari は ogg に対応していないらしいので mp3 も用意した。 それだけで一応は動くようになったのだけど、BVH のデータが iPhone で読むには大きすぎて（1つにつき2MBくらいある）ダメな感じだったので、フレームを間引いて小さくしたモバイル版BVHを作った。PCに比べるともっさりしているけど、動くから良い。 3D処理自体は three.js でやってい
pico-player.js / pico-player.coffee
JavaScriptで音を出すための簡単なライブラリです。 Chrome, Firefox, Operaで使えます。 コード https://gist.github.com/1342081 ブログ記事 JavaScriptでリアルタイムに音を出すときに簡単便利なやつつくった - つまみ食う Usage var player = pico.gerplayer(options); /* options = { samplerate: 44100, channel: 1, }; */ player.play(generator); player.stop(); Generator ジェネレータは実際に音のシグナルを出力するためのオブジェクト player.play(generator) を実行すると、generator.next が定期的に呼ばれる generator.next は play
SoundManager 2: JavaScript Sound For The Web
HTML5 + flash hybrid Complexity, reduced Supporting HTML5 audio can be tedious in modern browsers, let alone legacy ones. With real-world visitors using browsers ranging from mobile Safari to IE 6 across a wide range of devices, there can be many support cases to consider. SoundManager 2 gives you a single, powerful API that supports both new and old, using HTML5 audio where supported and optional
JavaScriptで動画から音声を抽出してみた
ブラウザだけでMP4/FLV/SWFの動画からMP3/M4A/AAC/WAVの音声を抽出できるサービスを作りました。 nicozonにあるmp3変換のページからサービスが利用できます。 nicozonの動画ファイルのダウンロード機能と合わせて使用すれば、 にこさうんどやnicomimiの代わりになりますね。 従来のこういうサービスはサーバー側で変換をするものですが、 このサービスの新しい所はJavaScriptで動画から音声を抽出している所です。 メリット ブラウザ側で変換してるのでサーバーのリソースを使用しなくて済む 順番待ちとかアップロードとかダウンロードとかしないので変換する速度が速い 音声ファイルをそのまま抽出しているので音質がいい 複数の動画ファイルを同時に変換することが出来る WebWorkerで処理しているので処理中もブラウザが固まらない サーバから動画ファイルをアップロード
createObjectURLがすごい件 - プログラムモグモグ
最近またLocal Player (Chrome Player)を実装しなおしています. 一応説明しておくと, Local Playerは, 完全にローカルで動作する音楽プレイヤーです. シンプルさを求め(実装がめんどくさいだけ), 操作しやすく(これは大事), 良い感じのプレイヤーです. 半年前に, ソースコードがスパゲッティになって, 開発を中断していましたが, 最近また書きなおし始めたのです. 音楽プレイヤーをブラウザー上で実装するのには, 音楽ファイルをJavaScriptで読み込まなければなりません. そこでHTML5ですよ！！！ <audio src="url/to/musicfile.mp3" type="audio/mp3" /> みたいな感じで, 音楽を再生できます. 詳細は他のページに譲ります. さて, 音楽ファイルを再生するには, ローカルファイルからurlをaudi
[JS]一行追加するだけで、IE6/7/8でもHTML5のvideoとaudioを利用できる -html5media
HTML5のvideo要素やaudio要素をサポートしていないメジャーブラウザでもたった一行、ページに追加するだけでこれらを利用できるようにするスクリプトを紹介します。 html5media デモページ [ad#ad-2] html5mediaの実装 html5mediaの利用方法は簡単です。 ページに追加する一行 下記をページのhead内に記述します。 <script src="http://api.html5media.info/1.1.4/html5media.min.js"></script> これだけで、すべてのメジャーブラウザでHTML5のvideoとaudioを利用できるようになります。 video, audioに非対応のIE7でも期待通りに動画が再生されます。 IE6(IE Tester)でのキャプチャ 参考：video, audioのサポート状況 video, audio
[JS]主要ブラウザ全てにaudio要素でMP3を再生できるようにするスクリプト -audio.js | コリス
IE6/7/8, Firefox, Operaを含む主要ブラウザ全てに、HTML5のaudio要素を使ってMP3を再生できるようにするスクリプトを紹介します。 audio.js デモページ [ad#ad-2] audio要素のサポート状況 audioはHTML5の要素で、サポートしているブラウザは限られたものとなっています。 audio要素のブラウザのサポート状況 IE9 Firefox 3.5+ Chrome Safari Opera 9.6+ また、対応している音声ファイルのフォーマットも異なり、現在音声ファイルの主流のMP3はChromeのみが対応しています（Safariも一応再生可）。 「audio.js」は、audio要素に非対応のIE6/7/8、MP3に非対応のFirefox, Safari, Operaで、audio要素を使ってMP3ファイルを再生できるようにします。 [ad
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Customize media notifications and playback controls with the Media Session API | Articles | web.dev
EPIC Agency - Imagine, Build, Tell.