FlashからHTML5に変換するWallabyを試してみた
結局今年の目標を書けてないですね。
考えてはあるのだけど、宣言して実行するのが大事なのに・・・。
とりあえずおはようございます、たすくです。
今朝こんな記事を見かけたので。
そんなわけで、早速簡単なサンプルを作ってみた。
まず、Flashでこんなのを作りました。
で、噂のWallabyで変換してみる
特にエラーも出ず、普通に変換が終了した。
"flashToHTML5.fla"に対して、書き出されたファイルは、
でした。
サーバーにアップして確認すると、
お、iPhoneでも動いたー！
ただ、ソースとしてやってることはシンプルで、
・それぞれの静止テキストをsvg（Scalable Vector Graphics）形式に変換し、画像としてHTMLに書き出す。
・CSS3でそれぞれの画像をCSS3の-webkit-transformあたりでアニメーションを表現
・jQueryも一緒に使ってJSで軽く制御（主にループ周り？）
こんなもんです。
うーーーん、このコーディングでHTML5と言っていいのかは難しいところだし、
まだまだこのツールを信頼して実用化するのは厳しいですね。
こんな風に書くのかー、と参考にはできるかもしれないけど。
でも、Adobeの開発者がこういうのを積極的に作って公開する、という姿勢はすごくいいので、
これからの追加開発に期待したいですね！
【追記】
手元にあった、ピグが走るflaも同様に変換して動かしてみた。
PCのChromeでは相当スムーズに動いたけど、iPhone3GSは処理速度的に厳しいっぽい・・・。
この辺はiPhoneの進化待ちってステータスですかね。確実に処理速度は上がっていくだろうし・・・。
まぁ、でも動いただけでテンション上がる上がる！笑
でも、やっぱりベクトルを1つずつsvgに変換して、それぞれdivでくくって同じように動かすんですね。
うーん、canvasとかでやってくれるわけではないのか・・・・。
考えてはあるのだけど、宣言して実行するのが大事なのに・・・。
とりあえずおはようございます、たすくです。
今朝こんな記事を見かけたので。
アドビ、FlashをHTML5に変換するツール「Wallaby」発表
Adobe Labsは米国時間3月7日、FlashをHTML5に変換する新しい無償ツール「Wallaby」を発表した。
AdobeのMAX 2010カンファレンスで最初に披露された同ツールは現在のところ、変換はできるが荒削りな部分があるとAdobe Flash Professionalシニア製品マネージャーを務めるTom Barclay氏は述べた。「HTML5は、バナー広告やウェブパブリッシングにおいて重要な技術」と同氏は述べるとともに、Flashは、特に複雑な双方向性が必要なゲームにおいて開発者らによって多用されているということを強調した。
現状のWallabyでは、FLA形式のファイルを選択して変換すると、そのFlashファイルがHTML5、JavaScript、CSSに変換される。ほとんどの描画要素、塗りつぶし、シェイプトゥイーン、モーショントゥイーン、シンボル名、インスタンス名などを含む、ほとんどのFlashファイルが変換されるとBarclay氏は述べた。Adobeの「Air」プラットフォーム上に構築されているため、WindowsとMacのどちらを使用する開発者もこのツールを使用することができる。
組み込まれたロギングツールにより、どの要素が変換されなかったかが通知される。現在のところ、変換されないのはオーディオタグやビデオタグなどである。Adobe Systemsは、今後HTML5のより複雑な部分に対するサポートを追加するかどうか決定する前に、開発者らからのフィードバックを待っていると Barclay氏は述べた。「開発者は、変換後にJQueryやJavaScriptを使用して双方向性を加えることができる」と同氏は説明した。また、同氏は、Wallabyの最初の目標について、Appleが「iOS」でFlashをサポートする予定がないことから、「iPhone」「iPad」「iPod touch」におけるバナー広告の開発をサポートすることであると付け加えた。ただし、Wallabyが出力するHTML5は、任意のWebKitベースのモバイルブラウザに対応する予定だと同氏は述べた（AndroidのデフォルトブラウザもWebKitを基盤としている）。
(http://japan.cnet.com/news/service/20427139/)
そんなわけで、早速簡単なサンプルを作ってみた。
まず、Flashでこんなのを作りました。
で、噂のWallabyで変換してみる
特にエラーも出ず、普通に変換が終了した。
"flashToHTML5.fla"に対して、書き出されたファイルは、
・flashToHTML5.html
・flashToHTML5.css
・flashToHTML5.js
・jquery-1.4.2.js
・flashToHTML5_assetsフォルダ
└・svgblock_0.svg
・svgblock_1.svg
・svgblock_2.svg
でした。
サーバーにアップして確認すると、
お、iPhoneでも動いたー！
ただ、ソースとしてやってることはシンプルで、
・それぞれの静止テキストをsvg（Scalable Vector Graphics）形式に変換し、画像としてHTMLに書き出す。
・CSS3でそれぞれの画像をCSS3の-webkit-transformあたりでアニメーションを表現
・jQueryも一緒に使ってJSで軽く制御（主にループ周り？）
こんなもんです。
うーーーん、このコーディングでHTML5と言っていいのかは難しいところだし、
まだまだこのツールを信頼して実用化するのは厳しいですね。
こんな風に書くのかー、と参考にはできるかもしれないけど。
でも、Adobeの開発者がこういうのを積極的に作って公開する、という姿勢はすごくいいので、
これからの追加開発に期待したいですね！
【追記】
手元にあった、ピグが走るflaも同様に変換して動かしてみた。
PCのChromeでは相当スムーズに動いたけど、iPhone3GSは処理速度的に厳しいっぽい・・・。
この辺はiPhoneの進化待ちってステータスですかね。確実に処理速度は上がっていくだろうし・・・。
まぁ、でも動いただけでテンション上がる上がる！笑
でも、やっぱりベクトルを1つずつsvgに変換して、それぞれdivでくくって同じように動かすんですね。
うーん、canvasとかでやってくれるわけではないのか・・・・。
豪華ランチに連れて行って頂きました！
食は生活を豊かにするものである。
こんばんは、たすくです。
今日は、メンターのＴ田さんに、メンター期間終了ということで、
豪華ランチ（肉）に連れて行って頂きました！！！！
しかも、はるばる原宿まで往復タクシーの送迎付き・・・！！！
ホント至れり尽くせりで・・・。ありがとうございます！
優しいご主人が目の前で焼いてくれます！
ホタテ貝のうにソース。
もうソースがホントに美味しくて、パンとかにつけて食べたかった・・・！！
フィレステーキ・・・！！ガーリックライス・・・！！
結構ボリュームありました！！もうなんか全部美味しかった。なんだこれ。
食後はコーヒーも・・・。
こんな贅沢なランチが食べられるなんて・・・・。
ああ、もう本当にありがとうございます！ごちそうさまでした！
Ｔ田さんとは、担当事業も職種も社歴もぜんっっっぜん違うのですが、
これまで、すごく親身になって話を聞いて頂きました。
この会社を選んだ１つの理由に、チームワークを大切にする文化がある、というのがありまして。
「若いうちからどんどん挑戦できる」ってフレーズは、
裏を返すと「若いうちからビシバシ働かされる」みたいに聞こえがちなのですが、
単にそういう挑戦できるステージがあるというだけではなくて、
そのステージに安心して立てるようにバックアップしてくれている、という印象を持っています。
本当にいい先輩に恵まれているなぁ、と改めて感じた午後でした。
メンター期間は終わってしまいましたが、これからも引き続き宜しくお願いします！
こんばんは、たすくです。
今日は、メンターのＴ田さんに、メンター期間終了ということで、
豪華ランチ（肉）に連れて行って頂きました！！！！
しかも、はるばる原宿まで往復タクシーの送迎付き・・・！！！
ホント至れり尽くせりで・・・。ありがとうございます！
優しいご主人が目の前で焼いてくれます！
ホタテ貝のうにソース。
もうソースがホントに美味しくて、パンとかにつけて食べたかった・・・！！
フィレステーキ・・・！！ガーリックライス・・・！！
結構ボリュームありました！！もうなんか全部美味しかった。なんだこれ。
食後はコーヒーも・・・。
こんな贅沢なランチが食べられるなんて・・・・。
ああ、もう本当にありがとうございます！ごちそうさまでした！
Ｔ田さんとは、担当事業も職種も社歴もぜんっっっぜん違うのですが、
これまで、すごく親身になって話を聞いて頂きました。
この会社を選んだ１つの理由に、チームワークを大切にする文化がある、というのがありまして。
「若いうちからどんどん挑戦できる」ってフレーズは、
裏を返すと「若いうちからビシバシ働かされる」みたいに聞こえがちなのですが、
単にそういう挑戦できるステージがあるというだけではなくて、
そのステージに安心して立てるようにバックアップしてくれている、という印象を持っています。
本当にいい先輩に恵まれているなぁ、と改めて感じた午後でした。
メンター期間は終わってしまいましたが、これからも引き続き宜しくお願いします！