AI×UIリサーチ&プロトタイプ” ─ 入門編
0%
1
1. はじめに：UI初心者のための “AI活用地図”2
2. AIでUIリサーチを進める — 探す力を強化しよう3
3. AIでUIプロトタイピングAI×UIリサーチ&プロトタイプ” ─ 入門編
UIデザイン初心者がつまずく大きな理由のひとつは、「リサーチすべきキーワードが浮かばない」 という問題です。
画面の構造は決まった。でも、どんな UI パターンがあるのか名前が浮かばない。
考えているだけで 1 時間スクロールして終わることも珍しくありません。
ここで AI が力を発揮します。
構造の背景（ユースケース・役割・大切なこと）を整理して AI に伝えるだけで、比較テーブル・フィルター付きカード・スペック対比表 など、“次にリサーチすべきキーワード” を 5 分で手に入れることができます。
キーワードがないとリサーチが始められない。この方法は、UI パターンの引き出しを増やしながら、リサーチの時間を 1/10 に短縮するための必須スキルです。
つまり“スタート地点に立てない”状態。
この方法を使えば、AI が「リサーチすべき UI パターン名」を整理してくれるため、迷わずリサーチを始められます。
───────────────────
要件や構造の背景から、「調べるべき UI パターンの候補」をAIに提示してもらう という発想です。
そのキーワードを使って自分で検索する／AI に深掘りしてもらうことで、知識を吸収しながらリサーチを進めることができます。
AI はこの“キーワードの棚卸し”が圧倒的に得意。初心者こそ、積極的にこの部分を委ねましょう。
───────────────────
これは半分正解で、半分間違いです。
AI の役割は答えを出すことではなく、“リサーチの起点”を作ること。
重要なのは：
というプロセスです。
───────────────────
STEP1 構造の背景を整理
STEP2 AI にパターン名を提案してもらう
STEP3 そのキーワードでリサーチする
ポイント：背景（ユースケース／役割／大切なこと）を具体的に伝えること。
───────────────────
作る UI の構造について、3 つの視点でまとめる：
これはそのまま AI に渡すプロンプトになります。
───────────────────
STEP1 で整理した背景を AI に伝える。
良い例：
「EC サイトで商品を比較検討する画面を作っています。
ユーザーは複数の商品を見比べたいと思っていて、
価格・評価・在庫状況をパッと比較できることが重要です。
このような構造に合う UI パターンやコンポーネントの名前を教えてください」
悪い例：
「商品一覧のUIを教えてください」
→ 背景がないと一般論しか返ってこない。
───────────────────
───────────────────
───────────────────
───────────────────
「どんな UI パターンがあるんだろう？」と悩んだら、まず 5分だけ背景を整理 してみてください。
これだけで、AI が返すパターン名の精度が劇的に上がります。
引き出しが増える → 発想が広がる → UI 判断力が鍛えられる。学びながらデザインを進められるようになります。
───────────────────
AI は「答えを出すツール」ではなく、“リサーチの起点を作るパートナー”。
構造の背景を伝えることで、あなたがまだ知らない UI パターン名・コンポーネント名が手に入ります。
そして、そのキーワードで実際のサービスをリサーチすることで、
が理解できるようになり、UI の基礎体力が着実に育っていきます。