AI時代、Webデザイナーの業務はどう変わった？｜Figmaデザインエージェントから考える

レスポンシブデザインの制作時間を短縮！Figmaバリアブル機能の活用法 | 株式会社ロジカルスタジオ

限りあるリソース時間でより良いデザインを作るには？デザインをする上で重要なことは目的を達成するためにどれだけの選択肢を考えられるかその中で最適解を選べられるか、だと考えますなにより、デザインの力...

https://www.wantedly.com/companies/logical-studio/post_articles/957635

1年も経っていませんが、ずいぶん昔のことのように感じます。
AI時代といわれる昨今、みなさまの働き方に変化はありましたでしょうか？

Web制作会社では、やはりAIの活用が鍵になっているのではないでしょうか。

ということで！！！
今回は、Figmaが2026年5月にリリースした「Figmaデザインエージェント」を中心にお話ししてみたいと思います！

Figmaデザインエージェントとは？簡単に紹介

Figmaのエージェントがキャンバス上であなたと協力して作業を行うことで、作業効率が向上するだけでなく、AIアシスタントと手動での操作をシームレスに行き来できるようになります。
出典　Figmaデザインエージェントが登場 | Figma Blog

Figmaデザインエージェントは、Figma上でAIを活用し、デザイン制作をサポートしてくれる機能です。

作成中のFigmaファイル内でAIに作業してもらうことができます。さらに、すでに作成したデザインシステムを読み込んで生成することで、デザインの一貫性を保ったまま制作してくれます。

特に大きなポイントだと感じているのが、生成したデザインをそのままFigma上で編集できること。

別のAIツールでデザインを生成して、それをFigmaに持ってきて……という流れはなく、Figmaのキャンバス上でデザインを生成・編集できます。

また、Figmaのデザインシステムやコンポーネントなどを踏まえて生成できるため、既存のデザインをベースにした制作とも相性が良さそうです。

Figmaエージェントは、今後数週間にわたってベータ版で段階的に展開されます。ベータ期間中、エージェントはクレジットを消費しません。AI クレジットは一般提供時に適用されます。
出典　Figmaデザインエージェントが登場 | Figma Blog

「Figmaデザインエージェント」ベータ版を提供中（2026年9月15日現在）

Figmaデザインエージェントは2026年5月20日からベータ提供が開始され、現在もベータ版として提供されています。
利用できるプランやシートには条件がありますが、ベータ期間中はAIクレジットを消費せずに利用できるため、まず試してみるには良いタイミングではないでしょうか。

どんな時に使う？WebデザイナーがFigmaデザインエージェントを使う場面

今のところ、個人的には「デザインを作ってもらう」というより、デザイン制作の途中にある、ちょっと手間のかかる作業や、アイデアを広げたい場面で使っています。

例えば、こんな場面です。

①提案段階でのラフ案・たたき台作成
②デザインの方向性を探るためのパターン出し
③コンポーネント等の一括差し替え
④フィードバックをもとにした改善案の作成
⑤下層ページの量産・展開

①提案段階でのラフ案・たたき台作成

まず使いやすいのが、提案段階でのたたき台作り。

デザインを作る必要はないけれど、説明で見せたい。構成を詰める上で欲しい。そんな時に活用できます。
文章だけで説明するより、実際のWebサイトっぽい画面が一枚あるだけで、かなりイメージを共有しやすくなります。
すり合わせのための材料として使うイメージです。

ゼロからラフを作るよりも、まず画面ができるまでが早いので、提案前の「ちょっと見せられるものが欲しい」という場面では結構便利だと思います。

一から構成案を作成してもらった

②デザインの方向性を探るためのパターン出し

いざ実際に自分でデザインを始めた時、方向性に悩むことがあります。

そんな時、少し色を変えたパターンやレイアウトを変えたパターンなど、さっと比較案を作成してもらいます。
複数案を見比べてみると、自分の中でも「こっちの方向が良さそう」という判断がしやすくなります。
最終的に採用するかどうかは別として、アイデアを広げるための壁打ち相手として使うのは、とても良いと感じています。

色変えのパターン出し

③コンポーネント等の一括差し替え

制作を進めているうちに、後から仕様変更することもあります。

Figmaデザインエージェントを使って、コンポーネントやUIの変更・展開をサポートしてもらえると、こうした細かい作業の効率化にもつながります。
デザイナーとしては、「考えるというより、手を動かして対応する作業」をAIに手伝ってもらえるのはありがたいところです。
その分、デザインの判断やブラッシュアップに時間を使えるようになります。

（現時点では、うまく変更してくれないことも・・・>_< ）

④フィードバックをもとにした改善案の作成

Figmaのコメント機能でフィードバックをしておくと、その内容をもとにFigmaデザインエージェントへ改善案を出してもらうこともできます。

修正内容をどうデザインに落とし込むか悩んだときに、自分だけで考え続けるのではなく、相談相手になってくれます。

コメント機能でもらった修正の反映案

⑤下層ページの量産・展開

トップページなどでデザインの方向性が決まった後、下層ページを展開していく際にも活用できます。

例えば、プライバシーポリシーなどテキストベースのページや、ECサイトのフローページなど。
ある程度レイアウトの型が決まっているページであれば、Figmaデザインエージェントでたたき台を作り、細かな調整を人間が行うことで、制作時間の短縮につなげられそうです。

下層ページ案の作成

使ってみた感想

Figmaデザインエージェントでは、一部のフレームを選択して修正を重ねられるので、他のAIツールと比べても「一緒に制作している」という距離感を感じられるのが良いところだと思いました。
一方で、修正を重ねていくうちに意図していない場所が変わっていたり、参照してほしいデザインがうまく反映されなかったりと、まだ気になる点もあります。

現状の個人的な感想としては、「構成案を考えるための引き出しを広げてくれる仲間」といったところでしょうか。

構成案を作るときも、デザイン案を作るときも、そのブランドや企業独自の色や、どのコンテンツを強く見せたいのかなど、背景や全体を含めて考えることが出来るのは、やはり人間デザイナーの役割だと思います。

他のAIにも共通することかと思いますが、やはりスピーディーに綺麗な見た目を作ることには、とても優れていると思います。
でも、「綺麗に作ること」と「良いデザインであること」は、また別の話。。。

AIと人間、それぞれの得意なところを活かしながら、これからWeb制作がどう変わっていくのか。
共に進化できる人間でありつつ、これからもより良いものづくりを目指していきたいですね！

おわりに

最後までお読みいただきありがとうございました！
弊社ロジカルスタジオでは、一緒に働く仲間を募集しています！

記事を読んで興味を持った方はぜひコチラから↓

システムエンジニア

AI・Webシステム開発｜成長できる開発エンジニア募集

◼️システムに強いクリエイティブプロダクション　当社は、ソフトウェア開発会社として培った技術力を強みにディレクションからデザイン、システム開発、コーディング、メンテナンスまでワンストップで請け負うクリエイティブプロダクションです。イラスト・グラフィック・動画制作などのクリエイティブから、データベースが絡むシステム構築まで幅広くカバーできる強みを生かし、さらなる業務拡大を目指しています。

株式会社ロジカルスタジオ's job postings