Figmaからのダウンロード方法

Figmaで作成したデザインをダウンロードしたい場合、多くの選択肢があります。デザインの個々の要素（アイコンやボタンなど）を個別のファイルとして簡単にダウンロードしたり、デザイン全体（ウェブページやバナーなど）をまとまった画像やPDFとして保存したり、プロジェクト全体のバックアップをダウンロードすることもできます。このWikiHowでは、Figmaプロジェクトのあらゆる側面をコンピュータにダウンロードする方法を説明します。

方法1

個々の画像、ボタン、アイコンをダウンロードする

1. Figmaでプロジェクトを開きます。フレームやアートボード内の1つまたは複数の個別の画像をダウンロードしたい場合は、とても簡単です。まず、Figma でプロジェクトを開きます。
2. エクスポートしたい画像を選択します。1つの画像をダウンロードしたい場合は、その画像をクリックして選択します。複数の画像を選択するには、Shiftキーを押しながら、それぞれの画像をクリックします。選択された画像は、画面左側のレイヤーパネルでハイライトされます。
3. "エクスポート "の隣にある＋をクリックします。これは、Figmaの右側にあるデザイン・パネルの一番下にあります。
4. 画像のフォーマットを選択します。デフォルトの形式はPNGですが、メニューをクリックして別の形式を選ぶことができます。他の選択肢は、JPG、SVG（ワープせずにサイズを変更できるベクター画像用）、PDFです。
5. サイズを選択します。デフォルトは1x（正確なサイズ）ですが、画像フォーマットに応じてサイズを増減できます。

   • PDFとしてエクスポートする場合は、サイズを変更することはできません。
6. 追加サイズおよび/またはフォーマットをダウンロードに含める（オプション）。選択した画像を複数のサイズまたはフォーマットでダウンロードしたい場合は、そうすることができます。画像をJPGやPDFなど複数のフォーマットで、または複数の寸法でダウンロードする必要がある場合に、この操作を行うことができます。他のサイズやフォーマットを追加するには

   • エクスポートパネルの上部にある+をクリックします。
   • メニューからPDFやJPGなどの別のフォーマットを選択します。
   • 別のサイズを選択します（PDF以外のフォーマットを選択した場合）。
   • ダウンロードに含めたい他のサイズやフォーマットも同様に選択します。
7. エクスポートボタンをクリックします。右下のエクスポートパネルにあります。選択した画像を含むZIPファイルをコンピュータに保存するよう促されます。

   • ダウンロードが自動的に開始されない場合は、ファイルを保存するコンピュータ上の場所を選択し、[保存]を選択します。

方法2

デザインを画像またはPDFとしてダウンロードする

1. Figma でプロジェクトを開きます。Figmaで作成した画像やモックアップを画像やPDFファイルとして保存したい場合、いくつかの方法があります。まず、Figma でプロジェクトを開きます。

   • この方法では、複数の要素/レイヤーを含むデザイン全体(ランディングページ全体、ヒーロー画像、バナー広告など)を、共有可能な画像またはPDFファイルとしてダウンロードすることができます。
   • ウェブサイトやアプリのモックアップ全体を、各フレームがそれぞれのページにある1つのPDFとしてダウンロードしたい場合は、こちらをご覧ください。
2. ダウンロードしたいものを選択します。例えば、PNG画像として保存したいランディングページを作成した場合、ランディングページ全体を囲むボックスを描きます。選択範囲のすべてが、Figmaの左側にあるフレーム・パネルでハイライト表示されます。

   • フレームを1つだけ選択するには、そのフレームをクリックして選択します。
   • 複数のフレームを選択するには、Shift キーを押しながら各フレームをクリックします。
   • これは、プロジェクト全体をPDFや画像としてダウンロードし、他の人と共有したい場合に便利です。
3. 選択範囲を枠で囲む。選択したデザインが別々のファイルとしてではなく、1つの完全な画像またはPDFとしてダウンロードされるようにするには、選択範囲をフレームで囲む必要があります。方法は次のとおりです：

   • 選択範囲を右クリックまたはControlキーを押しながらクリックします。コンテキストメニューが表示されます。
   • メニューから「選択範囲を枠で囲む」をクリックします。これで、選択範囲内のすべてが1つの画像としてグループ化されます。
   • このオプションを選択しないと、選択範囲内のすべてが完成したデザインではなく、別々のファイル（別々のアイコンファイルや背景画像など）としてダウンロードされます。
4. "エクスポート "の隣にある+をクリックします。これは、Figmaの右側にあるデザイン・パネルの一番下にあります。
5. ダウンロードのフォーマットを選択します。デフォルトの形式はPNGですが、メニューをクリックして別の形式を選ぶことができます。他の選択肢は、JPG、SVG（ワープせずにサイズを変更できるベクター画像用）、PDFです。
6. サイズを選択します。デフォルトは1x（正確なサイズ）ですが、画像形式（PNG、JPG、SVG）で保存する限り、必要に応じてサイズを増減できます。

   • PDFで保存する場合は、1倍でしかダウンロードできません。
7. 追加サイズおよび/またはフォーマットをダウンロードに含める（オプション）。同じデザインの別のフォーマットやサイズをダウンロードに含めるのは簡単です。方法は以下の通りです：

   • 書き出しパネルの上部にある+をクリックします。
   • メニューから別のフォーマット（PDFやJPGなど）を選択します。
   • 別のサイズを選択します（PDF以外のフォーマットを選択した場合）。
   • ダウンロードに含めたい他のサイズやフォーマットについても同じことを繰り返します。
8. ⇧ Shift+⌘ Command+E (Mac) または ⇧ Shift+Control+E (PC)を押します。このキーボードショートカットを押すとExportメニューが開き、エクスポート用にマークされたファイルのリストが表示されます。

   • 左上の Figma メニュー（Fのマーク）をクリックして、File を選択し、Export... をクリックしても、ここにたどり着けます。
9. チェックボックスを使って、保存する要素を選択します。エクスポートリストには、作成するために選択した画像やPDFと、それらの画像やPDFを構成する個々の要素が含まれています。デザインを構成する個々の画像をダウンロードしたくない場合は、チェックマークをクリックして、ダウンロードパッケージから削除することができます。

   • 複数ページのウェブサイトなど、複数のフレームを含むデザインをダウンロードする場合、デフォルトでは常に各フレームごとに別々のPDFファイルがダウンロードされます。これらのファイルが不要な場合は、チェックを外すことができます。
10. エクスポートボタンをクリックしてファイルを保存します。これはエクスポートウィンドウの一番上にあります。これにより、選択したデザインが1つのZIPファイルとしてコンピュータにダウンロードされます。

方法3

プロジェクトをPDFとしてダウンロードする

1. Figma でプロジェクトを開きます。Figma でプロトタイプ全体を作成し、各フレームが各ページにある高品質の PDF として保存したい場合は、Figma の PDF エクスポート・ツールを使用します。まず、Figma でプロジェクト・ファイルを開きます。

   • この方法は、プロトタイプの各ページや画面をそれぞれのフレームで作成し、余分な余白のない、1つの複数ページのドキュメントとして、デザイン全体を表示したい場合に最適です。
   • 複数のフレームを1つのPDFに配置したり、フレームごとに別のPDFを作成したい場合は、こちらを参照してください。
2. PDFに含めたいフレームをすべて選択します。デザイン内のすべてのフレームの周りを選択ボックスでドラッグすると、すばやく選択できます。

   • Shift キーを押しながら各フレームをクリックすると、複数のフレームを選択することもできます。
3. Figmaメニューをクリックします。Figmaの左上にある「F」アイコンです。
4. Fileメニューを選択します。Figmaメニューの一番上にあります。
5. Export frames to PDF...をクリックします。メニューの一番下にあります。選択したフレームを含むPDFファイルが作成されます。

   • この処理には、選択したフレームの数にもよりますが、数秒から1分ほどかかります。
6. PDFをコンピュータに保存します。ダウンロードが自動的に開始されない場合は、保存場所を選択して「保存」をクリックします。PDFがコンピュータにダウンロードされます。

方法4

プロジェクトのローカル・コピーをダウンロードする

1. Figma でプロジェクトを開きます。Figmaプロジェクト全体のコピーを、Figmaの.figma形式で簡単にダウンロードすることができます。これは、Figma デザインを通常のバックアップに含めたい場合や、オフラインで作業しているときにプロジェクトを開きたい場合に便利です。
2. Figmaメニューをクリックします。左上の "F "アイコンです。
3. ファイルメニューを選択します。別のメニューが展開されます。
4. ローカルコピーを保存をクリックします。コンピュータのファイル・ブラウザが表示されます。
5. ファイル名を付けて、保存をクリックします。これで、Figma プロジェクト全体のコピーがコンピュータに保存されます。

   • Figmaで.figファイルを開くには、ファイル・ブラウザーのインポート・ボタン（四角に曲がった矢印のように見えます）をクリックし、そのファイルを選択します。

この記事は、CC BY-NC-SAの下で公開されている「 Figmaからダウンロードする方法 」を改変して作成しました。特に断りのない限り、CC BY-NC-SAの下で利用可能です。