Adobe Animate CCの大型アップデート公開。階層化できるタイムラインやビットマップアニメーションへの対応。VR機能の一般公開にAMP広告対応意向表明も。

今年のAnimateのアップデートは、レイヤーに深度が追加された昨年以上に盛りだくさんです。複雑なアニメーションを簡単に作成できるアセットワープ、階層化できるタイムライン、After Effectsへレイヤーを保持したままのインポート、さらにVRや3Dオブジェクト対応もベータながら初公開されました。それでは早速それぞれの機能を見ていきましょう。

クラシックトゥイーン対応のアセットワープ

新しく追加されたパペットワープツールを使ってハンドルを指定すると、自動的にメッシュが作成されます。ハンドルを操作することで、複雑なシェイプも簡単に変形できます。他の製品ではパペットツールやパペットワープなどと呼ばれている機能がいよいよAnimateにも搭載されました。

そして、アセットワープはクラシックトゥイーンに対応しています。つまり、キーフレームごとに形を変えて、その間を自動的にAnimateにアニメーションさせることが可能です。その際、それぞれのキーフレームで、同じハンドルの組み合わせが使われていることが条件です。下はアセットワープからつくったアニメーションの例です。

パペットワープはビットマップにも使用できます。ということで、Animateでもビットマップアニメーションを作成することが可能になりました。下の図では、カマキリの胴体に複数のハンドルが設定されています。黒い点は固定モードのハンドルで、白い点よりも動きの自由度が制限されます。

レイヤーの親子関係を指定するペアレンティング

タイムラインレイヤーに親子関係を指定できる機能が付きました。子のレイヤーは親レイヤーが動くと一緒に動きます。例えば、下の図では、胴体の子に首、首の子に頭、といった関係を指定して、人体の部品の階層構造を実現しています。すべてのレイヤーの親である胴体を移動させると、体全体がまとめて移動します。

一旦親子関係を構築すると、腿→スネ→足と、親から子へ順番に位置を決めることで、ポーズを楽につくれます。キーフレームごとにこの操作を繰り返せば、ムービークリップを組み合わせてつくるよりも、少ない手順で見通しよくアニメーション作成が行えます。

キーフレームごとに親のレイヤーを変更したり、親のない独立したレイヤーにすることも可能です。

また、新しいタイムラインでは、フレームに対してフィルターや色の効果が適用できるようになりました。トゥイーンを使って効果をアニメーションさせることもできます。

強化されたAfter Effectsとの連携

After Effectsに、Animateで作成したアニメーションをレイヤー情報を保持したままインポートできるようになりました。FlaファイルをAfter Effectにドロップするだけで、Animateのレイヤー構造がAfter Effectsのタイムラインに再現されます。Animateでアニメーションを作り、After Effectsで効果を加えるというワークフローが容易になりました。

下の図は、FlaファイルをAfter Effectsにインポートした状態です。タイムラインにアニメーションが展開されていることが確認できます。

VRコンテンツ作成と3Dモデルのインポート(ベータ)

VR 360およびVR panoramaという新しいドキュメントタイプ(どちらもベータ)が追加され、VR空間に2Dアニメーションを作成できるようになりました。VR 360は、球の内側にテクスチャが展開され、任意の方向を見ることができます。一方、VR panoramaは、円柱の内側にテクスチャが展開されます。つまり上下方向はなく、ぐるっと周囲を見渡すコンテンツになります。VRコンテンツのプレビューのために、新しく「VRビュー」ウインドウが追加されました。

VR空間には3Dオブジェクトを配置することが可能です。glbファイルがサポートされていて、Dimensionから書き出したオブジェクトを読み込むこともできます。MovieClipと同じように、アニメーションやインタラクションを設定することもできます。

新しいWebGLランタイムとglTF対応(ベータ)

WebGLランタイムが刷新され、glTF準拠になりました。glbまたはglTFフォーマットでパブリッシュすることができるため、そのままThree.jsやBabylonJSで動作します。Facebookに3Dコンテンツとして投稿することもできます。標準フォーマットに対応したことで様々なツールと連携できるようになり、WebGLコンテンツの使い道が広がりました。

もちろん、glbファイルをインポートして3Dオブジェクトをアニメーション内に配置することも可能です。また、より高度なアニメーションやインタラクションを実現するためにアドビが拡張したglTF Extendedドキュメントタイプも追加されました。

AMP HTML広告への対応を表明

AMPはGoogleが中心になって推進している、モバイル環境で高速で安全なウェブサイトの閲覧を実現することを目的としたプロジェクトです。今回の発表では、Googleと協力して、AMP HTML向け広告の仕様に準拠したコンテンツをパブリッシュできる機能を実装中であることが明かされました。
モバイル広告用のアニメーションをAnimateでつくれるようになる日はそう遠くはなさそうです。

その他の新機能

上で紹介した以外にも、新しいホーム画面やビデオチュートリアルの提供、Adobe Senseiの力を借りた自動リップシンク、テクスチャのパブリッシュ改善によるHTML5コンテンツのパフォーマンス改善、ブラシツールへの筆圧および傾きオプションの追加など、数々の新機能が追加されています。