- 2011年9月 2日 08:41
- HTML / XHTML
【こちらの記事は、約5分程でお読みいただけます。】
いつもITブログを見ていただき、ありがとうございます！
今回はHTML5に関するツールのご紹介をしていきますね。
最近話題のスマートフォンのOSは、「iOS」や「Android」などが有名です。
iOSでFlashが使えないことは、皆さんご存知かと思います。
またApple側の主張としては、今後もFlashに対応する予定は無いようです。
その理由としては、Flashの代わりに、HTML5の活用が見込めるためです。
HTML5は今までのHTMLに比べ、様々な拡張機能や新機能があります。
その中にはアニメーションやグラデーションといったものがあります。
この機能により、ブラウザのみでFlashのような動きが可能になります。
スマートフォンのブラウザは完全では無いですが、HTML5に対応しています。
今までiOSでは見られなかったFlashのような動きが、
HTML5でなら見ることが可能になります！＾＾
そこで、FLASHをHTML5に変換してくれるツールが数々発表されています。
いくつかご紹介しましょう。
・Wallaby
http://labs.adobe.com/technologies/wallaby/
Adobeが公開したFlashのアニメーションをHTML5に変換するツールです。
以前にもこちらのブログで紹介しております。ぜひお読みください＾＾
Adobe「Wallaby」でFlashをHTML5に変換!
・Swiffy
Googleが開発したSwiffyです。
こちらはブラウザさえあれば簡単にFlashをHTML5に変換してくれます。
上記のWallabyとの違いは、Wallabyは「.fla」ファイルから変換するのに対し、
Swiffyは「.swf」ファイルを変換します。
さて、上記のURLをクリックすると以下の画面が出てきます。
(画像はクリックで拡大します。)
また、次に載せたものが変換前と変換後の比較の画面です。
上部に表示されているのが、元の「.swf」ファイル、
下部で表示されているのが、変換後のHTMLの表示になります。
実際の画面では星マークを回転させるにあたり、
多少速度は変わってしまうのですが、どちらもきれいに回っています。
私が使用している、iOSのデバイス上での動作確認も出来ました。
しかし、残念ながらActionScript3.0や、複雑なタイムラインを持った
ファイルに関しては変換が出来ませんでした。
この辺りが、今後の課題になりますね。
その他にも、HTML5関連のツールは沢山出ています。
以下は、FLASHのようにHTML5の開発が出来る作成ツールです。
作成ツール
・Adobe Edge
http://labs.adobe.com/technologies/edge/
HTML5, JavaScript, CSS3 ベースのアニメーションをFlushのような
描画ツールやタイムラインを使って制作できる、オーサリングツールです。
・hype
こちらも、HTML5, JavaScript, CSS3を元に作る
アニメーション作成ツールです。
Mac OS X用ソフトで、価格はUSストアでは29ドル、
日本だと3500円とお手ごろです。
App Storeで販売されております。
これからのWebの技術はどれだけツールを使いこなせるか、
知っているかが鍵になりそうですね。
Webの技術に関心がある皆さんは、
色々なツールの使い方に注目していきましょう！＾＾
--------------------------------------------------------------------------------
KENスクールで「プログラム」を一から学習していきませんか？？
⇒【無料のマンツーマン体験レッスンを受けてみよう！】
KENスクールでは、プログラムが初めての方でも、
安心して学習していただける環境です！
プログラムとは何か？から始まり、
様々に利用されているプログラミング技術を分野ごとに紹介します。
是非、無料体験レッスンを受けてみてください！
本日の更新者：
パソコンスクール KENスクール Programコース
インストラクター 金替