teaching-ui-expertise-in-ai-era
公開日: 2026.02.27  | 更新日: 2026.02.27

AIがあらゆるデジタルコンテンツを生成する時代に、ユーザーインターフェースの専門知識を教えるということ

生成AIの進展によって、UIデザインの「成果物」そのものが瞬時に出力されるようになってきました。プロンプトを入力すれば、それなりに整ったレイアウトが返ってきます。画像も、テキストも、アイコンも同様です。かつてはデザイナーが時間をかけて手を動かしていた領域の多くが、AIによって形にできる時代に入りつつあります。

こうした変化に直面するのはデザイナーとしての実務者だけではなく、大学や企業研修など、UIの専門知識を教える立場においても、「自分が教えていることの意味は変わるのだろうか」と思う方はいるのではないでしょうか。少なくとも、私は頭を抱えています。

今回は、AIがあらゆるデジタルコンテンツを生成できるようになってきた今、改めてユーザーインターフェースの専門知識を教えるということの意味を考えてみたいと思います。

この記事のターゲット

  • 大学や専門学校などでUIに関する授業を担当している方

  • 社内でデザイナーの育成・研修に関わっている方

  • UI領域の学習において、AIとの向き合い方に関心がある方

UIの専門知識を「教える」とは、これまで何をしてきたのか

AIの話に入る前に、UIの専門知識を教えるという行為がこれまで何を含んでいたのかを整理してみます。「変わるもの」と「変わらないもの」を考えるために、まず自分たちが何をしてきたのかを棚卸しをします。

私の感覚では、UIの教育には大きく分けて4つのレイヤーがあります。

1つ目はツール操作のレイヤーです。Figmaのオートレイアウトの使い方、コンポーネントの作り方、プロトタイプの設定方法。手を動かして覚える「操作スキル」にあたる部分です。

2つ目は表現の型のレイヤーです。色彩理論、タイポグラフィ、レイアウトの原則、コントラスト、余白の使い方。視覚的に「良いUI」を作るための造形的な視覚設計の知識がここに含まれます。

3つ目は構造と原理のレイヤーです。なぜそのUIがユーザーにとって使いやすいのか。アフォーダンス、メンタルモデル、ゲシュタルト原則、情報アーキテクチャといった、UIが「機能する」理由を支える認知科学的・構造的な知識にあたります。これらの概念については以下の記事でも紹介しています。

4つ目は文脈と判断のレイヤーです。このユーザーに、このビジネス文脈で、この制約条件下で、なぜこのUIが最適なのか。ドメイン知識、ユーザー理解、トレードオフの判断といった、状況に依存する意思決定の力です。

これまでの教育は、ツール操作→表現の型→構造と原理→文脈と判断の順に進むことが多かったのではないでしょうか。まずFigmaの使い方を教え、基本的なビジュアルデザインの原則を学び、その後に「なぜ」を掘り下げていく。私自身はこの順序で教えることが多いです。

AIによって教え方が変わる部分

では、この4つのレイヤーのうち、AIの進展によって教え方が変わるのはどこなのか。

まず影響が大きいのは、ツール操作のレイヤーでしょう。Figmaの操作方法を教える行為自体がなくなるわけではありませんが、学習者がAIに「オートレイアウトの使い方を教えて」と聞けば、即座に手順が返ってくる環境になりました。なんなら、そんな指示をしなくてもFigma Makeで生成すればそれが反映されるのがデフォルトになっています。操作をステップバイステップで教える講義に何コマも費やす必要性は、確実に薄れています。

ただし、ここで注意したいのは、Figmaというツールを使って教えること自体は引き続き有効な手段だということです。ツールは単なる操作対象ではなく、表現の型構造と原理の理解に到達するための「足場」として機能します。Figmaでコンポーネントを組む過程で、余白やアラインメントの意味を体感できます。プロトタイプを作る過程で、画面遷移の構造を考えることになります。その足場としての役割は変わりません。変わるのは、操作そのものの教え方に費やす時間の配分です。

次に影響を受けるのは、表現の型のレイヤーです。AIは色彩もレイアウトも「それなり」に整えてくれるようになりました。その結果、基本的なビジュアルデザインの型を身につけていなくても、見た目上はきれいなUIが作れてしまいます。これは学ぶ側にとっては便利ですが、教える側にとっては厄介な問題を生みます。成果物のビジュアルがきれいかどうかだけでは、学習者が本当に理解しているのかが見えなくなるからです。

課題の提出物として「見栄えの良いUI」が出てきたとき、それが学習者自身の判断によるものなのか、AIの出力をそのまま使ったものなのかは、見た目だけでは区別がつきません。教育の評価基準を「成果物の品質」だけに置いていると、この問題はますます深刻になるように思います。

少なくとも私自身は、生成AIが普及する以前から、UI成果物がそうなっている根拠(そうで無ければならない理由)を言語化できるかどうか、それを客観的に正しく認識できているかどうかを問う姿勢を常に持つことを意識しています。

それでも変わらないと思われること

ここからが、個人的に最も考えたいところです。AIがどれほど進化しても、UIの専門知識を教える上で変わらないもの、変わりにくいものは何なのか。

まず、構造と原理のレイヤーは、むしろ重要性が増すと考えています。

ゲシュタルト原則がなぜ有効なのか、メンタルモデルとは何か、アフォーダンスがUIの使いやすさにどう関わるのか。これらの原理的な知識は、AIが出力したUIを「読む」ためのリテラシーとして機能します。AIは結果を出力しますが、「なぜそれが良いのか」を教えてはくれません。原理を理解していなければ、AIの出力に対して「なんとなく良さそう」以上の判断ができません。それは結局、AIの提案をただ受け入れるだけの状態と変わりません。

たとえば、AIが生成した画面に対して「この配置はフィッツの法則から見て合理的か」「このグルーピングはゲシュタルト原則の近接に基づいているか」と問えるかどうか。その問いを立てられるかどうかは、理論や原理の知識があるかないかに直結します。

次に、文脈と判断のレイヤー。これは究極的には実践することでしか基盤を作れない領域だと考えています。

「このユーザーにとって」「この業務フローにおいて」「この制約下で」なぜこのUIが最適なのかという判断は、汎用的なAIにはまだ難しい部分です。こうした判断は状況に依存するもので、教科書的な正解があるわけではなく、経験と知識の蓄積から少しずつ形成されます。教育が果たすべき役割は、こうした判断を行うための「考え方の型」を身につけさせることであり、これはAI以前から変わらない教育の本質だったとも言えます。

そしてもう一つ、「手を動かすこと」自体の意味も、なくなるわけではないと思っています。

Figmaでコンポーネントを1から作る経験は、操作を覚えるためだけにあるのではありません。自分の手でUIを構成する過程で、「なぜこの余白なのか」「なぜこの配置なのか」を体感的に理解していきます。つまりツール操作表現の型の実践を通じて構造と原理の理解に到達するプロセスには、依然として教育的な意味があります。

以前の記事で「自分で料理を作れない人間に、味の違いは判断できない」と書きましたが、同じことがUIの教育にも当てはまるのではないでしょうか。AIが成果物を代替できるようになっても、「作ることを通じて理解する」という学びの仕組み自体は残り続けると考えています。

「このAI時代にデザイナーがこの先生きのこるには」のサムネイル画像

このAI時代にデザイナーがこの先生きのこるには

画像生成、レイアウト作成、コピーライティングに至るまで、生成AIはこれまで人間が手作業で行っていた領域を完全に代替し始めました。 この不可逆的な流れの中で、私たちデザイナーは生成AIという存在とどう対峙し、この先生きのこるには自身の職能をどう位置付けるべきなのでしょうか。 ... 続きを読む

何を残し、何を更新するか

ここまでの整理を踏まえて、教育の実践レベルで「時間と労力の配分をどう変えるか」を考えてみます。

まず、残すもの、むしろ強化すべきものについてです。

UIの原理・構造に関する知識の教育は、これからも続けるべきだと思います。認知科学的な基盤を厚くすることで、AIの出力に対して批評的な目を養うことができます。それが失われれば、「そのデザイナーや開発者にとって都合よく見えるもの」しか生み出せなくなります。そうなったら、もうそれはデザインではありません。

また、Figmaを使った制作演習も残す価値がありますが、その目的は「操作の習熟」から「制作を通じた原理の体感的理解」へと移していく必要があるでしょう。作ること自体がゴールではなく、作ることを通じて「なぜ」に到達するための手段として位置づけ直す、ということです。

さらに、「なぜそのUIにしたのか」を言語化する訓練も重要性が増すと思います。レビューや批評を通じて、判断の根拠を他者に説明する力は、AIの時代だからこそ鍛えるべきスキルです。

次に、更新すべきものについてです。

ツール操作のステップバイステップ講義に費やす時間は圧縮できます。基本操作はAIアシスタントやセルフラーニング教材に委ね、対面の授業ではより構造と原理文脈と判断に近い議論や演習に時間を使えます。この配分の見直しは、すでに多くの教育者が感覚的に始めていることかもしれません。

また、成果物の評価基準も見直す必要があると思います。ビジュアルの完成度だけでなく、「なぜその判断をしたのか」というプロセスを評価対象に含めることが求められます。これは言うのは簡単ですが、実際の授業運営では工夫が要る部分です。

一つの方法として、AIの出力を教材として活用することが考えられます。AIが生成したUIを題材にして「このUIの何が良くて何が問題か」を議論させるといった方法です。学習者にとっては、AIの出力に対して批評の目を向ける練習になりますし、教える側にとっては構造と原理の理解度を測る手段にもなります。

上記はあくまで理論上の話であり、現実的にはすぐにドラスティックに切り替えが必要にならない(というかできない)と考えていますが、それが求められればすぐに変えられる準備やその覚悟は必要に思います。

おわりに

正直なところ、この記事で書いたことの多くは、まだ自分の中でも整理しきれていません。大学の授業を設計しながら、「ここに時間を使うべきなのか」「この課題で本当に伝わっているのか」と毎回のように迷っています。

ただ、一つだけ言えるのは、Figmaの操作手順を教えることと、「なぜそのUIなのか」を考えさせることは、同じ「UIを教える」でもまったく別の営みだということです。AIが前者をどんどん肩代わりしてくれるようになった分、後者に使える時間が増えた、と捉えるくらいがちょうどいいのかもしれません。

結局のところ、教える中身を変えるというより、教える中身の重心をずらす、という話なのだと思います。ツールの使い方も、表現の型も、原理も、判断力も、全部必要なことに変わりはありません。ただ、どこに多くの時間を割くべきかは、AIの登場によって変わっていく。その変化を見極めながら授業を組み立てていくしかないのだろうと、今は考えています。

今回は、デスクまわりの作業環境を少しずつ整えてきた中で、実際に使っていて満足度の高かったアイテム��をまとめて紹介します。

最新の記事を見る
広告
この記事を書いた人
うえんつ
B2B領域のSaaS・アプリケーション開発などを組織で取り組むことが得意なプロダクトデザイナーで、このブログのオーナーです。
今の関心事
Figma・UIデザイン・UXリサーチ・QOL・旅行
今回は、デスクまわりの作業環境を少しずつ整えてきた中で、実際に使っていて満足度の高かったアイテムをまとめて紹介します。
広告