HTML5アニメーションツール Hypeを使ってみました

これでFlashはいらなくなる？ともいわれるHTML5アニメーションツール 「Hype」、Mac App Storeからダウンロードして使ってみました。

日本語ローカライズ版もあるような記述もどこかにあったのですがそれは見当たらず（探し方が悪かったのかも）、残念ながら英語版でしたが日本語環境での不具合は今のところフォントのごく一部しか使えないという程度に収まっています。

単純にこのページのトップの画像スライドのアニメーションを作ってみましたが（今、トップページで動いているものです）、この程度だったらかなり簡単で、FlashとかAE（AfterEffects）を使ったことがあったらすぐ作業を進められるでしょう。
タイムラインの操作はFlashより使いやすく、AEに近い感じでしたね。特にタイムライン横軸のスケールを細かく変えられるのはぜひFlashでも実現させてほしい。

WordPressに入れこむのも簡単で、Hypeが生成したJSと素材を含んだフォルダをサイトルートに入れて、同じく生成したHTMLから3行ぐらい所定の位置に入れこむだけです。swfとかiQueryよりかなり簡単で、HTMLのソースもシンプル。でもどうやってこんなことができるのであろう。
サイズはjsの部分だけで比べるとjQueryが117.8Kbに対してHypeのjsは127Kbとそれほどの差はないものでした。

バージョンはたったいま（2011/6/5 AM11:50）1.0.2になりました。最初の1.0はかなりバグっぽかったですが、現在は安定しているようです。
HTML5専用ツールのような印象ですが、今のところこのサイトのxhtml1.0でもあまり関係なく動いています。ま、正しくはjs生成ツールというべきなんでしょうね。

Adobe Flash CS5.5で同じように作成、Adobe Wallabyで変換したものもアップしてみました。
こちら（別ページで開きます）

Hypeと違い、WebKit専用なのでFireFoxでは動きません。きっとiPad専用という考え方でしょう。それだけに動きはスムーズなようです。
ファイルサイズはFlash-Wallabyが889KB、Hypeが881KB。ちなみにswfだと840KB。それぞれ僅差。


また何か変わったことをしたらここで報告します。