HTML5対応アニメーションが簡単に作れる

    Posted in: WEB制作

HTML5対応のアニメーションが手軽に作れるツールが登場しました。
Mac App Store にてHypeという名称で発売中です。
Mac App Storeなので、Windowsには対応していません。
どういう目的で使用するかというと、
Flashの代替としてiPadやiPhoneでアニメーションを表示したいという時に、
このソフトを使ってアニメーションを作成します。
アニメーションを作成する操作は直感的でFlashよりも作成し易いように思います。
ガイドの表示が非常に分かり易いところも気に入っています。
シーン設定などもあり、オブジェクトを上下左右に動かすだけの単純なアニメーションだけでなく、
クリエイターの期待に十分応えてくれる機能がついています。
実際に、HTML5を使えるのか。ブラウザ対応など大丈夫なのか。
という部分がどうしても最初に心配になってしますのですが、
その辺りもよくできていて、作成した内容によって、どのブラウザでは表示できないといった、
エラーが書き出しの際にあらかじめ表示されるようになっています。
これは非常にありがたい機能です。
書き出しの際、アニメーションは、ひとつのフォルダにまとめられ、HTMLの記述から、
JavaScriptを読み込みます。HTML側の記述はDIVで囲まれた数行を、実際に使用するHTMLに
コピペするだけなので、非常に簡単です。
「ここからここまでをコピペしてね。」というように英語で書いてあります。
ちょっと試してみたところ、表示がJavaScriptからということが災いして、
PNG画像のIE7、8での表示がちょっと汚くなってしまいます。
既知のIEバグですが、これにうまく対応してくれるようになると良いのですが…
私の作ったものは、下記URLにあります。本当は必要なかったのですが、
静止画像の予定のものを急遽アニメーションにしました。
PNGを使用しているので、IE6では表示できません。IE7,8も上記のとおりです。
http://manabell.net

    Posted in: WEB制作