Flash Professional:マルチプラットフォームを制覇しよう 第1回 今すぐ試そう!HTML5書き出し機能

Flash Professional CC は、HTML5 Canvasを使うことでHTML5書き出しをサポートしています。アップデーター(Ver.13.1 – 2013年12月4日リリース)で更に強化されたHTML5の書き出し機能について、サンプルファイルを使って手順を紹介していきます。

Flash Professional CC の体験版をダウンロード サンプルファイルをダウンロード

新しくなったHTML5書き出し

2013年12月4日、Flash Professional CCのアップデータが公開されました。Flash Professional CC 13.1では、HTML5コンテンツ開発に関する機能がさらに強化されています。

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

※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コンテンツへ書き出す。

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

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

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