Googleスプレッドシートを反映してくれるプラグイン「Google sheets sync」

1.「Google sheets sync」とは？

Googleスプレッドシートの内容をFigma内のモックに反映してくれるプラグインです。

2.「Google sheets sync」のインストール方法

FIgmaのコミュニティで「Google sheets sync」と検索します。

インストールボタンをクリックし完了です。

3.「Google sheets sync」の使い方

反映させたいGoogleスプレッドシートを用意します。

Figmaではモックを用意します。モックはコンポーネントにしておきます。

レイヤー名はGoogleスプレッドと同じにしておきましょう。また、レイヤー名の前には「＃」を忘れずに入れてください。

次にプラグインを使用して、モックにGoogleスプレッドシートの内容を反映していきます。

モックを選択し、「Plugin」から「Google sheets sync」を選択します。

すると、ポップアップが表示されます。

GoogleスプレッドシートのURLを入力してください。

URL入力後、「Fetch&Sync」をクリックし完了です。

Googleスプレッドシートの内容がモックに反映されていれば完了です。