HTML5ロゴが来襲してくるというアプリを作った

HTML5は皆さんのすぐそばまで来てるというのを実感（嘘）するために、視覚化を考えました。
このアプリを使えばもう見るからにすぐ来てるというのが実感できるものです。
※ HTML5ロゴを使ったクレイジーな何か。 に応募したものです。

HTML5来襲
http://wakasa.org/project/html5attack/
※位置情報の提供を許可してください
※携帯端末で幹線道路とか付近で閲覧を推奨

※実際にはモザイクはかかっておりません。見る楽しみが減るので加工しています。

技術的に何をしてるかというと

• 位置情報を取得して、最寄りのGoogleストリートビューがある緯度経度を探す
• スマホが向いてる方位を取得し、Googleストリートビューを表示
• Canvasを重ねてモノリス的なロゴと空を飛ぶアニメーションロゴ群を500ms毎に追加

という感じです。

苦労した点としては

• 空を飛んでくというアニメーション計算が非常にしんどいし、実際作り込み失敗。
• iPhoneで0.1とか移動させてもうまく移動してくれないのでカクカクするのを回避で妥協する箇所が多い
• 最寄りのストリートビューを探すというのがAPIの性質上、何度も叩かないと取れない
• 最寄りを探すのがある程度の範囲内のストリートビューなので、どこかわかりにくいのでUI作り・・なおす気力なし。

とかかな・・いろいろ問題ある状態ではあります。

ちなみに、最初はバイファムの最終回からインスピレーションを得て

• 紙飛行機を飛ばして地図上に飛行距離を出す
• みんなで飛ばしたものをシェアして紙飛行機が飛び交うのを見る

という幻想的できれいなアプリだったのですが、作ってる最中に"飛ばす"というアクションが無くなり、地図上のプロットも無くなるという、完全に原型を留めていないものになりました。（涙）
おかしいな・・・・。

※4分30秒付近からのイメージ