帰ってきたVisual Generator ::HTML5::

大学時代に、JavaScriptで作った映像のリズムマシン「Visual Generator」を、HTML5時代にあわせて作り直してみました。

VG-808

初期のコンセプト通り、画像は使っていません。丸やら、再生ボタンの三角やらは、全部「canvas」タグで描いています。

最大の違いは、IEだけでなく、Firefox,Safari(Macも),Opera,Chrome(チェックはIron)と、殆どのブラウザで動くことです。(IEは、まだcanvasタグに対応していないので、Googleのライブラリを使っています。)

前からHTML5に興味はあったのですが、中々、始めようとしなかったのですが、WWDCで発表された「Safari4」でHTML5がプッシュされていたことがキッカケで遊んでみることにしました。ということで、iPhone,iPod touchでもチェックしてみました。動くことは動きますが、激重で、かなりバッテリー食うようです。

*開発環境*
エディタ： Notepad++
html、css、JavaScriptを満遍なく扱え、且つ、関数の折りたたみが出来たため、これに落ち着きました。途中でAptanaに切り替えようかとも思ったのですが、イマイチなじめず。

デバッガ: Safari 4 for Win
Safari 3 for Winは、どうしようも無い印象でしたが、Safari 4は、中々、イイ感じです。こいつのデバッガが快適だったからこそ、今回、諦めずにここまで出来ました。Firebugも手をつけたんですが、イマイチ、エラーコードの検出場所が分からず、Safariで落ち着きました。
にしても、Ajaxブームのおかげで、本当に良いJavaScriptデバッガが出来ましたね。旧VGを作ってバグがあったときは、IEから「何行目の何文字目でエラー」としか帰ってこず、それがどのファイルかも分からないで、かなりイライラさせられたことを思い出すとと雲泥の差があります。

作った感想などは、また、後日書きます。また、もう少しパワーアップさせる予定です。
何かアイディアがあれば、コメント欄にお願いします。