hiyokojump3

Flash Professional CC:今すぐ試してほしい! 新しいHTML5書き出し

Date

Flash Professional CCをダウンロードする

サンプルをダウンロードする

新しくなったHTML5書き出し

12月4日、Flash Professional CCのアップデータが公開されました。Flash Professional CC 13.1では、HTML5コンテンツ開発に関する機能がさらに強化されています。[Toolkit for CreateJS]パネルがなくなり、その代わり、

  • 新しいドキュメント形式「HTML5 Canvas」を追加
  • 従来より多くの描画/アニメーション機能をHTML5コンテンツ制作で利用可能に
  • [アクション]パネルにJavaScriptを記述してコンテンツを制御することが可能に(CreateJSのコードヒントを表示可能)
  • 作成したコンテンツをHTML5コンテンツ(HTML+JavaScript/CreateJS)として書き出し

などの機能追加や強化がおこなわれ、HTML5オーサリングツールとして充実しました。

try_html5canvas_01

Flash Professional CC 13.1では[Toolkit for CreateJS]パネルがなくなっていますが、HTML5コンテンツへの書き出しにはCreateJSを利用しています。

手元のflaファイルですぐに試せる!

HTML5コンテンツへ書き出しできるのはHTML5 Canvasドキュメント形式からのみですが、他の形式のflaファイルをHTML5 Canvasドキュメント形式に変換するコマンド「ドキュメント形式をAS3からHTML5 Canvasに変換」が用意されています。変換後、HTML5コンテンツへ書き出しできます。 その手順は、とても簡単です。

  1. 変換したいflaファイルを開く。
  2. メニューからコマンド「ドキュメント形式をAS3からHTML5 Canvasに変換」を選択する。
  3. 変換したファイルの保存先を選択する。
  4. パブリッシュしてHTML5コンテンツへ書き出す。

try_html5canvas_02

ぜひ、みなさんもお手元のflaファイルで試してみてください。
下図は、このコマンドを使ったサンプルです。

try_html5canvas_03

変換前後のサンプルを見る

なお、変換する際、[アクション]パネルに記述してあるActionScriptはコメントアウトされ(つまり、ActionScriptの内容は無効に)、Toolkit for CreateJS用のスクリプト(「/*js */」コメントブロックを使用したJavaScript)はその部分が抜き出されます。

try_html5canvas_04

つまり、Toolkit for CreateJS用の部分のみが、そのまま動くように変換されるわけです。また、ActionScript部分も消去されずにコメントアウトされるだけなので、それを見ながら新たにJavaScriptを記述していく、といったワークフローもできますね。

また、Flash Professional CC 13.1では、利用しているCreateJSのバージョンが以前より上がっています。CreateJSでは、バージョンアップ時に記述形式が変更されることがあるので、変換後は一通り動作チェックをお忘れなく。

Flash Professional CCをダウンロードする

サンプルをダウンロードする