ナレッジ・ノウハウ

【AI × UXデザイン】意思決定の速さと質が変わるAIを活用したUI/UX改善プロセス(ウェビナーレポート)

生成AIの進化により、UIデザインをこれまでになくスピーディに“見える化”できる時代が到来しました。しかし、素早く作れることと、適切な意思決定ができることは別問題です。

グッドパッチは2025年12月にウェビナー「AI×UXデザイン ─ 意思決定の“速さと質”が変わる、AIを活用したUI/UX改善プロセス」を開催しました。

本レポートでは、生成AIによるUI生成がもたらす新たな課題にフォーカスし、意思決定の質をどう高めるか、どのようにプロトタイプへ落とし込むかを具体的に解説しています。グッドパッチの取り組みを交えながら、プロダクト開発の精度とスピードを両立させるヒントをご紹介します。

【アーカイブ動画】AI×UXデザイン 意思決定の“速さと質”が変わるAIを活用したUI/UX改善プロセスAI×UXデザイン 意思決定の速さと質が変わるAIを活用したUI/UX改善プロセス(アーカイブ動画のご紹介)

目次

これまでのプロダクト開発現場における課題感

これまでのプロダクト開発現場における課題感
引用:AI×UXデザイン 意思決定の“速さと質”が変わるAIを活用したUI/UX改善プロセス(以下同)

まずは、生成AIが登場する前のプロダクト開発において、どのような課題が存在していたのかを振り返ってみましょう。特に顕著だったのは次の2点です。

モノ(デザイン)を作るまでに膨大な時間と手間が必要だった

これまでのプロダクト開発では、デザインを具現化するまでのプロセスは多岐にわたり、関係者間での認識のすり合わせ、UI仕様書の作成、ワイヤーフレームの検討など、多大な時間と労力を要していました。

特に0→1フェーズでは、要望があいまいでニーズも抽象的なケースが多く、具体化するまでに時間を要しがちです。その結果、意思決定が遅れ、チームの士気や開発スピードに悪影響を与えていました。

意思決定の速度と質が低下する構造的問題

従来のプロダクト開発では、テキストベースの情報に依存していたため、議論が抽象的になりやすく、「課題に対する解決策の方向性はこれが適切か?」「この要求整理でイメージしているものが出来上がるのか?」といった判断が困難でした。

その結果、「なんとなく良さそう」「なんとなくイマイチ」といった曖昧なフィードバックが増え、議論が空中戦になる傾向があったように思います。意思決定の質とスピードが低下し、初めて形にしてみると、手戻りや修正の頻度が増すという構造的な課題が生じていたのです。

以上が「これまでのプロダクト開発現場で抱えていた課題」の整理です。では、生成AIツールの進化によって状況はどう変わったのでしょうか?次に、現在の生成AIツールの進化と、それに伴って新たに浮かび上がってきた課題について見ていきます。

生成AI×デザインツールの普及でアイデアを瞬時に形にできるようになった

Layermate

Layermate(チャット形式でデザイン生成が可能な革新的ツール)
引用:AI×UXデザイン 意思決定の“速さと質”が変わるAIを活用したUI/UX改善プロセス

現在では、Layermateのような「プロンプトを入力するだけでUIが自動生成される生成AIツール」の登場により、例えば「健康管理アプリのトップページを作成して」と入力するだけで、それらしいUIが即座に表示され、アイデアを視覚的に確認できます。

これまで数日〜数週間かかっていたデザイン制作がわずか数分で完了し、初期アイデアの共有や議論のきっかけづくりに大きな変化をもたらしています。このようなAIデザインツールは、初期検討段階における強力な武器となりつつあるのです。

関連記事:【プロンプト公開】AIデザインツール「Layermate」の特長を紹介 Goodpatchデザイナーによる活用事例も

生成AIで作ったデザインがイマイチだと感じる理由

生成AIで作ったデザインがイマイチだと感じた時の課題と問題
引用:AI×UXデザイン 意思決定の“速さと質”が変わるAIを活用したUI/UX改善プロセス(以下同)

生成AIツールの進化によってアウトプットの速度は飛躍的に向上しましたが、生成AIで作ったデザインが期待通りではないと感じることもあるでしょう。次に「生成AIで作ったデザインがイマイチだと感じる理由」を考えてみます。

原因が分からない(例:生成AIにインプットした内容の良し悪しが分からない)

「生成AIに依頼したけれど、なんとなくイマイチ」と感じるものの、原因が分からない、ということは少なくないでしょう。その多くは「プロンプトがあいまいで、意図や文脈がAIに正しく伝わっていないこと」に起因します。抽象的な指示では、ターゲットや目的が不明瞭なままになり、漠然としたUIが生成されてしまいます。

こうして生成されたUIは、たとえ見た目が整っていても、「誰の課題も解決しないプロトタイプ」になりがちです。結果として根本的な手戻りが発生し、プロジェクト全体の進行にも悪影響を及ぼすリスクがあります。

症状が分からない(例:生成AIでアウトプットされたUIの良し悪しが分からない)

生成されたUIを見ても、「どこが良くないのか」が判断できず、適切な改善点を見出せないケースも少なくありません。判断基準があいまいなままだと、関係者から感覚的なフィードバックが集まりやすく、議論が本質から逸れて発散してしまうリスクが高まります。こうした状況を避けるためにも、明確な評価軸の設定が不可欠です。

ワークスロップ現象(Work-slopping)を回避する

ワークスロップ現象(Work-slopping)を回避する必要がある

このように、「原因も症状も不明なまま」生成AIを使い続けると、アウトプットは増えても意思決定にはつながらず、かえって手戻りが増えるという「ワークスロップ現象(Work-slopping)」が発生します。

本来は開発を高速化するはずの生成AIが、結果的に意思決定の総時間を増やしてしまう、この現象は生成AI時代ならではの落とし穴です。ワークスロップ現象を回避するためには、「インプットの質を高めること」と「判断基準を明確にすること」が不可欠なのです。

「ユーザーの課題を解決する良いデザインなのか?」は別問題である

生成AIで素早くUIを生成できるようになった一方で、それが「本当にユーザーの課題を解決しているかどうか」は別の問題です。ユーザーの本質的な課題や、理想の体験が言語化されていない状態のままでは、期待される成果にはつながりません。こうした落とし穴に陥らないためにも、十分な注意が必要です。

「意思決定の速度と質」は生成AIツールを使うだけでは著しく向上しない

生成AIを活用すればたしかに作成スピードは向上します。しかしそれだけでは、「どの案が優れているのか」「なぜそのUIが適切なのか」といった判断基準があいまいなままです。アウトプットの速度は上がっても、意思決定の“質”が伴わなければ、結果的に手戻りが増え、開発全体のスピードがかえって低下するリスクもあります。

\生成AIで作ったデザイン課題の詳細をより深く理解しましょう/
アーカイブ動画を見る

AIを用いた良質なプロトタイプを作るためのポイント

AIを用いた良質なプロトタイプを作るためのポイント(健康アプリをテーマに考える)
引用:AI×UXデザイン 意思決定の“速さと質”が変わるAIを活用したUI/UX改善プロセス(以下同)

ではここから、AIを用いた良質なプロトタイプを作るためのポイントを健康アプリの開発をテーマに考えていきます。ポイントは「UXの5段階モデル」を利用し、プロンプトに情報を統合的に組み込むことです。

「UXの5段階モデル」を利用し、情報を統合的に組み込もう

プロトタイプ(UI)作成では「UXの5段階モデル」を利用して情報を統合的に組み込もう

より質の高いプロンプトを作成するためには、戦略層から表層までの情報を一貫して組み込むことが重要です。

UXの5段階モデル」(戦略層 → 要件層 → 構造層 → 骨格層 → 表層)に基づき、NSM(ノーススターメトリック)、ペルソナ、UXシナリオ、ユーザーストーリー、PRD(プロダクト要求仕様書)などの要素を統合的に反映させることで、再現性の高い、質の高いプロトタイプが生成されやすくなります。

【例1】プロンプトにペルソナ情報を付与する

プロンプトにユーザー属性を付与した場合としなかった場合の生成AIの結果

ペルソナ情報を指定しないまま生成AIにUI作成を依頼すると、万人向けの無個性なデザインになりがちです。一方で、「20代向けの健康アプリ」「60代向けの健康アプリ」といったユーザー属性をプロンプトに明記するだけで、トンマナ・情報設計・操作性において、精度の高いUIを生成できるようになります。

ペルソナ情報を指定すると、例えば、若年層向けにはゲーミフィケーション要素、高齢層向けには文字サイズや余白への配慮など、属性に応じたUIの違いがはっきり表れます。生成精度を高めたい方には、ペルソナ属性の指定が特に有効です。

なお、「属性を指定しなかった場合に、どのようなUIが生成されるのか」も気になる方は多いと思います。その比較結果は、ウェビナーのアーカイブ動画でご紹介しています。ぜひご覧ください。

\ペルソナ情報の有無による生成結果の比較をチェック/
アーカイブ動画を見る

【例2】プロンプトにNSM(ノーススターメトリック)の情報を付与する

プロンプトにNSM(ノーススターメトリック)を付与した場合としなかった場合の生成AIの結果

NSM(ノーススターメトリック)とは、プロダクトの成功を測るための「北極星」となる定量指標のことです。例えば「週4回以上、運動を継続するユーザー数」のように、プロダクトの成長を象徴する行動指標をプロンプトに含めることで、生成されるUIにも自然と行動促進の要素が組み込まれるようになります。

具体的には、ユーザーのモチベーションを高める文言の配置や、リマインダー機能、行動を可視化するインターフェースなど、成果に直結するUIが生成されやすくなります。

上図は、NSMを指定した場合としなかった場合のUI生成結果を比較したものです。NSM「週4回以上、運動を継続する」を指定したUIでは、以下のような要素が確認できます。

  • 今週の達成日数(例:4/7日)が明示されている
  • 達成状況を視覚的に把握できる「今週の達成カレンダー」が表示されている
  • NSMの基準に対し、現在どの程度達成できているかが一目で分かる

このように、NSMをプロンプトに含めることで、生成されるUIの目的性や説得力が大きく向上します。AIに任せきりにするのではなく、重要な設計意図を積極的にインプットすることが、効果的な活用につながります。

なお、ウェビナー内ではこのNSMがどのように生成AIに解釈されたかについて、「設計思想」「情報の優先順位」「カラー/ビジュアル」の観点からも詳しく考察しています。より深く知りたい方は、ぜひアーカイブ動画をご覧ください。

\生成AIがNSMをどう解釈するかの考察をチェック/
アーカイブ動画を見る

【例3】プロンプトに理想の体験(シナリオ)を付与する

プロンプトに理想の体験(シナリオ)を付与する

生成AIの出力精度をさらに高めるには、ユーザーの行動や感情の流れを描いた「理想の体験(シナリオ)」をプロンプトに追加することが効果的です。

例えば、「営業職の24歳・ケンタさんが夜、疲れた帰り道にアプリを開き……」といった具体的なシナリオを含めることで、AIはその文脈に沿ったUIを提案できるようになります。これにより、理想の体験を満たすためのUIを生成できるようになります。

下図は、理想の体験をプロンプトに加えた場合に生成されたUIの一例です。個人名の表示や、当日の体調を尋ねる要素などが加わり、ユーザーの日常や文脈に自然に溶け込むようなデザインになっていることが分かるでしょう。

プロンプトに理想の体験(シナリオ)を追加すると生成AIの結果がさらに向上する

このように、シナリオを含めることで、単なる機能的UIではなく「一連の体験を支えるUI」の再現性が高まります。生成AIの活用精度を上げるために、ぜひシナリオの活用を実践してみてください。

\理想の体験(シナリオ)を付与する様子を動画でチェック/
アーカイブ動画を見る

生成AIを用いたプロトタイプの具体的な作成方法

ここからは、グッドパッチのデザイナーが実際にどのように生成AIを活用してプロトタイプを作成しているのか、その具体的な方法をご紹介します。

Cursorを使い、生成AIに入れる「プロンプト」を作成する

Cursorを使って生成AIに入れる「プロンプト」を作成していく
引用:AI×UXデザイン 意思決定の“速さと質”が変わるAIを活用したUI/UX改善プロセス(以下同)

グッドパッチでは、具体的なプロトタイプ作成において、AI対応エディター「Cursor」を活用することが多いです。Cursorを使うことで、AIへのインプット情報を段階的かつ構造的に整理でき、最終的に高品質なプロンプトとしてAIデザインツールへ渡すことが可能になります。

このプロセスでは、「ユーザー課題」「行動シナリオ」「仕様要件」などの情報を体系的にまとめ、プロンプトへと落とし込んでいきます。

Cursorを使ったプロトタイプの作成手順(手順1〜手順5)

Cursorを使って生成AIに入れる「プロンプト」を作成していく

Cursorを活用したプロトタイプ作成は、以下の5つのステップで構成されています。各ステップを通じて、プロンプトに必要な情報を整理・構造化し、より質の高いAI出力へとつなげます。先ほど紹介したポイントのまとめにもなりますので、確認としてもご活用ください。

手順1:事前準備(Preparation)

まず、プロジェクトの目的やターゲットユーザー、NSM(ノーススターメトリック)など、戦略レベルの情報を整理します。併せて、ペルソナや解決すべき課題なども準備を行い、プロジェクト全体の方向性を明確にしておきます。

手順2:シナリオ作成(Scenario)

UXシナリオをストーリー形式で作成します。例として「営業職のケンタさんが仕事帰りに疲れてアプリを開く」といったように、具体的な利用状況や感情の流れを含んだ物語として構成し、文脈を明らかにします。

手順3:ユーザーストーリー(User Story)

ユーザーがアプリ内でどのような行動をとるかを整理します。例えば「健康状態を記録したい」「モチベーションを維持したい」といった行動目的に基づき、必要な機能や要件を洗い出します。

手順4:PRD(Product Requirements Document)

必要な機能要件・非機能要件・制約条件を整理し、仕様書(PRD)として文書化します。これにより、生成AIの出力内容がプロジェクトの意図に沿ったものになりやすくなります。

手順5:プロンプト作成(Prompt)

これまでに整理した情報を基に、AIデザインツールにインプットするためのプロンプトを作成します。これにより、精度の高い指示文が自動生成され、スムーズにAIデザインツールへと転送できます。

ウェビナーでは、上記の手順1〜5を解説しながら、実際にCursorを使ってプロンプトを作成・活用する様子をご覧いただけます。ツール操作の具体的な流れを知りたい方は、ぜひアーカイブ動画をどうぞ。

\Cursorを使ったプロトタイプ作成手順を動画でチェック/
アーカイブ動画を見る

【まとめ】生成AIへ渡す「ユーザーの課題」と「解決の方向性」を深く言語化し、意思決定の速さと質を高めよう

【まとめ】生成AIへ渡す「ユーザーの課題」と「解決の方向性」を深く言語化し、意思決定の速さと質を高めましょう
引用:AI×UXデザイン 意思決定の“速さと質”が変わるAIを活用したUI/UX改善プロセス

生成AIは、デザインを早く生み出す力に優れています。しかしその力を“正しく”活かすためには、人間側が渡すインプットをどれだけ深く、構造的に言語化できるかが鍵を握ります。

本記事で紹介したように、NSM(ノーススターメトリック)やUXシナリオ、ユーザーストーリー、PRDといった複数の視点を整理し、それらをプロンプトに落とし込むことで、生成されるUIの実用性は大きく向上します。判断基準を明確にすることで、意思決定の“速さ”と“質”の両方を高め、「なんとなく」の判断から脱却できるようになります。

AIにすべてを委ねるのではなく、人が“意味”を与えること。その姿勢こそが、これからのプロダクト開発において最も重要な要素となるでしょう。

【グッドパッチからのお知らせ1】UI/UXフィードバックのご紹介

【グッドパッチからのお知らせ1】UI/UXフィードバックのご紹介

グッドパッチが提供する「UI/UXフィードバック」は、現役のUI/UXデザイナーがプロダクトを多角的に分析し、UIの視認性、情報設計、ユーザビリティといった観点から、具体的な改善提案を行うサービスです。

社内の判断が主観的になりがちな中で、第三者視点によるレビューを受けることで、見落とされがちなボトルネックや改善の余地を発見できます。

プロダクトのフェーズやチーム体制に応じて柔軟なアドバイスが受けられる点も特徴で、UIリニューアル前後の検証や、開発初期段階での方向性確認にも最適です。フィードバックはすぐに実務に活用できる実践的な内容が中心で、「スプリントの改善指針になった」「手戻りが減った」といった声も寄せられています。ユーザーに寄り添った体験設計の実現に、ぜひご活用ください。

\お気軽にご相談ください/
UI/UXフィードバックの詳細を見る

【グッドパッチからのお知らせ2】プロダクトグロース診断のご紹介

【グッドパッチからのお知らせ2】プロダクトグロース診断のご紹介

グッドパッチでは「プロダクトグロース診断」も提供しています。「ユーザー数は増えているが継続率が低い」「成長施策に手応えが感じられない」といった課題の解消に役立つ診断サービスです。

プロダクトの定量データ、ユーザー行動、UX設計など、複数の視点を組み合わせて分析し、成長を妨げるボトルネックを可視化します。さらに、改善の優先順位や具体的な施策も提案します。UI/UXの改善にとどまらず、オンボーディングや体験導線の設計、NSMとの整合性など、プロダクトグロースに必要な観点を包括的にカバー。診断結果はすぐに実行可能なアクションへ落とし込まれ、チームの次の一手を力強く後押しします。

「改善したいが、何から始めれば良いか分からない」、そんな方にこそ、活用いただきたいサービスです。ぜひ、利用をご検討ください。

\お気軽にご相談ください/
プロダクトグロース診断の詳細を見る