![figma-google-calender-addon](https://images.ctfassets.net/ubv4j9m3121x/3T3b9pAKXL3J7llXnK29IC/8e1c4fc723994c3d715f77119937f720/figma-google-calender-addon.png?w=1200&h=630&q=50&fm=png)
GoogleカレンダーのイベントにFigma/FigJamのリンクを同期する方法
今回はFigmaやFigJamのファイルをGoogleカレンダーのイベントスケジュールに簡単にリンクできるchrome拡張「Figma」の使い方を紹介します。FigmaやFigJamを利用する会議のスケジュールを作成したい場合などに便利です。
この記事のターゲット
chrome拡張が利用できるブラウザでGoogleカレンダーを利用している方
Figma/FigJamを使ったファイルを会議で利用している方
モブデザインや振り返りをチームで定期的に行っている方
1. chrome拡張「Figma」をインストールする
chromeウェブストアから拡張機能「Figma」のページにアクセスし、「chromeに追加」ボタンをクリックしてインストールします。
![figma-chrome-addon1](https://images.ctfassets.net/ubv4j9m3121x/7sjYie0PlcTSK3The9zf4c/e643d1d3b22f6572f16ddaf5a614bd2d/CleanShot_2022-11-27_at_11.33.31.png?w=1591&h=938&q=50&fm=png)
「chromeに追加」ボタンを押すと、ブラウザに拡張機能をインストールする確認ダイアログが表示されるので、「拡張機能を追加」をクリックします。
![figma-chrome-addon2](https://images.ctfassets.net/ubv4j9m3121x/5ZxmoAPKXRKVGcfloT2tgu/d4bd73f82dd0edf2ed2e42a6a5c9e340/CleanShot_2022-11-27_at_11.34.09.png?w=1591&h=938&q=50&fm=png)
インストールが完了した状態で、Googleカレンダーにアクセスしイベントを新規作成すると、以下のボタンが表示されるようになります。
「Add FigJam board」:FigJamのファイルを追加する
「Add Figma file」:Figmaのファイルを追加する
![figma-chrome-addon3](https://images.ctfassets.net/ubv4j9m3121x/CiMTIbNHFEST0RbgmJUPo/3f4352b65d92e5b48a3314da0e4591e7/CleanShot_2022-11-27_at_12.47.19.png?w=1594&h=945&q=50&fm=png)
2. GoogleカレンダーからFigmaのアカウントにログインする
拡張機能をインストールしたら、Googleカレンダーの新規追加で「Add FigJam board」「Add Figma file」のどちらかをクリックします。
すると、初回は必ずFigmaのアカウントと連携するためのダイアログが表示されるので、画面に従って設定を行います。
![figma-chrome-addon4](https://images.ctfassets.net/ubv4j9m3121x/2iW0XRjqMGkcEGPs41UkEB/78aea387e4cf79f12673da9f7dad5310/CleanShot_2022-11-27_at_12.48.49.png?w=1594&h=945&q=50&fm=png)
「Log in with Figma」をクリックするとFigmaのログイン画面が表示されるので、紐づけたいファイルにアクセスできるアカウントからログインしてください。
![figma-chrome-addon5](https://images.ctfassets.net/ubv4j9m3121x/6kdVxc3IqRodiIthvSDyIp/eba69787738f687fb1e731ce7208f01a/CleanShot_2022-11-27_at_12.49.24.png?w=1594&h=945&q=50&fm=png)
ログインすると、FigmaアカウントをGoogleカレンダーと連携するための承認画面が表示されるので、「アクセスを許可」をクリックすると連携が完了します。
![figma-chrome-addon6](https://images.ctfassets.net/ubv4j9m3121x/6NDGOGpy7NKoObZPKSxcM3/8270b8cee19363fa771f3fdcb611db2c/CleanShot_2022-11-27_at_12.50.34.png?w=1594&h=945&q=50&fm=png)
3. イベントに紐づけたいFigma/FigJamファイルを選択する
Figmaアカウントと連携できたら、イベントに登録したいファイルを選択できるようになります。
初回は必ず連携画面が表示されますが、次回以降はFigmaのアカウント認証が有効な間はファイルの選択ダイアログに直接遷移します。
ファイル選択ダイアログでは、すでに作成されているファイルを選択するか、左上のファイルの新規作成が選択できます。以下の画像はFigJamファイルを選んだ例です。
![figma-chrome-addon7](https://images.ctfassets.net/ubv4j9m3121x/4D8pujSwyqHmhc49zXeZnJ/74f873b695ddb9d39071e19ab77c5d76/CleanShot_2022-11-27_at_12.53.08.png?w=1594&h=945&q=50&fm=png)
ファイルの新規作成を選択すると、ファイル名の入力を促されます。入力後「Create file」をクリックすると中身が空のファイルが作成されて、そのままカレンダーに登録されます。
![figma-chrome-addon8](https://images.ctfassets.net/ubv4j9m3121x/7j97JFapWpPu6I6vcP1p8T/a3baf298e70405f6ecd495943c0bd10f/CleanShot_2022-11-27_at_12.54.51.png?w=1594&h=945&q=50&fm=png)
chrome拡張をインストールしているブラウザの場合は、ファイル名とアイコンのリンクが表示されます。
![figma-chrome-addon11](https://images.ctfassets.net/ubv4j9m3121x/6GDl604Xv8VKsTk7KTHntO/a044218ff9f4343f5550e60129d1d2b3/CleanShot_2022-11-27_at_12.57.25.png?w=1594&h=945&q=50&fm=png)
また、chrome拡張をインストールしていないブラウザで見た場合でも、カレンダーの詳細にもファイル名がテキストリンクで追記されるようになっているので、問題なくアクセスできるようになっています。
![figma-chrome-addon12](https://images.ctfassets.net/ubv4j9m3121x/4wquOLxF8YdTzrmDI7GxI8/25196ffaca23d43c89e44feb083bf823/CleanShot_2022-11-27_at_13.00.06.png?w=1594&h=945&q=50&fm=png)
複数のファイルを紐づけることもでき、カレンダーのイベントの「Add more files」をクリックするとファイルを追加できるようになっています。
![figma-chrome-addon9](https://images.ctfassets.net/ubv4j9m3121x/2ZUac7Wwv5ehlQOtzoYbpT/e15719cc9379c0d80a830e1b3848c280/CleanShot_2022-11-27_at_12.55.34.png?w=1594&h=945&q=50&fm=png)
以下の画像はFigmaファイルを選んだ例です。
![figma-chrome-addon10](https://images.ctfassets.net/ubv4j9m3121x/2cxly5lh3oeTKFjloRfvVE/7e84bd0370e54172c784b9e8b20c9b0f/CleanShot_2022-11-27_at_12.56.19.png?w=1594&h=945&q=50&fm=png)