figJam-how-to-export
公開日: 2022.07.22  | 更新日: 2022.07.22

FigJamの付箋やフローチャートをまとめて書き出す方法

今回はFigJamで書き出した大量の付箋やフローチャートをまとめて書き出す方法を紹介します。対応しているのは、PNG・JPGといった画像形式、PDF形式、CSV形式(付箋のみ)で、ワークショップの実施記録やアイデアのドキュメント化に役立ちます。

この記事のターゲット

  • FigJamのワークショップ結果を画像で書き出したい方

  • FigJamで濁声したフローチャートなどの図を画像に書き出したい方

  • FigJamで書き出した付箋をテキストデータで書き出したい方


PNG・JPG・PDF形式で書き出す

FigJamの描画エリアをPNGやJPGの画像形式で書き出す方法は次のとおりです。

  1. 左上の「F」アイコンからメニューを開き「File」を選択

  2. 「File」のメニューから「Export as...」を選択

  3. 開かれたダイアログのFile typeで「PNG」または「JPG」を選択

  4. Exportボタンを押してファイルを保存

ダイアログ内のオプションでBackground(背景)の描画方法も次の3つから選択できます。

  • Grid:グリッド表示

  • Transparent:透過

  • Solid:塗りつぶし(白)

export1

実際に書き出されたイメージは以下の通りです。(BacgroundはSolid)

export2

CSV形式で書き出す(付箋のみ)

画面内の全ての付箋データをCSV形式のテキストデータとして一括出力する方法は次のとおりです。

  1. 左上の「F」アイコンからメニューを開き「File」を選択

  2. 「File」のメニューから「Export as...」を選択

  3. 開かれたダイアログのFile typeで「CSV」を選択

  4. Exportボタンを押してファイルを保存

このとき対象となるのはFigJam標準の付箋上のテキストデータのみで、StickyやWidgetなどに書き出されたテキストは出力の対象外となります。

export4

実際に書き出したCSVファイルをNumbers(Macの表計算ソフト)で開くと以下のようになります。テキスト本文と、記入したユーザー名が一覧で出力されます。

section

逆に、箇条書きのテキストで書き出されたアイデアを付箋に変換できる便利なプラグインも以下の記事で紹介しているので、参考にしてください。

FigJamで箇条書きのテキストから複数の付箋に書き出す方法

今回はFigJamで付箋を効率的に作成するプラグイン「Create Sticky From Text」の紹介です。グループワークやディスカッションでテキストエディタなどで溜めた箇条書きのテキストを一括で付箋に書き出すことができるので、事前準備や作業効率化に役立ちます。 ... 続きを読む

figjam-create-sticky-from-text-plugin

セクションごとに書き出す

FigJamのSection機能を利用すると複数の付箋やオブジェクトをまとめることができます。

概念としては、FigmaのGroup機能に近いです。

そして、このSectionでまとめた単位で書き出しをすることができます。

種類は、全体の書き出しと同様にPNG・JPG・PDF・CSV形式が利用できます。

export3

Sectionで書き出したイメージは以下の通りです。

赤いもの

セクションの詳しい使い方については以下の記事でも紹介していますので、参考にしてください。

FigJamで付箋やオブジェクトをまとめる「Section」の使い方

今回はFigJamで付箋など様々なオブジェクトをグルーピングできる「Section」機能の使い方を紹介します。miroで言うところの「Frame」と同じような使い方ができ、グループしなくてもまとまりで扱いやすくなります。 ... 続きを読む

figjam-how-to-use-section


この記事を読んだ方におすすめの記事

FigJamの作業が捗る便利なウィジェットの使い方

今回は、FigJamで2021年10月19日にアップデートで公開された新機能のウィジェットについて紹介します。ウィジェットは、ToDOリストのような機能をコンポーネントとして呼び出せるツールで、ディスカッションやブレインストーミングに役立ちます。 ... 続きを読む

figjam-widgets-collection

Figmaで簡単にフローチャートや画面遷移図をつくる方法

今回は、Figmaで図形やフレームを追従する矢印でつないで、簡単にフローチャートや画面遷移図をつくる方法を紹介します。サイトマップ作成やアプリケーションのUXを検討する際に、画面同士を矢印で繋ぐことで動線を検討したり、概念モデルを整理するのに役立ちます。 ... 続きを読む

figma-connect-with-arrows

FigmaやFigJamで使えるウィジェット機能の使い方

今回はFigmaで新しく使えるようになったウィジェット機能について解説します。ウィジェットは元々FigJamで先行利用できていた機能で、プラグインとは異なり複数名でコラボレーションする際に複数名同時に活用できるツールとなっています。 ... 続きを読む

figma-how-to-use-widget


最新の記事を見る
広告
この記事を書いた人
うえんつ

うえんつ

X a.k.a Twitter
B2B領域のSaaS・アプリケーション開発などを組織で取り組むことが得意なプロダクトデザイナーで、このブログのオーナーです。
今の関心事
Figma・UIデザイン・UXリサーチ・QOL・旅行
広告