FigmaからアニメーションWebP画像をエクスポートする
この動画では、TinyImageプラグインを使って、デザインのレイヤーからアニメーションWebP画像をFigmaで直接エクスポートする方法を紹介します。
TinyImageでは、GIFエクスポーターと同じアニメーションエディターのUIとワークフローを使って、アニメーションをアニメーション.webpファイルとしてエクスポートできます。
GIFエクスポートと同じアニメーションエディターを使う
アニメーションWebPのワークフローでは、GIFのワークフローと同じフレームの選択、並べ替え、タイミング、トランジション、プレビューのコントロールを使います。
これらの共通のコントロールを設定するには、GIFアニメーションエディターのガイドを参照してください。
アニメーションWebP形式でエクスポートする
アニメーションのプレビューの準備ができたら、次の手順を行います。
- アニメーションツールバーのエクスポート形式のドロップダウンを開きます。
- Animated WebPを選択します。
- Exportをクリックして、アニメーション
.webpファイルをレンダリングします。
レンダリングが終わると、TinyImageはエクスポートしたアニメーションWebPファイルを自動的にパソコンにダウンロードします。
Figmaからダウンロードしたファイルの保存 Figmaのデスクトップアプリを使っている場合は、ファイルをダウンロードするためのダイアログが表示されます。一方、WebブラウザでFigmaを使っている場合は、デフォルトでファイルが自動的にパソコンにダウンロードされます(通常はパソコンのDownloadsフォルダに保存されます)。