Figmaの各種書き出し保存方法（Figma）

今回の記事では、Figmaにおけるファイルや画像の書き出し保存方法について記載します。

1. ローカルコピーを保存

プロジェクト全体を『.fig』という形式でローカル上に保存する方法です。
【メインメニュー】→【ファイル】→【ローカルコピーを保存】から保存できます。
保存した『.fig』ファイルはFigmaにインポートすることで再度確認及び操作を行えます。

2. フレームをPDFにエクスポート

プロジェクト内のフレームを一括でPDF形式で保存する方法です。
【メインメニュー】→【ファイル】→【フレームをPDFにエクスポート】から保存できます。

3. エクスポート

プロジェクト全体及び個々のオブジェクトを以下の形式で保存する方法です。

• PNG

• JPG

• SVG

• PDF

エクスポート設定の追加

エクスポートする際には、対象にエクスポート設定を追加する必要があります。
【プロパティパネル】→【エクスポート】の『＋』から追加できます。

何も選択していない状態で『＋』を選択すると、下画像のような状態になります。
この状態ではページ内に存在するオブジェクトすべてが収まるようにエクスポートが設定されます。

オブジェクトを選択した状態で『＋』を選択すると、下画像のような状態になります。

また、【スライスツール】を使用することで特定範囲を選択してエクスポート設定をすることもできます。

エクスポートについての詳細は以下の記事に記載しています。

エクスポート設定済み一括エクスポート

何も選択していない状態でのエクスポートもしくは【メインメニュー】→【ファイル】→【エクスポート】から、ページ内でエクスポート設定をしている項目を一括でエクスポートできます。

前述の方法でエクスポートを実行しようすると、Figma画面上右上に下画像のポップアップが表示されます。
あとは書き出したい項目にチェックが入っている状態で右上の『エクスポート』ボタンを選択すれば、一括エクスポートで保存できます。

まとめ

以上、Figmaにおけるファイルや画像の書き出し保存方法でした。