オーディオファイルの取り扱いを簡単にしてくれる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
「Web Audio API」を使うと音声の「再生」だけでなく、音の「生成」や「加工」などもJavaScriptだけで手軽にプログラミングすることが出来るようになります。 ただ、ちょっとクセがあるので「扱いにくい…」と感じる人も少なくないでしょう。 そこで、誰でも簡単に「Web Audio API」を活用できるJavaScriptライブラリ「Tone.js」について、今回は簡単なサンプルと共にご紹介しようと思います！ ファイルを準備しよう！ まずは、「Tone.js」を使ったサンプルを作るのに必要な「index.html」と「app.js」を用意しましょう。 「Tone.js」自体は、GitHubからダウンロードするか、以下のURLから利用可能です。 https://tonejs.github.io/build/Tone.min.js ひとまず、「index.html」はこんな感じでOKで
作業用BGMとして音楽を流しながら仕事や勉強をしている人も多いと思いますが、最近はカフェや雨、波といった音楽ではない環境音を流せるWebサービスが注目されています。そんな環境音を無料で流せるWebサービスを有名なものから、ちょっとマイナーなものまで集めてみました。 1. Coffitivity 環境音ブームの火付け役といってもいいかもしれないです。Coffitivityはカフェの音を流してくれるWebサービス。自分のiTunesなどから好きな音楽を流しつつ、Coffitivityでカフェの音を流すと更にカフェにいる気分が味わえます。 2. calm.com 環境音だけではなく、映像や写真も一緒に楽しみたい時はcalm.comがおすすめです。雨や波、虫の鳴き声など、様々な自然の音を聞くことができます。 2分・10分・20分のコースを選択するとガイドが流れるので、それに従ってリラクゼーションを
Web上で音楽を楽しむ環境は整いつつあります。SoundCloudにアップしている人も多いですし、YouTube上にある音楽を聴く人も多いでしょう。そんな音楽メディアに欲しい情報として波形があります。 wavesurfer.jsは音楽ファイルを読み込み、波形を表示してくれるJavaScriptライブラリです。JavaScriptだけで作られているのが特徴になります。 wavesurfer.jsの使い方 例えばこんな感じです。 再生済みの部分は色が濃くなっています。 ドラッグ&ドロップで任意の音楽ファイルを解析できます。 wavesurfer.jsは数MBある音楽ファイルもすぐに解析することができます。そして波形を表示して、そのまま再生ができます。YouTubeのように動画がない場合、音楽メディアの見た目の楽しさとして表示すると良さそうです。サビ部分が一目で分かるのも良さそうです。 wave
SoundKit is a UI sound library designed for all of your interface needs. Featuring 300 professional, royalty free sound effects, designed for use in mobile and desktop app design. Each sound has been custom crafted for UI applications. Designed to sound great on mobile devices as well as high end speakers. Alerts Alerts include warning sounds, alarms, confirmations, and everything in between. Musi
「CoffeeScript を SuperCollider みたいに処理をしよう ♪♪」をコンセプトに開発していたブラウザ音響プログラミング言語 CoffeeCollider をリリースしました。音響プログラミング言語ということで、とにかく試して聞いてもらうのが手っ取り早い。以下のリンク先で "BOOT" と "RUN" すれば深夜っぽい音が鳴ります。 CoffeeCollider で、なんなの？ SuperColliderってなんだ？という人には 言語 & ライブラリ & 実行環境 という意味で processing.js の音楽版と言った方が分かり良いかもしれない。とにかく音がでる。音しかでない。とにかく音を出してほしいという気持ちで作った。最初はいい加減な気持ちでやっていたのだけど途中から結構がんばりだして、最終的にはカレーを食べにいく趣味ができました。 CoffeeScript拡張
フリーランスになってから仕事中は自由に音楽が聞けるので、気分にあわせて作業用BGMをチョイスしています。単純作業、記憶する時、創造する時など作業内容によっても変えています。今回はWEBで聞ける作業用BGMをまとめました。 予備知識 作業用BGMと脳波 人によって感覚が違うかもしれないが、私は単純作業の時はテキパキと眠気を覚ましたいので、テンポの早いクラブ系ミュージックを聞いたり、適度な刺激となるカフェの音などを流します。脳波だとアルファ波～ベータ波にしたい感じ。 ほかに記憶・創造系の仕事の時はリラックスする音楽を。環境音なら雨音などの自然。脳波をシータ波～アルファ波状態で作業したい。 脳波の調整を試みる音源はこのようにYouTubeに沢山あがってます。 これら脳波系BGMの動画をMusictonicで連続再生するリンクを作りました。シータ波とアルファ波は日本語と英語で検索結果が異なって面白
“A moderate level of noise enhances creativity compared to both low and high levels of noise. Moderate background noise induces distraction which encourages individuals to think at a higher, abstract level, and consequently exhibit higher creativity.” Source: Exploring the Effects of Ambient Noise on Creative Cognition
音節のビジュアル化をテーマにした前衛的な抽象アニメーション『こうこう』 映像作家大橋史さんの新作『こうこう』は以前紹介した『CHANNELER』と同様、“言葉”の持つ音声的な要素をビジュアル化することをテーマにした抽象アニメーションです。 こうこう | koukou [新しいウィンドウで開く] こちらのアニメのために設置されている『こうこう | koukou』では基本的な五十音の音節がアニメーションGIFで紹介されていて、これを発展させたものが今回の作品ということが分かります。 追記2013 . 03 . 28 Tumblrからの被リンクがすごいと思ったら、どうやら上のアニメGIFが好評だったようで... ブログやって結構経ちますが未だに何がウケるのか把握できていません。 勝手にこんなことしてマズイかなと思っていたら、制作者ご本人に載せていただけるとは。 上のgifアニメは日本語の50音節
Audio5js is a Javascript library that provides a seamless compatibility layer to the HTML5 Audio playback API, with multiple codec support and a Flash-based MP3 playback fallback for older or unsupported browsers. The motivation for creating Audio5js is to provide a light-weight, library-agnostic, Javascript-only interface for audio playback in the browser.
Tweensy解説 #6 BitmapFilter, ColorTransform, Matrix, SoundTransform 高度なトゥイーンをする BitmapFilter、ColorTransform、Matrix、SoundTransformなどを含んだ、あるObjectのプロパティをトゥイーンするのは、通常のトゥイーンより少し複雑かもしれません。これはObjectのプロパティのトゥイーンを、視覚効果のために別の何かに適用する必要があるためです。Tweensyは、これを行うことができますが、どのObjectを更新するか、パラメータを定義する必要があります。 フィルタをトゥイーンする Tweensy.to(new DropShadowFilter(), {blurX:10, blurY:10}, 2.0, null, 0, myInstance); myInstanceにドロップ
ボリュームを通常より細かく微調整 ボリュームを調節するには「システム環境設定」の「サウンド」パネルの主音量スライダーで調節するのが基本です。 また、「メニューバーに音量を表示」のチェックボックスにチェックを入れるとメニューバーで、音量調節用のメニューエクストラが利用できるようになります。 また、一番簡単な方法はキーボードの「Ｆ11」キーと「Ｆ12」キーに設定されている音量調節機能です。これらを使用すれば、音量調節と消音が簡単にできます。 しかし、キーボードで音量調節する場合の不便な所は、スライダーで調節するより微妙な調節ができないことです。 そこで、キーボード上で細かいボリューム調節を行う方法を紹介します。 キーボード上で細かい音量調節を行う方法 まず、「Ｆ11」キーと「Ｆ12」キーで音量調節ができることを確認します。 できない場合は「システム環境設定」の「キーボードとマウス」パネルで「F
This is a little tool I made in connection with the 10th Ludum Dare competition held in December 2007. Its original purpose was to provide a simple means of getting basic sound effects into a game for those people who were working hard to get their entries done within the 48 hours and didn't have time to spend looking for suitable ways of doing this. The idea was that they could just hit a few but
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く