・
「Figmaのデザインにコメントがついたけど、気づかずに修正が遅れてしまった…」
「コメントをSlackやChatworkに一つひとつコピペして共有するのが面倒で、本来のデザイン作業に集中できない…」
このように、Figmaでのデザイン業務において、コメントの確認や共有に関する手作業に課題を感じていませんか？
もし、Figmaに新しいコメントが追加された際に、その内容を自動的にSlackなどのチャットツールに通知できる仕組みがあれば、これらの悩みから解放されることも可能です。
そのうえ、フィードバックの見落としを防ぎ、よりスムーズな共同作業を実現できます！
今回ご紹介する自動例はノーコードで簡単に設定でき、手間や時間もかからないので、ぜひ導入して作業をもっと楽にしましょう！
とにかく早く試したい方へ
YoomにはFigmaのデザインに追加されたコメントを自動で通知する業務フロー自動化のテンプレートが用意されています。
「まずは試してみたい！」という方は、以下のバナーをクリックして、すぐに自動化を体験してみましょう！
■概要
デザインのレビューなどでFigmaのコメント機能は便利ですが、新しいコメントに気づくのが遅れたり、確認が漏れたりすることはありませんか？
このワークフローを活用すれば、Figmaに新しいコメントが追加されたタイミングで、指定のSlackチャンネルへ自動で通知を送ることができ、確認漏れを防ぎながら、コミュニケーションを円滑にします。
■このテンプレートをおすすめする方
・Figmaでのデザインレビューを頻繁に行い、コメントの見落としを防ぎたいデザイナーやディレクターの方
・チームでのコミュニケーションにSlackを利用し、Figmaからの通知をSlackに集約したい方
・手動での確認作業を減らし、デザイン制作やプロジェクト管理業務に集中したい方
■注意事項
・Figma、SlackのそれぞれとYoomを連携してください。
FigmaのコメントをSlackに通知するフローを作ってみよう
それではここから代表的な例として、Figmaに新規コメントが追加された際に、その内容をSlackへ自動で通知するフローを解説していきます！
ここではYoomを使用してノーコードで設定をしていくので、もしまだYoomのアカウントをお持ちでない場合は、こちらの登録フォームからアカウントを発行しておきましょう。
※今回連携するアプリの公式サイト：Figma
[Yoomとは]
フローの作成方法
今回は大きく分けて以下のプロセスで作成します。
■概要
デザインのレビューなどでFigmaのコメント機能は便利ですが、新しいコメントに気づくのが遅れたり、確認が漏れたりすることはありませんか？
このワークフローを活用すれば、Figmaに新しいコメントが追加されたタイミングで、指定のSlackチャンネルへ自動で通知を送ることができ、確認漏れを防ぎながら、コミュニケーションを円滑にします。
■このテンプレートをおすすめする方
・Figmaでのデザインレビューを頻繁に行い、コメントの見落としを防ぎたいデザイナーやディレクターの方
・チームでのコミュニケーションにSlackを利用し、Figmaからの通知をSlackに集約したい方
・手動での確認作業を減らし、デザイン制作やプロジェクト管理業務に集中したい方
■注意事項
・Figma、SlackのそれぞれとYoomを連携してください。
ステップ1：FigmaとSlackをマイアプリ連携
それではここから今回のフローで使用するアプリのマイアプリ登録方法を解説します。
※事前にYoomと使用するアプリにログインしてください。
Figmaをマイアプリ連携
以下の手順をご参照ください。
Slackをマイアプリ連携
以下の手順をご参照ください。
ステップ2：該当のテンプレートをコピー
以下のバナーにある試してみるボタンをクリックしてください。
■概要
デザインのレビューなどでFigmaのコメント機能は便利ですが、新しいコメントに気づくのが遅れたり、確認が漏れたりすることはありませんか？
このワークフローを活用すれば、Figmaに新しいコメントが追加されたタイミングで、指定のSlackチャンネルへ自動で通知を送ることができ、確認漏れを防ぎながら、コミュニケーションを円滑にします。
■このテンプレートをおすすめする方
・Figmaでのデザインレビューを頻繁に行い、コメントの見落としを防ぎたいデザイナーやディレクターの方
・チームでのコミュニケーションにSlackを利用し、Figmaからの通知をSlackに集約したい方
・手動での確認作業を減らし、デザイン制作やプロジェクト管理業務に集中したい方
■注意事項
・Figma、SlackのそれぞれとYoomを連携してください。
テンプレートのコピーに成功すると、以下の画面が表示されますのでOKをクリックしましょう。
なお、コピーしたテンプレートはYoomのマイプロジェクトから確認できます。
ステップ3：Figmaに新規コメントが追加された際の設定
New Commentをクリックします。
連携するアカウント情報にはステップ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の画面に戻り、テストをクリックしましょう。
テストに成功するとテスト成功画面が表示され、取得した値が表示されます。
取得した値は実行した結果が設定される動的な値として利用できるため、このあとの設定でも使用します。
詳しく知りたい方は以下のリンク先をご覧ください。
確認できたら忘れずに完了をクリックしましょう。
ステップ4：Slackのチャンネルにメッセージを送る設定
チャンネルにメッセージを送るをクリックします。
連携するアカウント情報にはステップ1で連携したアカウントか、連携時に使用していたYoomのアカウントが表示されます。
アカウントを確認して問題なければ次へをクリックしてください。
投稿先のチャンネルIDを設定します。
入力欄をクリックし、表示された候補の中から選択してください。
なお、事前にSlackチャンネルにYoomアプリをインストールする方法 を確認し、該当のチャンネルの「インテグレーション」からYoomを追加しておいてください。
メッセージはデフォルトで設定されていますが、自由に変更可能です。
以下のように取得した値を追加することもできます。
取得した値を活用することで、固定値ではなく、トリガーが実行されるたびに最新の情報が反映できます。
※入力欄に直接記入すると入力した値が固定値となり、このテンプレートを通して送信される全てのメッセージに反映されますのでご注意ください。
設定できたらテストをクリックしましょう。
※テストをクリックすると実際にメッセージが送信されます。
テストに成功するとテスト成功画面と取得した値が表示されますのでご確認ください。
確認できたら完了をクリックしましょう。
また、実際にSlackのチャンネルへメッセージが送信されていますので確認しましょう。
ステップ5：トリガーをONにし、フローが起動するかを確認
先ほどのYoomの画面で完了をクリックすると以下の画面が表示されます。
トリガーをONをクリックしてください。
お疲れ様でした！ここまでで設定は完了です！
以上がFigmaに新規コメントが追加された際に、その内容をSlackへ自動で通知するフローでした！
Yoomでは、Figmaを活用した様々な自動化を実現できます。ここでは、Figmaに関連する他のテンプレートをいくつかご紹介します。Figmaのデザインファイルが更新されたり、ライブラリが公開されたりといった重要なイベントが発生したら、Slackへ通知することができます。
ファイルの削除通知も自動で行い、誤操作によるデータ消失リスクを軽減します。
さらに、指定ファイルのコメントリストを定期的にGoogle スプレッドシートに取得したり、デザインファイルをBoxにダウンロード・保存したりすることで、デザインファイルの共有、変更の把握、監査対応、データバックアップを自動化し、チームのデザイン連携とファイル管理を強化します。
まとめ
Figmaのコメント通知を自動化することで、これまで手作業で行っていたコメントの確認や転記作業の手間を削減し、フィードバックの見落としといったヒューマンエラーを防ぐことができます。
これにより、デザイン修正への対応が迅速化し、チーム全体のコミュニケーションが円滑になるため、より創造的なコア業務に集中できる環境が整います！
今回ご紹介したような業務自動化を実現できるノーコードツール「Yoom」を使えば、プログラミングの知識がない方でも、直感的な操作で簡単に業務フローを構築できます。
もし自動化に少しでも興味を持っていただけたなら、ぜひこちらの登録フォームから無料登録して、Yoomによる業務効率化を体験してみてください！
Q：特定のファイルやプロジェクトのコメントだけ通知できますか？
Q：うまく通知が届かない時の確認点は何ですか？
A：
まずマイアプリ連携ができているかを確認し、できている場合は再度マイアプリ連携を行ってみてください。それでもテストなどで失敗してしまう場合は、連携するアカウントやTeam Idは正しいか、Passcodeを設定できているか確認しましょう。
また、運用中に通知に失敗する場合は、Yoomに登録する際に設定したメールアドレスに通知が送られます。通知内に、エラーが起きている箇所や詳細のリンクが記載されておりますのでご確認ください。
Q：双方向の連携（SlackからFigmaへ返信）は可能ですか？
A：
はい、可能です。
先ほどと同様にフローボットの+をクリックすることでFigmaのアクションを追加できます。
Create Commentを追加して、設定を行うことでSlackからFigmaへ返信できます。
Figmaのアクションについて詳しく知りたい方は以下のリンク先をご覧ください。
.avif)
.png)
.avif)
