Quantcast
Channel: 音楽方丈記
Viewing all articles
Browse latest Browse all 339

iPhoneを振ってJavaScriptから加速度を検知して除夜の鐘を鳴らすサウンドWebアプリ [改良版]

$
0
0
先日の Sleigh Bells (改良版)に続く時期ネタ第二弾ということで、除夜の鐘バージョン Temple Bell (改良版) を公開します。

iOS 6以降の iPhone/iPod touch/iPad の Mobile Safari で動きます。
Mobile Safari 以外や Android では未確認。もしかしたら動くかもしれません。



 iPhone を振ってお寺の鐘をゴーンと鳴らすだけのシンプルなサウンド Web アプリで、Sleigh Bells と同じく JavaScript から Web Audio API と加速度センサーの値を取得する DeviceMotionEvent を使用しています。

初版は Facebook ページだけで公開

去年、初版 Sleigh Bells を作った後で、大晦日の夜になってから「除夜の鐘に差し替えたバージョンもありかも?」と思い付き、使えそうな寺の鐘の音を急いで探して差し替えて作ったのですが、出来上がった時間が時間だっただけにブログ記事では間に合わず、急遽 Facebook ページのほうだけで公開告知していました。

ということで、この改良版も中身は Sleigh Bells 改良版のサウンドを差し替えただけのものです。(なんてお手軽な…)

Temple Bell の使い方


   

←左の QR コードをタップするか、iPhone のカメラで読み取って Temple Bell にアクセスしてください。
短縮 URL: http://goo.gl/JwA1pX


使い方はスレイベルと同じくシンプルです。
  • まず「Sound Preview」ボタンで iPhone の音量を確認・調整してください。
  • 次に iPhone を握って手首のスナップをきかせて振ってみてください。
  • 反応が悪い場合は振る速度を速くするか感度を低くしてみてください。
  振るときに iPhone がすっぽ抜けないように十分注意してください。
  (万が一 iPhone を落として壊してもこちらは責任は負いません)

タイトルバーの左のアイコンをタップすると画面が右にスライドして QR コードと短縮 URL が表示されます。



プログラムの処理内容について知りたい方は Sleigh Bells 改良版の記事を参照してください。



試すときはくれぐれも iPhone を落とさないように注意してください。

まだいくつか別のネタも作ってあるので後日公開予定です。

[関連サイト]
 jQuery
 jQuery UI
 jquery-ui-touch-punch
 MEDIALOOT - jQuery UI Theme: Retro
 mmenu
 Web Audio API
 Safari Developer Library


Viewing all articles
Browse latest Browse all 339

Trending Articles