HTML5 audioで何か作ってみる

読了: 約 2 分

HTML5を使ったサイトが増えてきて、audioを使ったものって増えていますよね。
そこで何か自分でも作ってみようと思いテストしてみます。

audioタグを使ったすごいサイト

6つの音源が同時に流れていて、それぞれボリュームを動的にコントロール出来ます。
http://www.beautyoftheweb.com/firework/

参考サイト
英語版 IEBlog の翻訳記事と、日本の Internet Explorer 関連の話題をお届けする、マイクロソフトの公式ブログです。様から
HTML5:audioの能力を解き明かす

実験してみて作成したもの
以前作成したFacebookアプリの中にaudioタグを生成して、
Play,Pauseというボタンを作成し、JavaScriptで関数を書いてあります。
音楽ギフトB版

<audio autoplay="autoplay" src="~.mp3">
//srcやらなにやら
</audio>

autoplayと書くだけで勝手に再生され、loopでループされるので
凄く便利だなぁと思いました。
実行させる際に間隔が欲しいなと思ったら、JavaScriptのsettimeoutとかでaudio.playさせる前に
入れるとかですね。

リファレンスもご参考までに
audioタグのリファレンス

個人的にはFacebookアプリの中でaudioを使ったものを観た事がなかったので
こういうのも有りなんじゃないのかなーと思いながら作成していました。

特にFacebookアプリはソーシャルゲーム出ない限り滞在時間やプレイ時間が少ない傾向にありますよね
流行りとしても診断系が多いので、その中で少しでも遊べる要素を加えるのは重要になってくるのではないでしょうか。

企業として中長期的に考えるとFacebookのプラットフォーム上からどうやって自社のメディアの方に導線を
引いて上手くユーザーを囲い込めるかが重要になってきますので
プロモーションやちょっとしたゲームであっても、それがゴールである目標（ex:売上/利益/ブランディング）
を見据えたものでなければ意味がなくなってしまいますので、
ただ、作るだけでなくこういう視点（ROI）でも見ていきたいと思いました。

皆さんも何か作ってみてはいかがでしょうか。