ITエンジニア/デザイナ向けにオープンソースを毎日紹介

メディア - 音楽の記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2015/12/19

APlayer - 歌詞表示に対応したHTML5音楽プレイヤー

ついにFlashが歴史の幕を閉じようとしています(Flash Playerはまだ残っていますが)。つまりこれまでWeb上で使われきたメディアがHTML5によって扱われるようになるのです。対応しているからといって、単純に動画、音声ファイルをリンクするだけでは誰も再生しません。やはり見栄えのいい再生プレイヤーがあってこそで...

List

  • 2015/10/10

Cumulus - メニューバー常駐型Sound Cloudクライアント

Sound Cloudには多くの音楽がアップロードされています。仕事中などのBGMにちょうど良く、使っている人も多いのではないでしょうか。そしてBGM代わりとなると普段使っているWebブラウザで聞いているとおいそれと終了しづらくなります。そこで使ってみたいのがCumulusです。メニューバー常駐型のSound Clou...

List

  • 2015/10/03

Gapless 5 - JavaScript/CSS製のギャップレスプレーヤー

音楽には間が大事な要素になると思いますが、コンサートや連続した曲が続く場合、間が邪魔に感じることがあります。そんな時のためにギャップレス再生と呼ばれる技術があります。Webにおいても音楽コンテンツが増えていますので、Gapless 5のようなギャップレスプレーヤーはニーズがありそうです。## Gapless 5の使い方...

List

  • 2015/09/01

Peaks.js - JavaScriptで波形を表示

SoundCloudでは音楽の波形を表示しています。音楽の変化するポイントが分かりやすく、何より見ていて格好良いのではないでしょうか。単純に音楽プレーヤーで再生するだけでは得られない楽しさがあります。同じように音楽ファイルを読み込んで波形を描画してくれるのがPeaks.js

List

  • 2015/07/17

Vine MV – Vine動画を使ってミュージックビデオを生成

好きな音楽をただ聴くだけでも楽しいですが、MV(ミュージックビデオ)も面白いです。バーやレストランに行って流れているとついつい目を向けてしまうのではないでしょうか。単に音楽だけでは惹かれなかったのに、MVを合わせてみたらすごく良い音楽に感じたなんて経験もあるかも知れません。そんなMVを自動で生成してくれるのがVine ...

List

  • 2015/06/17

karaoke-telop – カラオケのテロップをWeb上で表現

カラオケでよく見かけるのがテロップです。言葉の流れに合わせて文字の色が変わる仕組みですが、あのシンプルさで歌が歌えるようになるというのはとても面白い仕組みです。そんな仕組みをWeb上で実現したのがkaraoke-telop

List

  • 2015/06/11

kyoku - iTunesで再生中の音楽をメニューバーに表示

Mac OSXでiTunesの音楽を聴いている人は多いでしょう。多くの曲を入れているのでランダムで流していると、ふと耳に入った音楽の題名が分からないことがよくあります。そんな時に作業を中断してiTunesを表示するのは面倒です。そこでインストールしておきたいのがkyoku

List

  • 2015/03/13

wavesurfer.js - HTML5で音楽の波形を表示

Web上で音楽を楽しむ環境は整いつつあります。SoundCloudにアップしている人も多いですし、YouTube上にある音楽を聴く人も多いでしょう。そんな音楽メディアに欲しい情報として波形があります。wavesurfer.jsは音楽ファイルを読み込み、波形を表示してくれるJavaScriptライブラリです。JavaSc...

List

  • 2015/02/20

Vesper - 格好良いデザインのHTML5音楽プレイヤー

HTML5になって、audio/videoなどマルチメディアを操作するタグが追加されました。それによってFlashなどのプラグインを使わなくともWebブラウザだけで音楽や動画が再生できるようになっています。問題はそれらのタグは最低限の表現しか提供しておらず、より使いやすくしようと思うと独自の実装が必要と言うことでしょう...

List

  • 2014/08/21

MusicStoreLite – iTunesの音楽を連続視聴

最近のiTunesは多くの曲が視聴でも1分30秒流れるようになっています。従来の30秒に比べると歌の感じが十分に分かるようになっている反面、買わないかなと思っている曲でも楽しめるくらいになっています。そこで試してみたいのがMusicStoreLiteです。iTunesのミュージックストアにあるランキング上位の曲を自動再...

List

  • 2014/06/10

RiceKaraoke – JavaScriptでカラオケの歌詞表示

カラオケは日本はもちろん、海外でもとても人気です。しかし日本ほどカラオケ店が多い国はない訳で、それでもカラオケがしたいとなれば自作するほかありません。カラオケのためにはボーカルの音声を消した音楽と、歌詞の表示が必要です。さらにRiceKaraokeを使えば一歩進んだ歌いやすさを提供できるでしょう。## RiceKara...

None

  • 2014/06/01

おしえて!恋のプロトコル – プログラミングができるアイドル“ハックガールズ”デビュー曲

筆者はテレビを見ないのでアイドルなどは全然分かっていないのですが、皆さんはどのアイドルが好きでしょうか。自分の手の届かない存在としてのアイドルが好きな人も多いですが、最近ではAKB48のように会いにいけるアイドルというのが人気を集めています。そんな中、さらに自分たちと同じ話ができてしまうアイドル、ハックガールズが誕生し...

List

  • 2014/05/24

beeplay – JavaScript×ビープ音で音楽を奏でよう

HTML5のWebAudio APIは使ったことがありますか?あるということは知っていても、なかなか機会もきっかけも見つからないものですよね。とは言え折角の新機能を使わないのは勿体ないものです。そこで紹介したいのがbeeplay、ビープ音で音楽を奏でるJavaScriptライブラリです。## beeplayの使い方!メ...

List

  • 2014/03/03

Boombox.js – HTML5のオーディオ系APIを一つに集約

HTML5は多彩な機能をWebにもたらしてくれますが、機能が多彩でブラウザによってサポートされている機能が異なるなどまだまだ課題も多いのが実情です。しかしその課題こそプログラミングによって解決できる余地がある部分でもあります。今回はオーディオ系APIを一つにまとめて提供してくれるライブラリBoombox.jsを紹介しま...

List

  • 2014/01/17

audioSprite - オーディオファイルでスプライト!

ほほー技術的に面白い!一つの画像に複数のアイコンを入れてスタイルシートを使って切り出すことで複数画像をダウンロードするネットワークコストを低減してくれる技術がCSSスプライトですが、画像以外でも使うと便利そうです。Web Fontsをアイコン代わりに使ったケースも似ていますが、今回はなんと音楽でやってしまおうというライ...

List

  • 2013/12/15

WebAudioControls – WebAudioと一緒に使えるUIコントロール

HTML5の新しい機能として知られているWebAudioですが、音楽という特性上これまでのWeb UIとは全く異なる使われ方をします。そんなWebAudioを使いこなすためのUIコンポーネントとしてWebAudioControlsを紹介します。デジタル系の楽器にあったデザインのコントロールを提供してくれます。!まさに楽...

List

  • 2013/10/30

Cozic - YouTubeも使えるnode製のクラウドミュージックプレイヤー

CozicはCoffeeScript/node製のオープンソース・ソフトウェア(MIT License)です。音楽コンテンツはいつだって人気です。デスクトップ、スマートフォン、タブレット…どこでも音楽を楽しみたいと思うはずです。そこで紹介したいのがCozic、Webベースのミュージックサーバです。トップページです。音楽...

List

  • 2013/09/17

Web Audio APIをラッピングして使いやすく「Band.js」

Band.jsはHTML5/JavaScript製のオープンソース・ソフトウェア(MIT License)です。Web Audio APIを使えばWebブラウザ上で音楽を奏でられると分かっていますが、そうそう簡単にできるという訳ではありません。APIをそのまま使うのではなくラッピングされたAPIが必要でしょう。そこで紹...

List

  • 2013/08/29

iTunesの音楽、Podcastingを様々なデバイスで楽しむ「SevenMinutes」

SevenMinutesはMac OSX用のオープンソース・ソフトウェア(Ruby License)です。iTunesはiPhone/iPodと同期できるとあって、メディアサーバとして使っている人も多いのではないでしょうか。今回はiTunesを他のデバイスからも利用できるようにするSevenMinutesを紹介します。...

List

  • 2013/07/19

ピアノロールを使ってWeb上で音楽を奏でよう「PianoRoll.js」

PianoRoll.jsはJavaScript製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。Web上で音楽を作る方法は幾つかありますが、今回はPianoRoll.jsを紹介します。いわゆるピアノロールを使ってマルチトラックの音楽を作成できます。Firefoxで試しています。Go...