「Figmaのファイルが更新されたのに気づかず、作業の手戻りが発生してしまった…」
「更新があるたびに、関係者に手動で連絡するのが面倒で、本来のデザイン業務に集中できない…」
このように、Figmaの更新に関する情報共有の遅れや、手作業での通知に課題を感じていませんか？
もし、Figmaで特定のファイルが更新された際に、Slackなどのチャットツールへ自動で通知が届く仕組みがあれば、デザインの変更点をチームに共有できます。
コミュニケーションコストを削減しながら、より重要なデザイン作業に集中する時間を生み出すことも可能です！
今回ご紹介する自動例はプログラミングの知識がなくても簡単に設定できるので、ぜひこの機会に導入して、チームのデザインワークフローをさらにスムーズにしましょう！
とにかく早く試したい方へ
YoomにはFigmaのファイル更新を通知する業務フロー自動化のテンプレートが用意されています。
「まずは試してみたい！」という方は、以下のバナーをクリックして、すぐに自動化を体験してみましょう！
Figmaでファイルが更新されたら、Slackにメッセージを送る
試してみる
■概要
Figmaでデザインファイルを更新した際、関係者への共有を都度Slackで行うのは手間がかかる作業ではないでしょうか。また、手作業での通知は、連絡漏れや遅延といったコミュニケーションロスに繋がりかねません。このワークフローを活用すれば、FigmaとSlackを連携させ、ファイルの更新をトリガーに自動で通知を送れるため、こうした課題をスムーズに解消できます。
■このテンプレートをおすすめする方
- FigmaとSlackを連携させ、ファイル更新時の通知を自動化したいデザイナーの方
- デザインの進捗共有を効率化し、チームの生産性を向上させたいディレクターの方
- 手作業による通知の手間や、連絡漏れなどのミスをなくしたいプロジェクトマネージャーの方
■このテンプレートを使うメリット
- Figmaでのファイル更新を検知し、Slackへ自動でメッセージが送信されるため、これまで手作業での通知に費やしていた時間を短縮できます
- 手動での連絡による通知漏れや、関係者への共有遅延といったヒューマンエラーを防ぎ、スムーズな情報共有を実現します
■フローボットの流れ
- はじめに、FigmaとSlackをYoomに連携します
- 次に、トリガーでFigmaを選択し、「ファイルが更新されたら」というアクションを設定します
- 続けて、オペレーションでFigmaの「ファイル情報を取得する」アクションを設定し、更新されたファイルの詳細情報を取得します
- 最後に、オペレーションでSlackの「チャンネルにメッセージを送る」アクションを設定し、取得したファイル情報を含んだメッセージを指定のチャンネルに送信します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- Slackへの通知設定では、メッセージを送るチャンネルを任意で指定することが可能です
- 通知メッセージの本文は、固定のテキストを設定するだけでなく、トリガーや前段のオペレーションで取得したファイル名や更新日時などの情報を変数として埋め込むこともできます
■注意事項
- Figma、SlackのそれぞれとYoomを連携してください。
Figmaの更新をSlackに通知するフローを作ってみよう
それではここから代表的な例として、Figmaでファイルが更新された際に、その情報をSlackに自動で通知するフローを解説していきます！
ここではYoomを使用してノーコードで設定をしていくので、もしまだYoomのアカウントをお持ちでない場合は、こちらの登録フォームからアカウントを発行しておきましょう。
※今回連携するアプリの公式サイト：Figma／Slack
[Yoomとは]
フローの作成方法
今回は大きく分けて以下のプロセスで作成します。
- FigmaとSlackのマイアプリ連携
- テンプレートをコピー
- Figmaのトリガー設定と各アクション設定
- トリガーをONにし、フローが起動するかを確認
Figmaでファイルが更新されたら、Slackにメッセージを送る
試してみる
■概要
Figmaでデザインファイルを更新した際、関係者への共有を都度Slackで行うのは手間がかかる作業ではないでしょうか。また、手作業での通知は、連絡漏れや遅延といったコミュニケーションロスに繋がりかねません。このワークフローを活用すれば、FigmaとSlackを連携させ、ファイルの更新をトリガーに自動で通知を送れるため、こうした課題をスムーズに解消できます。
■このテンプレートをおすすめする方
- FigmaとSlackを連携させ、ファイル更新時の通知を自動化したいデザイナーの方
- デザインの進捗共有を効率化し、チームの生産性を向上させたいディレクターの方
- 手作業による通知の手間や、連絡漏れなどのミスをなくしたいプロジェクトマネージャーの方
■このテンプレートを使うメリット
- Figmaでのファイル更新を検知し、Slackへ自動でメッセージが送信されるため、これまで手作業での通知に費やしていた時間を短縮できます
- 手動での連絡による通知漏れや、関係者への共有遅延といったヒューマンエラーを防ぎ、スムーズな情報共有を実現します
■フローボットの流れ
- はじめに、FigmaとSlackをYoomに連携します
- 次に、トリガーでFigmaを選択し、「ファイルが更新されたら」というアクションを設定します
- 続けて、オペレーションでFigmaの「ファイル情報を取得する」アクションを設定し、更新されたファイルの詳細情報を取得します
- 最後に、オペレーションでSlackの「チャンネルにメッセージを送る」アクションを設定し、取得したファイル情報を含んだメッセージを指定のチャンネルに送信します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- Slackへの通知設定では、メッセージを送るチャンネルを任意で指定することが可能です
- 通知メッセージの本文は、固定のテキストを設定するだけでなく、トリガーや前段のオペレーションで取得したファイル名や更新日時などの情報を変数として埋め込むこともできます
■注意事項
- Figma、SlackのそれぞれとYoomを連携してください。
ステップ1：FigmaとSlackをマイアプリ連携
それではここから今回のフローで使用するアプリのマイアプリ登録方法を解説します。
※事前にYoomと使用するアプリにログインしてください。
Figmaをマイアプリ連携
以下の手順をご参照ください。
Slackをマイアプリ連携
以下の手順をご参照ください。
ステップ2：該当のテンプレートをコピー
以下のバナーにある試してみるボタンをクリックしてください。
Figmaでファイルが更新されたら、Slackにメッセージを送る
試してみる
■概要
Figmaでデザインファイルを更新した際、関係者への共有を都度Slackで行うのは手間がかかる作業ではないでしょうか。また、手作業での通知は、連絡漏れや遅延といったコミュニケーションロスに繋がりかねません。このワークフローを活用すれば、FigmaとSlackを連携させ、ファイルの更新をトリガーに自動で通知を送れるため、こうした課題をスムーズに解消できます。
■このテンプレートをおすすめする方
- FigmaとSlackを連携させ、ファイル更新時の通知を自動化したいデザイナーの方
- デザインの進捗共有を効率化し、チームの生産性を向上させたいディレクターの方
- 手作業による通知の手間や、連絡漏れなどのミスをなくしたいプロジェクトマネージャーの方
■このテンプレートを使うメリット
- Figmaでのファイル更新を検知し、Slackへ自動でメッセージが送信されるため、これまで手作業での通知に費やしていた時間を短縮できます
- 手動での連絡による通知漏れや、関係者への共有遅延といったヒューマンエラーを防ぎ、スムーズな情報共有を実現します
■フローボットの流れ
- はじめに、FigmaとSlackをYoomに連携します
- 次に、トリガーでFigmaを選択し、「ファイルが更新されたら」というアクションを設定します
- 続けて、オペレーションでFigmaの「ファイル情報を取得する」アクションを設定し、更新されたファイルの詳細情報を取得します
- 最後に、オペレーションでSlackの「チャンネルにメッセージを送る」アクションを設定し、取得したファイル情報を含んだメッセージを指定のチャンネルに送信します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- Slackへの通知設定では、メッセージを送るチャンネルを任意で指定することが可能です
- 通知メッセージの本文は、固定のテキストを設定するだけでなく、トリガーや前段のオペレーションで取得したファイル名や更新日時などの情報を変数として埋め込むこともできます
■注意事項
- Figma、SlackのそれぞれとYoomを連携してください。
テンプレートのコピーに成功すると、以下の画面が表示されますのでOKをクリックしましょう。
なお、コピーしたテンプレートはYoomのマイプロジェクトから確認できます。
ステップ3：Figmaのファイルが更新された際の設定
Updated Fileをクリックします。
連携するアカウント情報にはステップ1で連携したアカウントか、連携時に使用していたYoomのアカウントが表示されます。
アカウントを確認して問題なければ次へをクリックしてください。
Team Idを設定します。
FigmaのURLをコピーし、URLの以下の箇所からTeam Idを抜き出して入力してください。
https://www.figma.com/files/team/Team Id/×××‥‥
Passcodeを設定します。
注釈を確認し、任意のPasscodeを設定してください。
Descriptionを設定します。
Webhookを設定する際の説明となる任意の文言を設定してください。
必須項目ではないため使用しない場合は空欄でも問題ありません。
ここまで設定できたらWebhookURLを登録をクリックします。
登録に成功すると、WebhookURLの登録に成功しましたと表示されます。
確認できたら次へをクリックしましょう。
Figmaの画面に移動し、ファイルを更新します。
今回ご紹介するテンプレートはFigmaのファイルが更新されたら起動します。
そのため、実際にテストを行うにはFigmaのファイルを更新する必要があるのです。
Figmaのファイルを更新できたらYoomの画面に戻り、テストをクリックしましょう。
テストに成功するとテスト成功画面が表示され、取得した値が表示されます。
取得した値は実行した結果が設定される動的な値として利用できるため、このあとの設定でも使用します。
確認できたら忘れずに完了をクリックしましょう。
※File Keyが取得できない場合は再度テストをクリックしてください。
ステップ4：Figmaのファイル情報を取得する設定
Get File Infoをクリックします。
連携するアカウント情報にはステップ1で連携したアカウントか、連携時に使用していたYoomのアカウントが表示されます。
ステップ3と同じアカウントになっていることを確認したら次へをクリックしてください。
File Keyはデフォルトで取得した値が設定されています。
取得した値を活用することで、固定値ではなく、トリガーが実行されるたびに最新の情報が反映できます。
その他の項目について、今回は使用しないため設定していませんが、使用したい方は注釈を確認しご入力ください。
※入力欄に直接記入する、もしくはプルダウンメニューから選ぶと、入力した値や選択した値が固定値となり、このテンプレートを通して行われる全てのファイル情報を取得する設定に適用されますのでご注意ください。
ここまで設定できたらテストをクリックしましょう。
テストに成功するとテスト成功画面と取得した値が表示されますのでご確認ください。
確認できたら完了をクリックしましょう。
ステップ5：Slackのチャンネルにメッセージを送る設定
チャンネルにメッセージを送るをクリックします。
連携するアカウント情報にはステップ1で連携したアカウントか、連携時に使用していたYoomのアカウントが表示されます。
アカウントを確認して問題なければ次へをクリックしてください。
投稿先のチャンネルIDを設定します。
入力欄をクリックし、表示された候補の中から選択してください。
メッセージを設定します。
デフォルトで設定されていますが、自由に変更可能です。
取得した値を追加することも、直接入力することもできます。
直接入力すると入力した文字が固定値となり、このテンプレートを通して送信される全てのメッセージに反映されますのでご注意ください。
設定できたらテストをクリックしましょう。
※テストをクリックすると実際にメッセージが送信されます。
テストに成功するとテスト成功画面と取得した値が表示されますのでご確認ください。
確認できたら完了をクリックしましょう。
また、実際にSlackのチャンネルへメッセージが送信されていますので確認しましょう。
ステップ6：トリガーをONにし、フローが起動するかを確認
先ほどのYoomの画面で完了をクリックすると以下の画面が表示されます。
トリガーをONをクリックしてください。
お疲れ様でした！ここまでで設定は完了です！
以上がFigmaでファイルが更新された際に、その情報をSlackに自動で通知するフローでした！
Figmaを使った自動化例
デザインツールへのコメント追加をトリガーに、各種チャットツールへ通知を行い、レビューの抜け漏れを防ぎます。
また、コメント内容をノートツールに自動で追加し、フィードバック情報を一元管理することも可能です。
さらに、定期的にコメントリストを取得してデータベースに記録したり、指定ファイルをダウンロードしてストレージに保存することも可能です。
デザインレビューの迅速化と、フィードバック・資産管理の効率化に貢献します。
FigmaでCommentが追加されたら、Notionに追加する
試してみる
■概要
Figmaのデザインレビューで付いたコメントを、後からNotionに手作業で転記する作業に手間を感じていませんか。この作業は単純ですが、コメントの見落としや転記ミスが発生しやすい業務の一つです。このワークフローを活用すれば、FigmaとNotionを連携させ、新しいコメントを自動でNotionのデータベースに追加できます。手作業による転記の手間をなくし、デザインのフィードバック管理を効率化します。
■このテンプレートをおすすめする方
- Figmaのデザインレビューで付いたコメントを、Notionで管理しているデザイナーやPMの方
- FigmaとNotionを連携させ、フィードバック管理の工数を削減したいと考えている方
- 手作業による情報共有でのミスや漏れを防ぎ、業務の正確性を高めたいチームリーダーの方
■このテンプレートを使うメリット
- Figmaにコメントが追加されるたびに自動でNotionへ連携されるため、手作業での転記に費やしていた時間を短縮できます。
- 手動での情報転記が不要になることで、コメントの見落としや入力ミスといったヒューマンエラーの発生を防ぎます。
■フローボットの流れ
- はじめに、FigmaとNotionをYoomと連携します。
- 次に、トリガーでFigmaを選択し、「新しいコメントが追加されたら」というアクションを設定します。これにより、監視対象のファイルにコメントが追加されるとフローが起動します。
- 最後に、オペレーションでNotionを選択し、「レコードを追加する」アクションを設定します。ここで、トリガーで取得したコメント内容などを、指定のデータベースに追加するように設定します。
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- Notionにレコードを追加する際、どのデータベースに追加するかを任意で指定してください。
- 追加するレコードの各項目には、トリガーで取得したFigmaのコメント内容などの値を、変数として埋め込むカスタマイズが可能です。
■注意事項
- Figma、NotionのそれぞれとYoomを連携してください。
FigmaでCommentが追加されたら、Discordに通知する
試してみる
■概要
Figmaでのデザインレビュー中、新しいコメントに気づかずフィードバックの反映が遅れてしまった経験はありませんか。複数のプロジェクトが進行していると、全てのコメントを手動で確認するのは手間がかかり、見落としの原因にもなりがちです。このワークフローを活用すれば、Figmaでコメントが追加された際に自動でDiscordへ通知を送信できるため、こうした課題を解消し、迅速なコミュニケーションを実現します。
■このテンプレートをおすすめする方
- Figmaでのデザインレビューを頻繁に行い、コメントの見逃しをなくしたいデザイナーやディレクターの方
- Figmaに関するコメント通知をDiscordに集約し、チームの確認漏れを防ぎたいプロジェクトチームの方
- 手動での確認作業を自動化し、デザインのフィードバックサイクルを高速化したいと考えている方
■このテンプレートを使うメリット
- Figmaにコメントが追加されると自動でDiscordへ通知が送信されるため、都度Figmaを確認する手間を省き、作業時間を短縮できます
- 重要なフィードバックや修正依頼のコメントを見落とすといったヒューマンエラーを防止し、プロジェクトの遅延リスクを軽減します
■フローボットの流れ
- はじめに、FigmaとDiscordをYoomと連携します
- 次に、トリガーでFigmaを選択し、「新しいコメントが追加されたら」というアクションを設定します
- 最後に、オペレーションでDiscordの「メッセージを送信する」アクションを設定し、Figmaから受け取ったコメント内容などを通知するように設定します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- Discordへメッセージを送信するオペレーションでは、通知先のチャンネルを任意で設定することが可能です
- 通知するメッセージの本文は、固定のテキストを設定するだけでなく、トリガーで取得したFigmaのコメント内容や投稿者名などの情報を変数として埋め込み、自由にカスタマイズできます
■注意事項
- Figma、DiscordのそれぞれとYoomを連携してください。
FigmaでCommentが追加されたら、Microsoft Teamsに通知する
試してみる
■概要
Figmaでのデザイン作業中、追加されたコメントに気づくのが遅れたり、確認漏れが発生したりすることはないでしょうか。こうした見落としは、プロジェクトの進行に影響を及ぼす可能性があります。このワークフローを活用すれば、Figmaで新しいコメントが追加された際に、Microsoft Teamsの指定チャネルへ自動で通知を送ることができます。これにより、Figmaのコメントに関する通知をリアルタイムで受け取ることができ、チームのコミュニケーションを円滑にします。
■このテンプレートをおすすめする方
- Figmaでのデザインレビューにおいて、コメントの確認漏れや対応遅れを防ぎたいデザイナーの方
- チームのFigmaコメント通知を集約し、プロジェクトの進捗を迅速に把握したいマネージャーの方
- FigmaとMicrosoft Teamsを連携させ、手動での情報共有作業を効率化したいと考えている方
■このテンプレートを使うメリット
- Figmaにコメントが追加されると自動でMicrosoft Teamsに通知が飛ぶため、都度Figmaを確認する手間を省き、コミュニケーションの迅速化に繋がります
- Figmaの重要なコメント通知を見逃すといった人的ミスを防ぎ、デザイン修正やフィードバックへの対応漏れのリスクを軽減します
■フローボットの流れ
- はじめに、FigmaとMicrosoft TeamsをYoomと連携します
- 次に、トリガーでFigmaを選択し、「New Comment（新しいコメントが追加されたら）」というアクションを設定します
- 最後に、オペレーションでMicrosoft Teamsの「チャネルにメッセージを送る」アクションを設定し、Figmaのコメント内容などを通知するように設定します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- Microsoft Teamsへの通知先は、任意のチャネルやユーザーに設定することが可能です。プロジェクトごとやチームごとに通知先を分けるといった運用ができます
- 通知するメッセージの本文は自由にカスタマイズでき、Figmaから取得したコメント内容や投稿者名といった情報を変数として埋め込み、分かりやすい通知を作成できます
■注意事項
- Figma、Microsoft TeamsのそれぞれとYoomを連携してください
- Microsoft365（旧Office365）には、家庭向けプランと一般法人向けプラン（Microsoft365 Business）があり、一般法人向けプランに加入していない場合には認証に失敗する可能性があります
FigmaでCommentが追加されたら、Chatworkに通知する
試してみる
■概要
Figmaでデザインレビューを行う際、追加されたコメントの確認が遅れたり、見落としてしまったりすることはありませんか？このワークフローを活用することで、Figmaに新しいコメントが追加されたら、その内容を自動でChatworkに通知できます。これにより、Figmaのコメント通知を見逃すことなく、チーム内での迅速なフィードバックサイクルを実現し、コミュニケーションロスを防ぎます。
■このテンプレートをおすすめする方
- Figmaで受け取るコメントの通知を見逃さず、迅速な対応をしたいデザイナーの方
- デザインレビューの進捗をリアルタイムで把握したいディレクターやマネージャーの方
- Chatworkを主な連絡手段としており、Figmaからの情報も集約したいチームの方
■このテンプレートを使うメリット
- Figmaにコメントが追加されると即座にChatworkへ通知が届くため、確認作業の手間を省き、より迅速な対応が可能になります
- 手動での確認が不要になることで、Figmaの重要なコメント通知を見落とすといったヒューマンエラーを防ぐことに繋がります
■フローボットの流れ
- はじめに、FigmaとChatworkをYoomと連携します
- 次に、トリガーでFigmaを選択し、「New Comment」アクションを設定します
- 最後に、オペレーションでChatworkを選択し、「メッセージを送る」アクションを設定します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- Chatworkの「メッセージを送る」アクションでは、通知を送信したいグループチャットを任意で設定できます
- 通知メッセージの本文は、固定のテキストを設定するだけでなく、トリガーで取得したFigmaのコメント内容や投稿者名などの情報を埋め込むことが可能です
■注意事項
- Figma、ChatworkのそれぞれとYoomを連携してください。
定期的にFigmaから指定ファイルのコメントリストを取得し、Google スプレッドシートに追加する
試してみる
■概要
Figmaでのデザインレビュー時、多数のコメントを手作業でスプレッドシートに転記・管理することに手間を感じていませんか？コメントの確認漏れや転記ミスは、プロジェクトの進行に影響を及ぼしかねません。 このワークフローを活用すれば、FigmaのAPIを利用して定期的に指定ファイルのコメントを自動で取得し、Google スプレッドシートに集約できます。手作業による管理から解放され、デザインの修正や改善といった本来の業務に集中できる環境を整えられます。
■このテンプレートをおすすめする方
- Figmaでのデザインレビューやフィードバック管理を効率化したいデザイナーやディレクターの方
- FigmaのAPI連携を活用して、手作業でのコメント転記業務を自動化したいと考えている方
- Google スプレッドシートでFigmaのコメントを一元管理し、タスクの進捗を可視化したい方
■このテンプレートを使うメリット
- 定期的にFigmaのコメントが自動でGoogle スプレッドシートに集約されるため、手作業での確認や転記にかかる時間を短縮することができます
- コメントの転記漏れや確認ミスといったヒューマンエラーを防ぎ、フィードバックを正確に管理することで、デザインの品質向上に繋がります
■フローボットの流れ
- はじめに、FigmaとGoogle スプレッドシートをYoomと連携します
- 次に、トリガーで「スケジュールトリガー」を選択し、フローを定期的に実行するスケジュールを設定します
- 次に、オペレーションでFigmaの「コメントリストを取得する」アクションを設定し、対象のファイルからコメントを取得します
- 次に、オペレーションでGoogle スプレッドシートの「値を削除する」アクションを設定し、毎回最新の情報を反映させるために既存のリストをクリアします
- 次に、「繰り返し処理」を設定し、取得したコメントを1件ずつ処理できるようにします
- 最後に、繰り返し処理の中でGoogle スプレッドシートの「レコードを追加する」アクションを設定し、コメント情報をシートに行単位で追加します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- スケジュールトリガーでは、フローを起動させたい日付や曜日、時刻を任意で設定してください。例えば、「毎朝9時に実行」といった設定が可能です
- Figmaでコメントを取得するアクションでは、対象としたいファイルのファイルキーを任意で設定してください
- Google スプレッドシートの各アクションでは、連携先のシートを任意で指定できます。また、追加するレコードの内容は、Figmaから取得したコメント内容や日時などの変数を自由に組み合わせることが可能です
■注意事項
- Figma、Google スプレッドシートのそれぞれとYoomを連携してください。
- 「同じ処理を繰り返す」オペレーション間の操作は、チームプラン・サクセスプランでのみご利用いただける機能となっております。フリープラン・ミニプランの場合は設定しているフローボットのオペレーションやデータコネクトはエラーとなりますので、ご注意ください。
- チームプランやサクセスプランなどの有料プランは、2週間の無料トライアルを行うことが可能です。無料トライアル中には制限対象のアプリや機能（オペレーション）を使用することができます。
定期的にFigmaから指定ファイルをダウンロードし、Boxに保存する
試してみる
■概要
Figmaで作成したデザインデータを、定期的に手動でダウンロードしてBoxにバックアップする作業に手間を感じていませんか？この作業は忘れがちで、重要なデザインアセットのバージョン管理が煩雑になる原因にもなります。このワークフローを活用すれば、Figma APIと連携し、指定したスケジュールで自動的にFigmaからファイルをダウンロードしてBoxへ保存するため、手作業による手間や更新漏れといった課題を解消し、デザインアセットの管理を効率化します。
■このテンプレートをおすすめする方
- Figmaで作成したデザインファイルのバックアップを手作業で行っているデザイナーの方
- Figma APIなどを活用して、デザインアセットのバージョン管理を自動化したい方
- Boxを全社的なストレージとして利用しており、Figmaとの連携を効率化したい方
■このテンプレートを使うメリット
- 指定したスケジュールでフローが自動実行されるため、これまで手作業で行っていたファイル保存の時間を短縮し、本来のコア業務に集中できます。
- 手動でのバックアップ作業で起こりがちなダウンロード漏れや保存ミスを防ぎ、重要なデザインファイルを確実に管理することが可能になります。
■フローボットの流れ
- はじめに、FigmaとBoxをYoomと連携します。
- 次に、トリガーでスケジュールトリガー機能を選択し、「指定のスケジュールになったら」というアクションを設定します。
- 次に、オペレーションでFigmaの「Get Image URL」アクションを設定し、指定ファイル内の特定要素の画像URLを取得します。
- さらに、オペレーションでFigmaの「Download File」アクションを設定し、ファイル自体をダウンロードします。
- 最後に、オペレーションでBoxの「ファイルをアップロード」アクションを設定し、ダウンロードしたファイルを指定のフォルダにアップロードします。
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント
- スケジュールトリガーの設定では、フローを起動させたい日付や曜日、時刻などを任意で設定できます。例えば、「毎週金曜日の18時」といった定期的な実行が可能です。
- Figmaの各アクションでは、対象となるファイルのファイルキーや、画像として取得したい要素のノードIDを任意で設定してください。
- Boxへファイルをアップロードするアクションでは、保存先のフォルダやアップロード時のファイル名を任意で設定できます。
■注意事項
- Figma、BoxのそれぞれとYoomを連携してください。
- Figmaの画像URLのアウトプットはJSONPathから取得可能です。取得方法は「『取得する値』を追加する方法」をご参照ください。
- ダウンロード可能なファイル容量は最大300MBまでです。アプリの仕様によっては300MB未満になる可能性があるので、ご注意ください。
- トリガー、各オペレーションでの取り扱い可能なファイル容量の詳細は「ファイルの容量制限について」をご参照ください。
まとめ
FigmaとSlackの連携を自動化することで、これまで手動で行っていた更新内容の確認や関係者への連絡作業をなくし、デザインの変更点をチームに共有できます。
これにより、情報伝達の遅れや確認漏れを防ぎ、チーム全体のコミュニケーションを円滑化できるため、デザイナーは本来のクリエイティブな業務に一層集中できる環境が整います！
今回ご紹介したような業務自動化を実現できるノーコードツール「Yoom」を使えば、プログラミングの知識がない方でも、直感的な操作で簡単に業務フローを構築できます。
もし自動化に少しでも興味を持っていただけたなら、ぜひこちらの登録フォームから無料登録して、Yoomによる業務効率化を体験してみてください！
よくあるご質問
Q：特定のファイルやページの更新だけを通知できますか？
A：
はい、できます。
特定のファイルやページの更新のみを通知するには、分岐の追加が必要です。
「Get File Info」直下にある+をクリックして設定を行ってください。
※分岐はミニプラン以上でご利用いただけます。
フリープランで利用するとエラーになってしまうのでご注意ください。
Q：Slack以外のツール（Teamsなど）にも通知できますか？
A：
はい、可能です。
先ほどと同様にフローボットの追加したい箇所にある+をクリックしアプリを追加、設定を行うことで通知できます。
※新しくアプリを追加する場合はマイアプリ連携が必要です。
使用できるアプリについて知りたい方は以下のリンク先をご覧ください。
Q：連携エラーが起きた際の対処法はありますか？
A：
連携エラーが起きた場合は、Yoomにご登録いただいているメールアドレスへ通知が届きます。
通知メールには、エラーが起きている箇所や詳細のリンクが記載されておりますのでご確認ください。
また、再実行は自動で行われません。エラー修正後に手動で再実行してください。
ヘルプページで解決しない場合は、サポート窓口を利用することもできます。
