HTML5で音楽ファイルを扱うことができるようになりましたが、素の状態では殆どUIが提供されていません。そんな状態で提供しても全く魅力的ではないでしょう。別途UIを作り込む必要があります。
今回紹介するオープンソースソフトウェアはAmplitude.js、HTML5のオーディオプレイヤーです。これを使えば格好良いUIで提供できるでしょう。
Amplitude.jsの使い方
上の再生部分がプレイヤーになります。
マウスオーバーで再生、停止に表示が変わります。
こんな感じです。
サムネイルだけでなく、アルバムの拡大表示もできます。
プレイリストにも対応。
SoundCloudも再生できます。
ビジュアライズも。
シンプルも良いですが、もっとリッチなプレイヤーにもできます。
Amplitude.jsを使えばリッチで使い勝手の良いHTML5のオーディオプレイヤーが簡単に提供できるようになります。もちろんAPIも備えているので、プログラミング連携も容易でしょう。Amplitude.js自体は外部のJavaScriptライブラリに非依存です。
Amplitude.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。
MOONGIFTの関連記事
コメント