AI時代におけるデザイナーとエンジニアの協働。デザインとコードが近づくことで変わる、私たちのマインドセット

2026年07月11日

AI時代におけるデザイナーとエンジニアの協働を示すアイキャッチ画像

こんにちは!
UIデザイナーのYunyです。

この記事はこんな方に向けて書いています
  • AI時代におけるデザイナーの働き方の変化に興味がある方
  • 職能を超えて越境していきたいデザイナーの方
  • エンジニアリングに興味のあるデザイナーの方

デザインデータを作り終えてエンジニアさんに渡した後、「あれ、ここの余白ちょっと違うな…でも今更修正お願いするの悪いし、機能は動くから今回は我慢しようかな…」と、1pxのズレや微妙な動きのニュアンスを飲み込んで妥協してしまった経験、ありませんか

これまでの開発現場では、デザイン担当と実装担当の作業が完全に分かれており、もどかしい思いをすることが少なくありませんでしたよね。

しかし最近、デザインツールのすぐ隣にAIがいるのが当たり前になりました。AIがデザインデータから実装のコードを即座に生成してくれるようになり、ふと気づけば、UIデザイナーである私たちの働き方そのものが大きく変わり始めています。

AIの普及によって、デザイナーとエンジニアといった「職種の境界線」は急速に曖昧になってきました。

かつては完全に分業されていた役割が接近し、いまや共同でひとつのものを作り上げるスタイルへと変化しています。

デザイナーとエンジニアの職種の壁が溶け合い、役割が融和していくイメージ図解

今回は、現場で働く私自身の視点から、作る側の環境が今どのように変化しているのか、そしてデザイナーとエンジニアの働きやすさやマインドがどう変わっていくべきかについてお話しします。明日からのものづくりがもっと面白くなるような、現場のリアルな裏側を覗いてみましょう。

1. 「バケツリレー」から「同じテーブルでの対話」へ

従来のバケツリレー方式の開発と、AIを活用した同じキャンバスでの協働開発を比較する図解

結論からお伝えすると、ツールとAIの進化により、これまで分断されていた職種が同じ画面上で共同作業できるようになりました。

以前の開発現場では、デザインを作ってからエンジニアに「あとはお願いします」と渡す、一方向のバケツリレー方式で仕事をするのが一般的でした。冒頭でもお話ししたように、この方法だと細かなニュアンスがうまく伝わらず、お互いに気を遣ってしまうことが多々あったのです。

しかし現在の開発現場では、Figmaの「Code Layers」機能や「Figma MCP」の登場により、デザインデータとコードがAIを介して常に同期するようになりました。

デザインを変えればコードが追従し、コード側の制約がデザインにもすぐに反映されます。つまり、同じ画面を見ながら「ここ、もう少しこうしようか」と対話しながら作れるようになったのです!

この変化は、数字にも明確に表れています。
知人のエンジニアがいる会社で聞いた話によると、従来は1画面あたり 2〜3時間 かかっていた実装作業が、AIの支援によってわずか 15〜30分(75%〜90%の工数削減) へと大幅に短縮されたケースもあるそうです。

この余白の時間ができたからこそ、私たちは単なる「作業」ではなく、より本質的な「使いやすさ」の議論に集中できるようになったと言えますね。

2. プロダクト全体を導く「共通言語」へと進化するデザインシステム

デザイナーだけでなく、チーム全員が参照する共通言語としてのデザインシステムを示す図解

次に重要な結論として、デザインシステムはもはやデザイナーだけのものではなく、職種を越えてブランドの「らしさ」を守る指針になっています。

デザインシステムとは、余白のサイズ、色、文字のルールなどをまとめたものです。
少し前までは単なるUIのルールブックでしたが、現在ではマーケターやセールスなど、「ノンデザイナー」も含めた全員が頼りにし、大事に育てていく基準へと進化しています。

なぜ、これが私たちの体験を豊かにするのでしょうか?

誰もが迷わず使える共通のルール(デザインシステム)があることで、「このボタンの余白はいくつだっけ?」といった確認の手間が省け、本来集中すべき「ユーザーにどんな価値を届けるか」を考えることに時間をかけられるようになるからです。チーム全体で一貫した基準を持つことで、最終的なプロダクトの品質が安定するのです。

例えば、セールス担当者が提案資料を作る際にデザインシステムのカラーパレットを参照したり、マーケターがLPを作る際に公式のコンポーネントをそのまま活用したりするケースが増えています。
一部の専門家だけが管理するのではなく、組織全体で大事にしていく「共通言語」になりつつあるのですね。

3. 「作業」から「体験の追求」へ。AIが変える時間の使い方

職能の境界線を越える「デザインエンジニア」の存在が、より深いレベルでものづくりに向き合うマインドを生み出しています。

最近では、デザイナーが直接コードを触って動きを調整したり、エンジニアがUIの細かなレイアウトを微調整したりするような、領域横断的な開発が当たり前になりつつあります。

では、彼らがこだわる「動き」や「光り方」といった細部の調整に、なぜこれほど時間をかけるのでしょうか。

それは、単に「見た目が綺麗だから」ではありません。
ボタンを押したときの自然な沈み込みや、画面が切り替わるときの滑らかさは、私たちの「視線が自然に誘導されるスピード」「指の動きと画面の反応にズレがないこと」という、極めて人間工学的な理由(認知モデルとの一致)に基づいているのです。

定型的なUIパーツの配置や作成は、AIが瞬時に行ってくれるようになりました。だからこそ、人間の作り手は「Figma Motion」などを用いて、こうした人間の感覚に訴えかける微細な手ざわりの設計に、全力で集中できるようになったのです!

4. 個人のこだわりを組織に広げる環境(DesignOps)

近年、「PdMとUXデザイナーの違い」が曖昧になり、両者を兼務するようなキャリアパスが増えているのと同じように、デザイナーとエンジニアの境界線もまた、ツールとAIによって消えつつあります。

しかし、どれほど優れたツールや領域横断的な働き方があっても、それを活かす「組織の仕組み」がなければ本質的な価値は生まれません。

ここで注目されているのが、「DesignOps(デザインオプス)」という考え方です。

組織が拡大してもデザインの品質とスピードを落とさないために、専門の仕組み化を行う動きが高まっています。
Nielsen Norman Group(NN/g)などの提唱でも、単なる業務遂行の効率化だけでなく「他部署との協働」や「組織への影響創出」といった多角的な視点(3次元モデル)で組織の仕組みを設計する重要性が語られています。

DesignOpsは、評価制度を透明にしたり、専門性を極める道とマネジメントの道(デュアルキャリアラダー)を両立させたりすることで、デザイナーが本来の「良い体験づくり」に100%集中できる環境を整える仕組みです。

以前はデザインが完成してからエンジニアに「ここ、実装的に難しいから直して」と言われて手戻りが発生することが多く、お互いに疲弊していました。
しかし最近では、ツール上で初期段階からエンジニアと一緒に構造を考えられるようになったため、「これは実装しやすいね」「ここ工夫すればもっと滑らかに動くよ」という前向きなやり取りが増え、無駄な作業が圧倒的に減ったと実感しています

個人の「ここをもっと良くしたい」という強いこだわりを、組織全体で肯定し、後押しする環境があるからこそ、それが最終的に良いプロダクトとしてユーザーへ還元されていくのです。

あわせて読みたい:デザインとビジネスが交差する時代のキャリア

デザイナーの役割が大きく変化する時代において、チームでどのように体験を作り上げていくかについて、こちらの記事も参考にしてみてください!

5. AI時代におけるキャリアと役割分担の未来

ここで、最近現場でもよく話題に上がる「PdMとUXデザイナーの違いや、エンジニアとの境界線はどう変化していくのか?」というテーマについて、私個人の考えを少しお話しさせてください。

従来の「誰がどこまでやるか」という明確な役割分担は、今後さらに曖昧になっていくと感じています。「PdMだから」「デザイナーだから」と領域を限定して兼務するようなフェーズを越えて、まだない名前の職種が生まれていくのではないか、と個人的には思っています。

互いの専門性がAIによってシームレスに繋がることで、これまでの枠組みには収まらない、新しいものづくりのプロフェッショナルが誕生する時代がすぐそこまで来ているのかもしれません。

まとめ:これからのプロダクト開発のリアル

生成AIの登場によって、誰もが簡単にそれなりの画面を作れる時代になりました。だからこそ、「何を、なぜ作るのか」という根本的な問いに向き合い、細部にこだわる人間同士の協力が、今まで以上に大きな意味を持つようになっています。

普段私たちが何気なく使っている使いやすいアプリの裏側でも、今まさに職種の壁を越えた新しいものづくりが起きています。

皆さんの現場でも、ツールやAIの進化をきっかけに、ぜひチームのエンジニアやデザイナーと「どう作るか」ではなく「何を作るか」について、もう一歩踏み込んだ話をしてみてはいかがでしょうか。

皆さんの日常の景色が、少しでも新鮮に映るようになれば嬉しいです。
これからも、新しい時代のデザインのあり方を一緒に探求していきましょう。

それでは、良いデザインライフを!

記事一覧に戻る