生成AIが変えるUIデザインの未来

UIデザイン生成AI「Galileo AI」

｢Galileo AI｣というUIデザイン生成AIがあります。ご存知ない方は、前回の記事も見ていただけると良いかもしれません。

どんなUIが生成されるのか

120画面ほど生成しました。以下にいくつかサンプルを紹介していきます。

Galileo AIで生成した120画面の一覧

ダイエットアプリ

例えば、「ダイエットのためのアプリを作って」とお願いするとこんな感じになります。食事の記録や体重の推移チャートなどのコンテンツが提案されます。(こちらからそれなりに指定することもできます)

ダイエットアプリの画面一覧

課金ページ

上記のようなアプリの種類による指定以外にも、「サブスクリプション購読画面を作って」みたいな依頼方法も可能です。もちろん、プラン数や内容も指定できます。（今回はダークテーマで生成されました）

サブスクリプションページのパターン一覧

設定ページ

他にも、「設定ページのレイアウトパターンが見たい」みたいな依頼方法もあります。一度のやりとりで生成できるのは最大6画面までですが、「もっと違うパターンも見せて」などと依頼して数を増やすこともできます。

設定画面のレイアウトパターン

UIデザイン生成AIの得意・不得意

120画面ほどUIを生成して見えてきた、Galileo AIの得意・不得意について。

【得意】コンテンツの提案

UIを生成するためには、当然ながら画面に載せるコンテンツが必要です。Galileo AIは、プロンプトや対話からそれを汲み取ることが得意です。

例えば、「フリマアプリを作って」と指示すると、フリマアプリには定番の「商品検索画面・商品一覧画面・商品詳細画面・決済画面」などを提案してくれます。つまり、「○○アプリなら、○○画面と○○画面が必要」という情報をある程度持っているようです。

さらに、「○○画面なら、○○コンポーネントと○○コンポーネントが必要」という情報も持っているようで、例えば「商品検索画面」なら「キーワード検索フォーム」や「検索ボタン」などを指示されずとも生成してくれます。

「プロフィール画面」で依頼した例。様々なコンテンツとコンポーネントが提案されている。

【不得意】スタイルの提案

現時点のGalileo AIが生成するUIは、基本的なスタイルが統一されており、見出しやテキスト、各コンポーネントのサイズや余白などは変わりません。配色やフォントについてはいくつかのパターンを持っているようですが、コンテンツ生成の時ほど豊富なパターンは存在しないようです。

書籍紹介アプリの画面を依頼したところ、小洒落たテイストを提案してくれた例。

デザイナー×生成AIの在り方を考える

Galileo AIのスタイル提案はまだまだ実用的ではありませんが、コンテンツ提案の方はなかなかに強力で、デザイナーに成り代わることは難しくても、その作業を効率化できる可能性があります。

活用案1. UXリサーチフェーズにおけるプロトタイピング

例えば、解決策と製品のフィットを検証するSPFにおいて、従来の手書きワイヤーや骨組みワイヤーだけでプロトタイピングをするのではなく、生成AIで作った雰囲気UIでプロトタイピングするという選択肢を持つことなどができそうです。

活用案2. UI検討フェーズにおけるトライ&エラー

手を動かすデザイン作業において、「この路線は多分ない」と思った案でも、実際に作って自分の目で見て確かめるのが重要なこともあります。しかし、思いついたすべての可能性をデザインデータ上に起こすのは工数上厳しいものです。そこで、生成AIを活用できれば、「この場合のコンポーネントはカードか、カルーセルか、リストか、アイコン付きリストか」のようなモヤモヤを、数十秒で具現化して、自分の目で見て確かめることができるようになります。

生成AIはデザイナーの仕事を奪うのか

定番の議論として「生成AIはデザイナーの仕事を奪うのか」というものがありますが、Galileo AIに関して言えば、まだまだ人の手が欠かせないと感じました（サービスの設計思想としても、人間のパートナーという位置付けだそうです）。思うに、生成AIが人間のデザインプロセスを真似っこしているうちは、デザイナーに成り代わることはなさそうです。本当に怖いのは、人間とは全く異なるアプローチを取り始めたときです。

例えば、「超パーソナライズUX」で語られているように、「顧客への価値提供」「事業の拡大・経済成長」という大義名分のもと、テクノロジーとデータを駆使して、リアルタイムにパーソナライズされたUIを生成されたらどうなるでしょうか。人間がちまちまとFigmaを使ったUIデザインをしているうちに、実際にプロダクト上で超高速に実験と学習を繰り返されたら、人間のデザイナーでは敵いません。もっと言えば、ユーザーの閲覧履歴から好きな芸能人を読み取ったり、写真データから家族の顔を読み取ったりして、それに似た顔を使ったバナーを自動生成する、みたいなことだってしてくるかもしれません。

そのとき、デザイナーに残された仕事は、テクノロジーに対して真っ向勝負を挑むことではなく、テクノロジーが倫理観そっちのけのUI自動生成を行わないよう、生産性や経済成長の視点に偏ったサービス設計にならないよう、人の豊かさについて考えることなのかもしれません。

デザイナーの原研哉氏が著書『デザインのデザイン』の中で説いた「デザイナーは、ただ生活者の欲望に応えるのではなく、欲望そのものをエデュケーションしなければならない」とは、まさにそのことではないでしょうか。

『デザインのデザイン』を読み解く(要約･読みどころ･学び･参考文献), 原研哉 著 | 読み解くデザイン

おわりに

最後まで読んでいただきありがとうございました。普段noteではデザインと読書に関する記事を書いています。良かったらフォローしてください。

ばっこ｜note

追記

「生成UI x デザイン」のテーマは多くの方に読んで頂けるみたいなので、別の角度でもう１記事書いてみました。