レイヤーからアニメーションPNG（APNG）画像を作成する

TinyImageのGIFエクスポートと同じアニメーションエディターのワークフローで、選択したFigmaレイヤーからアニメーションPNG（APNG）ファイルをエクスポートします。

FigmaからアニメーションPNG（APNG）画像をエクスポートする

この動画では、TinyImageプラグインを使って、デザインのレイヤーからアニメーションPNG（APNG）画像をFigmaで直接エクスポートする方法を紹介します。

TinyImageでは、GIFエクスポーターと同じアニメーションエディターのUIとワークフローを使って、アニメーションをアニメーション.png（APNG）ファイルとしてエクスポートできます。

GIFエクスポートと同じアニメーションエディターを使う ​

APNGのワークフローでは、GIFのワークフローと同じフレームの選択、並べ替え、タイミング、トランジション、プレビューのコントロールを使います。

これらの共通のコントロールを設定するには、GIFアニメーションエディターのガイドを参照してください。

アニメーションPNG（APNG）形式でエクスポートする ​

アニメーションのプレビューの準備ができたら、次の手順を行います。

  1. アニメーションツールバーのエクスポート形式のドロップダウンを開きます。
  2. Animated PNGを選択します。
  3. Exportをクリックして、アニメーション.pngファイルをレンダリングします。

レンダリングが終わると、TinyImageはエクスポートしたAPNGファイルを自動的にパソコンにダウンロードします。

Figmaからダウンロードしたファイルの保存 Figmaのデスクトップアプリを使っている場合は、ファイルをダウンロードするためのダイアログが表示されます。一方、WebブラウザでFigmaを使っている場合は、デフォルトでファイルが自動的にパソコンにダウンロードされます（通常はパソコンのDownloadsフォルダに保存されます）。