デザイン制作から、仕事のつなぎ方まで
2026年10月7日、株式会社BoundFor様のデザインチームに向けて、AI伴走支援の一環としてレクチャーを実施しました。
参加メンバーの中には、すでにClaudeを使ってデザイン案を作ったり、情報を整理したりしている方もいました。今回は、それぞれの活用状況を伺いながら、制作ルールをAIに伝える方法と、デザインの前後の工程をつなぐ進め方を共有しました。
BoundForとフィールフロウは、いずれもSDWホールディングスグループのグループ会社です。本記事では、担当者・参加者のお名前、取引先名、プロジェクト名を伏せて紹介します。アイキャッチはレクチャー内容をもとに作成した生成イメージです。
レクチャーで共有したこと
1. 制作ルールを、繰り返し使えるSkillsにする
デザインをAIに依頼しても、余白、アクセシビリティ、アイコンの選び方など、毎回似た修正が必要になることがあります。
そこで紹介したのが、繰り返し使うルールや手順をSkillsとしてまとめる方法です。Skillsは、AIが作業時に参照できる手順書のようなものです。普段の制作で気をつけていることを言葉にして残し、チームで共有する出発点になります。
大切なのは、登録して終わりにしないことです。出力を確認し、意図と違った点をルールへ戻して、少しずつ使いやすくしていく進め方をお伝えしました。
2. 最初に、背景と判断の基準を伝える
「どんな画面を作るか」だけでなく、「誰が使い、何を達成したいか」「何が決まっていて、どこに制約があるか」も、AIに渡す情報になります。
プロジェクトの背景や制約、デザインの方針を文書として整理し、やり取りや決定の経緯を文字で残すことを提案しました。また、仕様書を一つの大きなファイルに詰め込まず、テーマごとに分けて参照しやすくする考え方も紹介しました。
制作担当者の頭の中にある判断の基準を、AIと他のメンバーが参照できる形にする取り組みです。
3. GitHub・GitLabを、タスクと確認の記録に使う
GitHubやGitLabについては、コードの管理に加え、デザインの修正依頼や確認事項をIssueとして扱う方法を共有しました。Issueは、作業の背景、依頼内容、完了条件などをまとめる単位です。
ディレクションの立場では、スケジュール管理、修正指示、反映確認をどうつなぐかが関心事になりました。デザイン担当者にとっても、何を変え、どこまで確認したかを共有する土台になります。
レクチャーでは、まず一つのプロジェクトから試し、チームに合う管理の仕方を確かめることを提案しました。
4. デザインの前後の工程も、一緒に考える
Claude Designの活用を話す中では、デザイン案を作ることに加え、仕様の整理や実装担当者への受け渡しも取り上げました。
AIに制作を依頼する範囲を広げながら、人が意図と品質を確認し、必要な指示やルールを更新していく。こうした進め方を、デザイン業務の中でどう試すかを話し合いました。
一方、Claude Designで作ったデザインをFigmaで調整する具体的な連携方法については、参加者から次回詳しく知りたいテーマとして挙がりました。今回のレクチャーで連携環境の構築まで完了したものではありません。
参加メンバーの声
セッション後にいただいた5名の感想を、お名前を伏せて掲載します。以下は参加者ご本人の受け止めや今後の意向であり、チーム全体の導入完了や定量的な改善効果を示すものではありません。
メンバーA様
この度は貴重な機会をいただき、ありがとうございました。
デザイン業務でのAI活用についてのお話だと思っていましたが、それだけでなく、前後の工程へのスムーズなデータの受け渡しや、プロジェクトの進め方そのものまで教えていただき、大変勉強になりました。
私はディレクター業務が多いため、GitHub（GitLab）を使ったプロジェクト管理を取り入れ、スケジュール管理や修正指示、反映確認を、よりスピーディーに漏れなく行えるようにしたいと考えています。
デザイン制作については、Claude Designで納得のいくデザインに仕上げるには、Skillをうまく活用することがポイントなのだと理解しました。
まずは、いつも気にしている余白の取り方やアクセシビリティなどのルールをSkillに登録するところから始めてみます。
次回は、以下の2点について教えていただけるとうれしいです。
・GitHub（GitLab）を使ったプロジェクト管理の進め方
・Claude Designで作ったデザインをFigmaで調整したいときの連携方法
メンバーB様
この度は貴重な機会をいただき、ありがとうございました。
Claudeにデザイン作業をどこまで任せられるのか、正直全部任せるのは難しいのではと考えていましたが、とにかくまずはAIに全部やらせてみる！という気持ちでやってみようと思いました。AIの処理の精度を上げていくために、やりとりは可能な限り文字情報として残していくのも習慣づけていきたいと思います。
また、今まで試してきたことに加えて、Skillの設定やGitHubとの連携など、まだまだ効率化していける部分はありそうだとわかり、とても勉強になりました。どういう部分がSkill化できそうか、ユニット内で相談・共有していきたいです。
次回があれば、私もGitHub（GitLab）との連携や、ClaudeDesign→Figmaの連携方法は詳しく知りたいです。
メンバーC様
貴重な機会をいただきとても勉強になりました。
Claudeは少しずつ使い方を身につけてきましたが、Skillの活用方法はとても参考になりました。
まずはデザインのルールなどをSkillに登録して実際に試してみます。
お話にあったGithubの使い方をほとんど理解していないままなので、勉強してClaudeと合わせてうまく活用していこうと思います。
なるべくClaudeに背景を教えたりやり取りをチャットでして履歴に残すことも習慣づけしていきます。
もし次回があるのであればぜひ参加させていただきたいのですが、実際にClaudeなどで制作したデザインをfigmaに連携したりfigma化する方法を知りたいです。
メンバーD様
貴重な機会をいただきありがとうございました。
以下のことが参考になりました。
・SKILLの活用できそうな場面を見つける
・Githubのissueをもっと活用する
・プロジェクトの最初にclaudeに背景を教えるところから始める
・仕様書は１つのファイルに全て書くのではなく、分量を制限して、複数に分ける
より感覚的にデザイン→実装できるようになったとはいえ、ある程度素養としてWeb構築やインフラの知識を持っておいた方がいいなと改めて感じました。
また、Githubをよく理解していないまま何となく連携しているので、まず使い方の勉強をしたいと思います。
メンバーE様
今回は貴重な機会をいただきありがとうございました。
専門用語がわからないものもあり、なかなか理解するのが難しいと感じましたが、スピードがあがったり新しい気付きをもらえたりしながら作業ができているので、使い方次第でまだまだ可能性が広がりそうでわくわくしました。
また、デザイナーチームの研修に混ぜてもらえたことで、他の方がどのような作業にAIを使っているのかを知る機会にもなりました。
Githubとの連携でさらにパフォーマンスがあがりそうだということはわかったのですが、具体的なことまで理解できていないので、自分の業務にどう活用できるかを探りたいです。
感想から見えた、次に取り組みたいこと
感想では、余白やアクセシビリティなどのルールをSkillsへ登録すること、AIとのやり取りを文字で残すこと、GitHub・GitLabの使い方を学ぶことが、具体的な次の一歩として挙がりました。
同時に、専門用語やタスク管理の考え方には、理解を深めるためのフォローも必要だと分かりました。今後の支援では、実際の業務に沿って小さく試す機会を設け、参加者の理解度に合わせて進めることが大切だと考えています。
GitHub・GitLabによるプロジェクト管理や、Claude DesignからFigmaへの連携は、次回へのご要望として受け止めています。ツールの紹介から、日々の制作やディレクションで使える手順へつなげていくことが、伴走支援の次のテーマです。
チームの仕事に合わせて、AI活用を進める
AI伴走支援では、各メンバーが持つ制作の工夫を聞き、共通のルールや記録へ変えていくことも支援します。今回は、デザイン制作の効率化に加えて、前後の工程やプロジェクトの進め方までを一緒に考える機会になりました。
BoundFor様のエンジニアチーム向けには、別のセッションでAI仕様駆動開発のレクチャーも実施しています。
デザインと開発をつなぐAI活用や、チームへの定着支援にご関心のある方は、AI仕様駆動開発のサービス詳細またはお問い合わせからご相談ください。