コンテンツに移動
AI & 機械学習

トークショップ: 会話型 AI エージェントを活用してデザイナーと開発者の可能性を広げる 7 つの方法

2025年11月11日
Sheila Narasimhan

Staff UX Research Lead, Google Cloud AI

Rana Abdalla

UX Designer, Google Cloud AI

Try Gemini 2.5

Our most intelligent model is now available on Vertex AI

Try now

※この投稿は米国時間 2025 年 11 月 1 日に、Google Cloud blog に投稿されたものの抄訳です。

オンライン ショッピングといえば、固定された検索バーに特定のキーワードを入力し、関係のない結果を延々とスクロールしていた時代を覚えていますか?一般的な従来の e コマースでは、検索によって探している商品を正確に見つけられる消費者は 10 人に 1 人程度にすぎません。

AI の時代では、デザイナーや開発者がユーザーの期待に応えられる可能性が高まります。では、ユーザーは具体的に何を求めているのでしょうか。また、ユーザーが満足し、必要なものを手に入れることができるようなエクスペリエンスを、どのように設計すればよいのでしょうか。会話型 AI を使用すれば、オンラインでの検索やショッピングを大きく進化させ、より自然でパーソナライズされた効率的なインタラクションを実現できます。設計の原則として、マルチモーダル入力、インテリジェントなクエリ処理、リッチなビジュアル表示、透明性とアクセシビリティの向上を優先することで、小売企業はユーザーの期待に応え、オンライン ショッピング ジャーニーを変革する AI エクスペリエンスを構築できます。

このブログでは、会話型 AI エージェントを構築することで、買い物客のオンライン ショッピング エクスペリエンスを向上させる 7 つの方法と、その設計を始める方法をご紹介します。

1. ユーザーを理解するスマートな検索

最適なキーワードを探す時代はもう終わりました。AI を活用した検索、つまり「会話型」の検索では、自然言語を理解し、完全なフレーズのクエリ、ユーザーの意図、コンテキストを解釈します。つまりユーザーは、「雨が降ったときのハイキングに適したジャケットは?」や「100 ドル以下の赤いスニーカーを見せて」といった自然なフレーズを使用して検索できます。また、AI は、コンテキスト、ユーザーの履歴、トレンドに基づいて、最も関連性の高い商品をインテリジェントにランク付けして優先順位を付けることもできます。

https://storage.googleapis.com/gweb-cloudblog-publish/images/Image1_oMrURoF.max-1300x1300.jpg

ユーザーが探しているものをさらに迅速に見つけられるよう、Google Cloud の会話型コマース エージェントなどの AI は「予測支援」を提供し、ユーザーの入力中に候補を提案します。クエリが曖昧な場合、会話型 AI エージェントはクエリを明確にするための質問を積極的に行います。これによりユーザーのストレスを軽減し、商品を見つけやすくします。

2. パーソナライズされたおすすめ情報 

AI を活用すれば、真にパーソナライズされたショッピング エクスペリエンスを実現できます。AI は、ユーザーの過去の行動、好み、会話履歴などのやり取りに基づいて商品を提案できます。たとえば、旅行でユーザーがフライトを予約する場合を考えてみましょう。窓側の席を希望しているのに通路側の席が割り当てられていることに AI エージェントが気づいたとします。この場合、窓側の席が空いていたらユーザーに通知するエクスペリエンスを設計し、ユーザーに席を変更するオプションを提供できます。ただし、AI エージェントは、結果がパーソナライズされる理由について透明性を保つことが重要です。たとえば、「過去の検索 / 予約に基づいておすすめしています」と明記し、ユーザーがパーソナライズ オプションを変更またはリセットできることを常に明確にする必要があります。

https://storage.googleapis.com/gweb-cloudblog-publish/images/Image2_1Mvfnfv.max-1600x1600.png

3. シームレスな会話型インタラクション

ユーザーは、Gemini や AI モードなどのツールを使用するのと同じように、会話形式で AI とやり取りすることにますます関心を持つようになっています。デザイナーにとって、これは商品の在庫状況、アイテム間の違い、最適な店舗の場所などについて、自然言語で質問できるようになったことを意味します。会話機能が強化されたことで、デザイナーはユーザーのスタイルに合わせてカスタマイズされたプロンプトを提供できるようになりました。

たとえば、Google の調査によると、エンドユーザーは、より魅力的な「エージェント エクスペリエンス」を求めていることがわかっています。クエリがあいまいな場合に、このやり取りの中で内容を明確にするための質問をすることが重要です。

これらのツールはマルチモーダル入力にも対応しており、音声、画像、テキスト、またはそれらの組み合わせを使用して検索できます。特にモバイル デバイスでは、音声検索の柔軟性とハンズフリーの利便性が評価されています。デザイナーは、ユーザーが自ら目にした商品の画像をアップロードし、エージェントに色違いの商品を表示するよう音声で指示するエクスペリエンスを設計できるのです。

https://storage.googleapis.com/gweb-cloudblog-publish/original_images/Image3_BXOVcK9.gif

4. 不満の解消と比較機能の強化

オンライン ショッピングの大きな課題の一つは、商品の在庫状況が不明確なことと、在庫切れの場合に不適切な代替品が表示されることです。AI を使用すれば、リアルタイムの在庫情報を提供し、商品が在庫切れの場合は関連性の高い代替品を提案できます。

ユーザーは「商品の比較」のための優れたツールも強く望んでおり、特に栄養に関する情報や、技術製品、自動車、衣料品などの仕様の詳細を必要としています。「比較」ボタンや、1 つの画面で違いを並べて表示するといった機能が求められています。AI が生成した対照比較表は、ユーザーが製品を比較して選択するのに役立つため、高く評価されています。

5. 鮮明な画像とユーザー フレンドリーな設計

オンライン ショッピングでは、検索結果とともに商品の写真や画像が表示されることが重要です。AI が提供するインターフェースでは、ビジュアル レイアウトや「カルーセル」などの機能を使用して結果を効果的に表示できます。カルーセルは画面を煩雑にすることなく複数の関連商品を表示できるため、モバイルで特に便利です。デザイナーには、次の点を考慮することをおすすめします。

  • モバイルでの配置を見直す: モバイルの会話型機能では、会話型 UI をページの上部に配置すると商品の表示が下に移動します。こうした UI を画面の下部、フライアウト メニュー、サイドパネルなどに配置し、ユーザーが商品を閲覧しながら AI とやり取りできるようにすることを検討してください。また、会話が表示されるタイミングをユーザーが制御できるようにします。

  • 「共同ブラウズ」エクスペリエンスを優先する: 推奨されるデザインは「統合モード」です。AI アシスタントを商品検索結果と同じページに表示し、ユーザーが AI を使用して検索を絞り込んだ際に、商品の最新情報がリアルタイムで表示されるようにします。ページ上部に要素を配置すると煩雑になりがちなため、理想的な方法としてはサイドパネルやフライアウトがおすすめです。

  • わかりやすく直感的なラベルを使用する: 「ショッピング アシスタント」のような説明的なラベルを使用すると機能の役割が明確になります。

6. 信頼の構築とエラーの適切な処理

ユーザーが AI 機能を導入するうえで、信頼は重要な要素です。ユーザーは、AI が提供する情報について、情報源の明確な帰属情報を求めています。そのためショッピングのコンテキストでは、商品の詳細、価格、小売業者へのリンクを明確に表示します。

AI がクエリを完全に理解できない場合や結果が見つからない場合でも、そのクエリを適切に処理する必要があります。「結果なし」という単純なメッセージを表示するのではなく、インテリジェントな提案や代替案を提示したり、より明確に入力するようユーザーに促したりすることで、生産的な対話を維持できます。

7. 会話型コマース コンポーネント ライブラリ:

Google は、ダウンロード可能なコンポーネント ライブラリとこれに付随する UX ユースケースを Figma で提供しています。これは、UX ドキュメントに記載されている設計を利用するためのガイドキットとして使用できます。 このライブラリには、Google の技術機能を反映して事前に設計、構築された再利用可能な UI 要素が含まれており、デザイナーや開発者は、これらのコンポーネントを特定のブランドニーズに迅速に適合させ、プロジェクトに合わせて迅速にカスタマイズして組み込むことができます。

コンポーネントには以下のものが含まれます。

  • デバイスサイズ

  • 色(黒 / 白 / 三次色)

  • タイポグラフィ

  • コンポーネントの種類(ボタン、フィルタなど)

  • 検索語句の入力

  • AI プロンプト

  • より詳細な結果

  • ライトモード / ダークモード

https://storage.googleapis.com/gweb-cloudblog-publish/original_images/Image4.gif

コンポーネント ライブラリは、迅速な実装を可能にするだけでなく、カスタマイズも抜群に容易です。デザイナーや開発者は、数回クリックするだけで、タイポグラフィやカラーパターンから角の丸みやレイアウト構造まで、あらゆるものを調整し、独自のブランド アイデンティティを反映したエクスペリエンスを簡単に作り上げることができます。この柔軟性により、企業は高度な AI 機能と、ブランドに沿った一貫性のあるユーザー インターフェースの維持を妥協することなく実現できます。コンポーネントは、スケーリングと適合を可能にするように構築されており、自律性を提供しながら開発オーバーヘッドを削減します。

使ってみる

デザイナーと開発者は、会話型 AI を使用して消費者のニーズに合ったサービスを提供できます。Vertex AI Search の会話型コマース エージェントを使い始めるには、以下のリソースをご利用ください。

-Google Cloud AI、スタッフ UX リサーチリード、Sheila Narasimhan 

-Google Cloud AI、UX デザイナー、Rana Abdalla 

投稿先