FigmaとNotionを連携してアイデアを作る方法。

KatayamaRei

みなさんは、やりたいことや作りたいものなどのアイデア出しをするとき、どんなツールを使っていますか?

今回は、Figmaのオンラインホワイトボード「FigJam」と、Notionを連携してアイデアを作る方法をご紹介。

FigJamで書き出した付箋を、このようにNotionに簡単に取り込む方法を解説します!

upload in progress, 0

 

Notionはこちらから

https://notion.grsm.io/rozwvoev3k2v

 

🎬 Director:Rei
✍🏻 Writer:みのくるみ

 


1.今回ご紹介する裏技

今回ご紹介するのは、このようにFigJamで作った沢山のアイデアを、Notionに自動で取り込んでデータベース化する方法です。

Notion側ではこのようにデータベースに書き出され、「付箋の色」や「記入したユーザー」などの情報も自動で入ってくれます。

カラーのタグは後から文字を変更することができるので、アイデアの整理も簡単です。


2.使うツール

ここからは、今回使うツールと、付箋をNotionに書き出す方法をご紹介します。

今回使うツールは、こちらの「FigNotion」というFigmaのプラグイン。

このプラグインを使うことで、オンラインホワイトボードの「FigJam」とNotionとを連携することができ、FigJamで書き出した付箋をNotionに書き出すことができます。

アイデア出しをするときは、まずは広いホワイトボードに書き出したり、付箋に書いて並べたりして、それから表やノートなどにまとめることが多いですよね。

このFigNotionを使えば、そんな工程をスムーズに行うことができます。


3.FigJamの付箋をNotionに取り込む方法

さっそく、FigJamでアイデア出しをした内容をNotionに取り込む方法を解説します。

3-1.FigJamとNotionを接続する

1.下記からFigJamの新しいボードを作ります。(すでに使っているボードがある場合はそれを使ってもOKです)

 https://www.figma.com/ja-jp/figjam/

 

2.ボードを開き、ツールボックス一番右の「+」ボタンをクリック。「FigNotion」を検索し、「実行」をクリックします。

3.Notionへのアクセスが求められるので、「Allow access」をクリックします。

4.ブラウザが開きNotionのリクエスト画面が表示されるので、「ページを選択する」をクリックし、連携したいページをチェックし、「アクセスを許可する」をクリックします。

5.FigJamに戻り、この画面が出ていたら設定完了です。

3-2.Notion側での設定

次に、Notion側で付箋を取り込むデータベースを用意します。

連携したページに新しくデータベースを作成し、プロパティとタイトルを次のように設定します。

・タイトル:Name
 →付箋に書いたテキストが入ります
・セレクトプロパティ:Color
 →付箋の色が入ります
・テキストプロパティ:Author
 →付箋を書いたユーザー名が入ります

※付箋の色とユーザー名は、不要な場合は作成しなくても問題ないです。

上記と同じデータベースが完成したら、Notion側の準備は完了です。

3-3.FigJamで付箋を取り込む

それでは、いよいよFigJamの付箋をNotionに取り込んでみましょう。

1.FigJamを開き、付箋にアイデアを書き出します。書き出した付箋は必要に応じて色分けします。

2.付箋をすべて選択し、ウィンドウ内の「Add to Notion」をクリックします。

※ウィンドウが消えてしまった場合は、右下の「+」→「FigNotion」で検索する→「実行」で再表示できます。

これで、付箋の取り込みは完了です。

Notion側で先程用意したデータベースを見てみると、このように「Name」には付箋に書き出した内容が、「Color」には付箋の色が、「Author」にはユーザー名が表示されています。

カラーのタグは後から文字を変更することができるので、後々タグでジャンル分けしたいものを、あらかじめ付箋の色で区別しておくと便利そうです。


4.FigJam自体もNotionに埋め込める!

実はNotionの埋め込み機能を使うと、FigJamのボードをそのままNotionに埋め込むこともできます。

1.FigJamで右上の「共有」ボタンから「リンクをコピーする」をクリックします。

2.コピーしたリンクをNotionにペーストし、「プレビューとして貼り付け」をクリックします。(FigmaとNotionを初めて接続する場合は、ここで接続ができます)

すると、このようにNotion上にFigJamのホワイトボードを設置することができます。

ぜひ付箋の取り込みと合わせて、こちらも便利に活用してみてください!


まとめ

以上が、FigmaとNotionを連携してアイデアを作る方法のご紹介でした!

過去の記事では、Notion上でアイデア出しをするテンプレートも紹介しているので、よかったらこちらも読んでみてください。

 

「暮らしとNotion。」で販売しているNotionテンプレートの一覧はこちらから!

https://store.kurashi-notion.com/collections/all

書籍「Notionライフハック」も好評発売中です!36種類のテンプレート付きで、Notionの具体的な活用方法をたっぷりご紹介しています。

https://amzn.to/45WYWBT

YouTubeでもNotionの使い方具体的な活用例などをご紹介しているので、こちらもよかったら合わせてご覧ください。

https://www.youtube.com/c/rei-wkndcreator

引き続き、忙しい毎日が捗るような、暮らしとNotionに関する情報を発信していきます。

最後まで読んでいただき、ありがとうございました!
また次回の記事でお会いしましょう。

 

    Newsletter

    新しい記事やNotionに関するアップデートなど、最新のコンテンツをお届けします!