Adobe Animate 19.2がリリースされました。マイナーアップデートということもあって、派手な新機能はなく、使い勝手や細かいパフォーマンスの改善です。製品版のバージョンアップの頃は、目新しい目玉機能が前面に押されがちでした。地味でもユーザーの使いやすさが目指されるようになったのは、サブスクリプションの利点でしょう。
とはいえ、何がどう変わったのか。Adobeの「2019年4月リリースのAnimate（バージョン 19.2）の新機能について説明」を読んでも、わかりにくいようです。そこで、改めて説明してみることにしました。なお、アプリケーション名から「CC」がなくなっています。
効果が加わったストリーミングサウンドの分割
ストリーミングサウンドを使った場合なので、ActionScript 3.0ドキュメントの機能です(図001)。
図001■[サウンド]の[同期]に[ストリーミングサウンド]を選ぶ
Adobeの「機能の概要 | Animate | 2019 リリース」のページにはつぎのように説明されています。
オーディオエフェクト
読み込んだオーディオを分割する際に、オーディオエフェクトを保持します。
[タイムライン]の[ストリーミングサウンド]に対して、フレームで[オーディオを分割]することはこれまでもできました(図002)。
図002■[タイムライン]の[ストリーミングサウンド]で[オーディオを分割]する
けれど、問題は[サウンド]に[効果]が加えられていたときです(図003)。[オーディオを分割]した後半の[サウンド]は[効果]が[なし]にリセットされていました。とくに[カスタム]で[エンベロープの編集]をしたときは、またはじめからやり直さなければならないということです。
図003■[サウンド]に[効果]を加える
Animate 19.2ではこの問題がなくなり、分割したあとも[効果]が保たれるようになったのです。
パブリッシュする画像処理の改善
つぎは、HTML5 Canvasドキュメントのパブリッシュについての改善です。Adobeの新機能紹介ページには、つぎのように説明されています。
アップグレードを処理する画像
元の画像設定を維持し、最適化をスキップすることにより、正しい解像度で画像を書き出します。
何をいっているのかわからないかもしれません。筆者にも残念ながら理解しかねます。ちなみに、英語サイトの説明はつぎのとおりです。邦訳は説明文が少しおかしいですし、タイトルに至っては何かを間違ったとしか思えません。
Image handling improvements
Export images with the right resolution by honoring original image settings and bypassing the optimization.
これは特別な設定をした場合のパブリッシュの機能です。[パブリッシュ設定]で、つぎのふたつのオプションをオフにします(図004)。
- [ドキュメントをテクスチャとして書き出し]
- ベクターアニメーションをビットマップに変えます。
- アニメーションは軽くなるもののデータサイズが増えます。
- [画像をスプライトシートに結合]
- 複数の画像をスプライトシートにまとめます。
- サーバーへのリクエストが減らせます。
図004■[パブリッシュ設定]で[画像をスプライトシートに結合]しない
この特別な設定はどういうとき使うのか疑問に感じたかもしれません。試みに、Animate CC 19.1でこの設定を使ってパブリッシュしてみました。すると、13.5MBのかなり大きなPNG画像が1.1MBのJPEGに圧縮されてしまったのです。
図005■PNG画像がJPEGで圧縮されて書き出される(19.1)
これで差し支えない場合も多いでしょう。けれど、画像の形式やサイズは、制作側で管理したいこともあります。同じFLAファイルをAnimate 19.2からパブリッシュすると、書き出されたのはPNGそのまま(13.5MB)の画像でした。つまり、この設定はまさにこういうときに使うということです。
Adobeの新機能ページの説明は、つぎのように改めたらよいでしょう。
最適化のオプションを外すことで、画像をもとの設定と解像度のまま書き出せます。
ブラシと消しゴムの同期設定
Adobe新機能ページのタイトルに消しゴムが抜けているものの、これはひと目見ればわかります(ちなみに、英語サイトのタイトルは「Brush and eraser mirroring」)。
ブラシミラーリング
スケッチ中にブラシおよび消しゴムツールペン先のシェイプとサイズを同期します。
[ブラシツール]と[消しゴムツール]に同期設定のオプションが加わり、デフォルトでオンになっています(図006)。互いのツールのかたちと[サイズ]が同期して変わるのです。
図006■[ブラシツール]と[消しゴムツール]に同期設定のオプションが加わった
アセットワープツールの強化
アセットワープツールは、シェイプはもちろんビットマップでも自由に変形できるAnimate CC 2019から備わった機能です。Adobe新機能ページは19.2で強化された点をつぎのように説明します。意味はわからないことはありません。でも、どこがどう変わったのか謎です。英語サイトにも、これ以上の情報はありません。
アセットワープ
強化されたアセットワープにより、処理とワープの結果をより適切にコントロールできるようになりました。
機能が増えた感じもしませんし、操作の仕方は同じです。内部的なロジックの改善といったことでしょうか。仕方なく、前のバージョン19.1と見比べてみることにしました。つまり、ビフォーアフターです。まず、Animate CC 19.1でPNG画像に[アセットワープツール]を適用してみましょう(図007)。
図007■Animate CC 19.1で[アセットワープツール]を適用
つぎに、まったく同じ素材にAnimate 19.2で[アセットワープツール]を適用します。すると、なんということでしょう！メッシュが細かくなっているではありませんか(図008)!?
図008■Animate 19.2で[アセットワープツール]を適用
よく見ると、縁(アウトライン)の部分は、枝先のようにさらに細かく分けられています。図形の内側は少しくらいゆがんでも気づきません。目立つアウトラインを細かくコントロールすることにより、滑らかに変形しようという匠の工夫だったのです!!って、なぜ筆者が自分で調べて説明しなければならないのでしょう?!
アセットワープが強力なのは、クラシックトゥイーンできることです。19.2の新機能ではないものの、まだ知らない方が少なくないように思います。筆者が試そうとしてとまどったところもあるので、ポイントだけ掲げておきましょう。詳しくは、「Adobe Animate CCの大型アップデート公開。階層化できるタイムラインやビットマップアニメーションへの対応。VR機能の一般公開にAMP広告対応意向表明も。」をご参照ください。
- 対象の素材をシンボルにしてはいけません。
- シェィプあるいはビットマップのまま操作します。
- シンボルのインスタンスに直にアセットワーブは使えません。
- [アセットワープツール]のピンでクリックしてハンドルを加えます。
- トゥイーンをとおして同じハンドルが設定されていなければなりません。
- そのあと[クラシックトゥイーンを作成]します。
先日Twitterに、Animate 19.2でビットマップにアセットワープを使った作例が紹介されていました。アニメーションの可能性を広げるツールといえそうです。
Character Animatorといい、Animate CCのビットマップモーフィング対応といい、Adobeは結構ガチでLive 2Dを殺しに来てるのにあまり知られてないよな pic.twitter.com/QHrPMdVTA8
— のっぴきならない消しゴム (@iong) 2019年5月8日
フレームピッカーの強化
[フレームピッカー]は、シンボルのフレームごとのイメージをパネルで一覧します。その強化について、Adobeの新機能ページはつぎのように説明しています。
フレームピッカーの強化
複数のシンボルを使用して別のフレームのピッカーパネルにそれらを固定します。
ふと疑念がよぎって、英語サイトの説明をGoogle翻訳してみました。こちらの方がましにさえ感じます。
複数のシンボルを操作して、それらを異なるフレームピッカーパネルに固定します。
[フレームピッカー]は、デフォルトでは選んでいるシンボルのフレームが表示されます。つまり、別のシンボルを選べば表示が切り替わってしまうということです。Animate 19.2の[フレームピッカー]には、右上にピンのアイコンが加わって、表示するシンボルを固定できるようになりました。その右のアイコンで複数のパネルが開けますので、それぞれで異なったシンボルのフレームを見ながら作業ができるということです。
図009■[フレームピッカー]に表示するシンボルを固定
テクスチャアトラスの機能強化
テクスチャアトラスの機能強化について、Adobeの新機能ページはつぎのように説明します。あいかわらず、わかったようなわからないような文章です。
テクスチャアトラスの機能強化
テキストのアトラス出力を最適化します。最適化された出力を使用して、複数のビットマップを生成して、テクスチャアトラスをより適切にコントロールできるようにします。
「テキストのアトラス」は誤訳だろうと思ったら、原文にもそう書いてありました。
Texture atlas enhancements
Optimize your text atlas outputs. Get better control over your texture atlases with optimized output and by generating multiple bitmaps.
シンボルから[テクスチャアトラスを生成]するときに、4つの機能が加わりました(図010)。
- [サイズを最適化]で画像サイズを削減します。
- 幅と高さを2の累乗にしないことでサイズを下げます。
- 指定した[画像のサイズ]に収まらないとき複数のビットマップを生成します。
- これまでは「出力フレームが指定されたテクスチャアトラスのサイズを超えています」という警告が表示されました。
- 解像度が選べます。
- [2x]と[3x]が選べるにようになりました。
- [幅]と[高さ]が変わります。
- [Animation.jsonファイルを最適化]が加わりました。
- ファイルサイズを縮小します。
図010■[テクスチャアトラスを生成]のダイアログボックス
Animation.jsonはどう最適化されるのか、円のシェイプをひとつ描いただけのシンボルで試しました。まずは、最適化していない場合です。
{
"ANIMATION": {
"name": "circle",
"SYMBOL_name": "circle",
"TIMELINE": {
"LAYERS": [
{
"Layer_name": "レイヤー_1",
"Frames": [
{
"index": 0,
"duration": 1,
"elements": [
{
"ATLAS_SPRITE_instance": {
"name": "0000",
"Position": {
"x": -50,
"y": -50
}
}
}
]
}
]
}
]
}
},
"metadata": {
"framerate": 24
}
}
[Animation.jsonファイルを最適化]すると、中身がつぎのように変わりました。インデントを省き、プロパティ名を縮めることによりサイズを絞っているようです。
{
"AN": {
"N": "circle",
"SN": "circle",
"TL": {
"L": [
{
"LN": "レイヤー_1",
"FR": [
{
"I": 0,
"DU": 1,
"E": [
{
"ASI": {
"N": "0000",
"POS": {
"x": -50,
"y": -50
}
}
}
]
}
]
}
]
}
},
"MD": {
"FRT": 24
}
}
むすび
Adobeの新機能ページで残る項目は、「ファイル保存の最適化」です。これは読んだとおりですし、比べるのも面倒ですから確認にとどめます。
ファイル保存の最適化
インクリメンタルに、簡単かつよりよいパフォーマンスで、Animate のドキュメント（FLA および XFL）を保存します。自動リカバリモードの時間を節減し、複雑なデータを速やかに保存します。
はじめに述べたとおり、派手さはないものの、使い勝手や細かいパフォーマンスの改善が加えられています。たとえ地味でも、ユーザーにとって価値のある改善です。ところが残念ながら、Adobeサイトにそれを伝えようとする熱意が感じられません。ユーザーが新機能を知らなければ、使ってみようとも思わないはずです。せっかくの匠の苦労が報われなくなってしまいます。「義憤」に駆られて書いたのがこの記事です。