はじめに
大学3年の頃にMaterial Design3を読み込んだあの日々から、4年の月日が経とうとしています。
当時(2023年頃)はAIもまだ今ほど一般的ではなく、自力でFigmaでいろなものを模倣し、必死に知識を吸収してデザインを形にしようともがいていた気がします。
大学時代の授業で作っていたUIやグラフィックデザインを思い返すと、本当に稚拙で、自身の感覚だけに頼った恥ずかしいものばかりでした。😣しかし、インターン生として実務に触れ、Material Design3のガイドラインをしっかりと読み込んでからは、感覚任せだった私のデザインに知識とロジックが加わったのではと思っています。
そして2026年の現在。生成AIが開発ワークフローの主流となり、思い描いたデザインやUIを瞬時に形へと補助するツールが超進化しました。
デザインのあり方も、これまで技術の進化とともに変わってきましたし、これからAI時代を迎えて私のデザイン知識のアップデートのようにさらにに変わっていくはずです。
今回は、自社製品の開発に携わる一介のエンジニアの視点から、Material Designの進化を振り返りつつ、次世代のMaterial Design(M4)はどんな姿になるのか、AI時代においてデザインはこれからどうなっていくのかを現状のトレンドから考察・予想してみたいと思います🙌
参考↓↓
1. Material Designとは
Material Designとは、2014年にGoogleが提唱したデザインシステムのことです。
AppleのHuman Interface Guidelines (HIG)がコンテンツの主役性・没入感・直感的な美しさを重視するスタイルであるのに対し、Material Designは論理的なわかりやすさ、開発・設計の効率、多様なデバイスでの汎用性を強く重視しています。
主な3つの特徴
① 「デザインシステム」のデファクトスタンダード
ボタンやフォントといった表面的なパーツだけでなく、影の落ち方、アニメーションの物理法則、状態変化に至るまで、完全にコードとセットで体系化されました。現在でも、世界中の企業が自社のデザインシステムを構築する際の確固たるベースとなっています。
② Apple (HIG) と並ぶ2大巨頭
AppleのHIGがハードウェアと美しく融合する洗練性を重視するのに対し、Material Designは「どんなデバイス、どんな画面サイズ、どんなOSであっても破綻しない汎用性と論理的な構造」を追求しています。
③ デジタル空間への「物理法則」の導入
かつて平面的な「フラットデザイン」が迷走し、どこが押せるボタンなのか分かりづらくなっていた時代に、「デジタル上のUIも、現実世界の『紙とインク』のように光を浴びて影が落ち、重さや厚みを持つべきだ」という物理ルールを定義しました。これにより、ユーザーの迷いをなくすことに成功しました。
2. Material Design:M1からM3への進化
| 世代 | コアコンセプト | 視覚的な特徴 | 主役・フォーカス |
|---|---|---|---|
| M1 (2014~) | 物理法則(紙とインク) | はっきりした影、ビビッドな原色 | ルールと統一 |
| M2 (2018~) | 柔軟性とブランド表現 | 白基調、広い余白、適度な角丸 | 企業・プロダクト |
| M3 (2021~) | パーソナライズ(You) | 大きな角丸、自動生成カラー | 個々のユーザー |
⭐Material Design 1 (2014~)
紙とインクをコンセプトに誕生。それまでアプリごとにバラバラだったAndroidアプリやWebサービスの見た目を劇的に統一しました。「ユーザーの操作に対するインタラクティブなフィードバック(リップルエフェクトなど)」が強く意識され始めたのは、まさにこの時代からかと!
⭐⭐Material Design 2 (2018~)
「どれを作ってもGoogleのアプリっぽい見た目になってしまう」というM1の課題を解決するために進化しました。
Material Themingという仕組みが導入され、企業のブランドカラーや独自のフォントを保ったまま、Material Designの優れた利便性やロジックを組み込めるようになりました。AirbnbやLyftなどが自社流にアレンジして採用したことでも有名です。
⭐⭐⭐Material Design 3 (2021~)
Material You(あなた)というサブネームが冠され、万人共通のデザインから個人の好みに最適化するデザインへと大きなシフトを遂げました。
ユーザーが設定したスマートフォンの壁紙からメインカラーを自動抽出し、アプリ全体の配色をリアルタイムに生成する「Dynamic Color」を搭載。さらに、折りたたみスマホやタブレットなどの多様な大画面にも美しく適応するレスポンシブ性が強力に強化されました。
3.UI作成業務の変化
静的な画面を描く「画作り」の作業から、動的な体験とシステムの設計へと役割が大きく進化しています。
| フェーズ | 過去(〜2020年前後)の業務 | 現在(2026年時点)の業務 |
|---|---|---|
| 初期アイデア | 手書きやワイヤーフレームを手作業で作成 | AIで数十パターンのたたき台を瞬間出力し抽出 |
| カンプ作成 | 静的な画面カンプをピクセル単位で量産 | 変数(デザイントークン)を組み込み動的なUIルールを構築 |
| 検証・共有 | 静止画を繋いだ簡易プロトタイプで確認 | AIと連携し、初期から「動くコード」をビルドして検証 |
| 開発連携 | 赤入れや仕様書を作成し手動で引き継ぎ | Figmaとコードが直接連携し変更が即時同期 |
私は普段エンジニアとして開発に携わっているため、デザイナーの専門的なワークフローの細部までは語れませんが、現在主流となっているFigma等のデザインツールにも強力なAI(Figma AIなど)が標準搭載されています。プロンプトを入力するだけで、自社のデザインシステムに沿ったUIコンポーネントが即座に出力される世界になりました。
今後は、デザイナーとエンジニアがともにAIエージェントと対話しながら、初期段階から実際に動くUIを作成し、より高速かつ本質的にユーザー体験を検証していくワークフローが当たり前になっていくと考えられます。
4. M4はどのようなものになるんだろう。
警告
ここから先は私個人の見解であり、所属組織の公式方針を示すものではありません
現在、生成AIのUI作成の課題としてよほど言語化能力やプロンプトの設計が高くない限り、意図通りの正確なUI出力は難しいという点が挙げられます。
そのため、次期Material Design(仮に M4とします)に求められる役割は、単なる「静的なパーツのカタログ」ではなく「AIが勝手で破綻したUIを生成し、ユーザーを混乱させることを防ぐための法則」になるのではないでしょうか。
ずばり私のM4のテーマ予想としては
AIによる動的生成と環境適応、信頼を与えるデザイン
となるのではないかと思ってます!
① 生成UIのルールエンジン化
現在の生成AIにおける「UI品質やアクセシビリティのばらつき」という課題を、システムによって解決するため、AIが画面を自動生成する際、文字サイズや余白、コントラストがバラバラだとユーザー体験は一瞬で崩壊します。M4では、AIが画面を生成する際のレイアウト構文や情報優先度のアルゴリズムが厳密にガイドライン化されるのでは!(現在もありますしね)
② テーマカラーは固定化されず、状況に応じてリアルタイム変形
M3の「primaryに応じたカラー生成」からさらに一歩進み、ユーザーの現在の状況(文脈)・歩行状態・認知負荷・周りの明るさに応じて、リアルタイムにUIの密度やコントラストが変形するトークンへと進化するのではないでしょうか。
今後は、端末上で処理される文脈情報や周囲の明るさなどを活用して、視認性や情報量を動的に調整するUIが増えるかもしれません。
⚠️ただし、その実現には本人の明示的な同意、目的を限定した利用、オンデバイス処理、不要な保存をしない設計が前提です。私自身、AI時代のUIでは「便利さ」と同じくらい「安心して任せられること」が重要になると考えています。
③ 2D画面とバーチャル空間の「物理法則」の統合
Googleは現在、Android XRやGeminiを中心としたマルチデバイス・空間コンピューティング構想を強力に推進しています。2Dのスマートフォン画面で見ていたカード型のUIが、XRグラスをかけた瞬間に奥行きを持った3Dオブジェクトへとどのように物理変化(モーフィング)すべきかの基準が定義されるのでは…?
でもここら辺は時代の流れ的にまだバーチャルが主流!とまでは言えないのでまだ先かもですね。
④ エージェント対話型UIの標準パターン化
AIがどのような入力をもとに、どのような処理や判断を進めているのかを、ユーザーに分かる形で示すことは、信頼につながることから不可欠だと考えています。「AIが背後で思考・処理している状態」をユーザーに安心して見せるためのUIコンポーネントが、標準システムとしてパターン化されると予想します。
おわりに:これからの「デザイン」はどうなっていくのか
AIが開発の主流となり、物事のアウトプットの速度が限界まで上がったことで、今後は「デジタルな道具を機械的に操作させている感」をなくしていくことが求められるのではないでしょうか。まるで人間の意志を汲み取る賢い相棒とやり取りしているような感覚を生み出すことこそが、デザインの重要な価値になっていくはずです。
従来は「Twitterを開く」「Amazonを開く」といった、アプリごとの画面遷移が主流でした。しかしこれからは、アプリ同士の境界線が溶け出し、ユーザーの目的に合わせてUIがその場で自律的に組み上がる流れるような体験が主流になっていき、それがM4にも組み込まれるのではないでしょうか。
AIが自律的に判断して処理を行う「AIエージェント」が社会に普及する中で、デザインが担うべき最も重要な役割は、ユーザーに安全と安心を与える信頼のデザインなので、デザインシステムの進化とAIの台頭とともに、これからのデザイナーやUI開発者は、単に画面を「描く人」から、プロダクトの世界観とルールの指揮者へと変化していくのかもしれませんね。