ユーザー ジャーニーにおける WebMCP の役割

Alexandra Klepper
Alexandra Klepper
GitHub Bluesky

公開日: 2026 年 5 月 18 日

WebMCP にはさまざまな用途があります。このドキュメントでは、ユーザーとそのエージェントをサポートするために WebMCP を実装する方法について説明します。このプロセスについて、ユーザーとエージェントの視点から説明し、クリティカル ユーザー ジャーニー（CUJ）をサポートするために提供できるツールの推奨事項を示します。

ユーザーの購入をサポートする

小売店のデベロッパーは WebMCP の対象となります。コレクションの欠落したアイテムを見つけるなど、ユーザーがアイテムを手動で選択したい状況もありますが、タスクを完了させるだけでよい状況もあります。たとえば、毎週の食料品リスト、パーティーの計画、お気に入りの購入品の再注文などです。

これらのショッピング CUJ のユーザーは Jesse です。Jesse は、探しているものを正確に見つけるためにカテゴリを横断して検索するのに時間をかけたくありません。代わりに、ブラウザ エージェントを利用してショッピングのニーズを満たし、欲しいものをより早く見つけ、より迅速に購入手続きを完了できるようにします。

ショッピング ジャーニーのサポート

ジェシーさんは、お子さんの 10 歳の誕生日パーティーの準備をすることにしました。パーティーのテーマは宇宙で、ジェシーはすでに買い物リストを作成しています。一部の備品は専門店から、一部は大型スーパーから、一部はパーティー用品の専門店から調達する必要があるかもしれません。

Jesse はブラウザ エージェントに「ショッピング リストにある商品の最安値を 2、3 店舗の地元の店で探して」と依頼します。ほしいものリストを作成して、購入手続きを完了できるようにしてください。見つからない商品がありましたら、お知らせください。」

Jesse はこの質問をする際に、いくつかの前提条件を想定しています。たとえば、エージェントが複数のカートに同じアイテムを追加することはありません。2 つの店舗に商品がある場合、エージェントはどちらの店舗の費用が低いかを判断し、その店舗のカートに商品を追加します。また、ジェシーは、スプリングフィールドにある実店舗は自分の地元にあるものと想定しています。

地元企業のローカル ビジネスである Space Shoppe のデベロッパーとして、子供向けのパーティー用品を大量に推奨する必要がある場合でも、大規模な食料品チェーンのデベロッパーとして、Jesse のエージェントをサポートするツールを構築できます。

  • search_products(): Jesse が、ショッピング リストの期待を満たす可能性のあるアイテムをカテゴリ内で見つけます。たとえば、productType="wall-decorations"、category="planets"、age="child" などです。
  • add_to_wishlist() で、カートに追加する前にすべてのアイテムを確認します。
  • Jesse が特定金額以下のすべての商品をリクエストした場合は、refine_search(priceRange = "0-49.99") などの検索を絞り込むツールを提案できます。

リピート購入をサポートする

Jesse は Example Grocery Company のチーズスティックが好きですが、ブランド名を思い出せません。Jesse はエージェントに「先月買ったチーズスティックを再注文できますか？」と尋ねます。

定期購入サービスを提供していない場合でも、エージェントがお客様に同じ商品を再度注文するお手伝いをすることは可能です。Example Grocery Company のデベロッパーは、次のツールを提供できます。

  • get_order_history(startdate="",enddate="",)。注文日と配送ステータスを含む商品の詳細を返します。
  • add_to_wishlist(productId="XYZ", quantity = 1) で、カートに追加する前にすべてのアイテムを確認できます。
  • delivery(method="pickup")

エージェントは Jesse に「3 月 7 日のチェダー ピューラーのご注文を確認いたしました。1 つのパッケージをカートに追加しました。Would you like to proceed to checkout?（お支払い手続きに進みますか？）" Jesse は、Example Grocery Company で簡単に購入手続きを完了して Cheddar Peelers だけを注文することも、引き続き他の商品を閲覧して購入することもできます。

フォームの入力を簡単にする

自動入力は非常に便利なブラウザ機能であり、正しく実装すれば、フォームの離脱率を 75%削減できます。自動入力に対応したフォームを作成することをおすすめしますが、WebMCP を使用すると、完了率をさらに高めることができます。

WebMCP を使用すると、ユーザー エージェントが長いフォームをすばやく正確に入力できます。次のセクションでは、チャーリーがさまざまな複雑なフォームに記入する様子を説明します。

作業を管理する

チャーリーは法律事務所の IT 部門で働いており、新しいウェブサイトを設計するよう請負業者に依頼しました。経費とタイムシートの管理は非常に面倒でした。特に、弁護士のタイムシートとは異なる要件があるため、なおさらでした。

あなたは業務管理ソフトウェア会社で働いており、すべてのベンダーと弁護士が正しいコンテキストでタイムシートを入力できるようにして、会社が正しい部門に正しい金額を請求できるようにしたいと考えています。WebMCP ツールを追加して、Charlie の請負業者と弁護士がエージェントを使用して毎日のタイムシート タスクを入力できるようにします。

<form toolname="add-to-timesheet"
  tooldescription="Report billing task and time to add to the timesheet."
  toolautosubmit>

  <fieldset>
    <label for="date">Date</label>
    <input name="date" type="datetime-local" toolparamdescription="Date of work.">

    <label for="task_category">Task category</label>
    <select id="task_category" name="task_category"
    toolparamdescription="Type of task completed per time block">
      <option value="admin">Admin</option>
      <option value="billing">Billing</option>
      <option value="client">Client meetings or communication</option>
      <option value="development">Development</option>
    </select>

    <label for="minutes_worked">Minutes working on the task</label>
    <input type="number" id="minutes_worked" name="minutes_worked" min="30" max="600"
      toolparamdescription="Minutes worked on this date and task, with a minimum of 30 and maximum of 600."
      placeholder="60">

    <label for="work_details">Details</label>
    <input name="work_details"
      toolparamdescription="Additional details of work completed, for managerial review.">

  </fieldset>
  <button type="submit">Update timesheet</button>
</form>

車を購入する

チャーリーは中古車の購入を検討しています。車の種類、座席数、希望する燃料など、彼が特に重視する機能がいくつかあります。車の色やバックアップ カメラなどのアメニティといったその他の機能は、それほど重要ではありません。チャーリーはエージェントに「家族で使える車を探してくれませんか？7 人乗りで、レギュラー ガソリンを使用し、過去 10 年間のモデルである必要があります。」

ウェブサイトに必須フィールドと任意フィールドを含むフォームがすでに存在する場合は、2 つの手順でフォームを WebMCP ツールに変換できます。

HTML

<form toolname="search_cars"
  tooldescription="Search for cars based on various criteria such as type, seats, year, fuel, and features."
  toolautosubmit>

  <fieldset>
    <label for="car_type">Car Type</label>
    <select id="car_type" name="car_type" toolparamdescription="Type of car">
      <option value="">Any</option>
      <option value="family">Family Car</option>
      <option value="suv">SUV</option>
      <option value="sedan">Sedan</option>
    </select>

    <label for="seats">Min Seats</label>
    <input type="number" id="seats" name="seats" min="1" max="9"
      toolparamdescription="Minimum number of seats required"
      placeholder="7">

    <label for="min_year">Minimum Year</label>
    <input type="number" id="min_year" name="min_year" min="1900" max="2026"
      toolparamdescription="Find cars made after a specific year"
      placeholder="2016">
  </fieldset>

  <fieldset>
    <legend>Preferences</legend>

    <label for="fuel_type">Fuel Type</label>
    <select id="fuel_type" name="fuel_type" toolparamdescription="Preferred fuel type">
      <option value="">Unleaded regular</option>
      <option value="">Unleaded premium</option>
      <option value="diesel">Diesel</option>
      ...
    </select>

    <div>
      <input type="checkbox" id="has_ac" name="has_ac" value="true"
        toolparamdescription="Check if air conditioning is required">
      <label for="has_ac">Air Conditioning (AC)</label>
    </div>
  </fieldset>

  <button type="submit">Search Cars</button>
</form>

JavaScript

search_cars({car_type, seats, min_year, fuel_type, has_ac, ... })

保証請求

チャーリーさんはテレビの保証請求を希望しています。テレビを注文したウェブサイトのメインページに移動します。すぐにエージェントに意図を伝えます。

「サポートページに移動して、テレビの保証請求を行ってください。画面がオンにならない。シリアル番号は XYZ-987 です。残りの情報は保存済みの情報を使用します。」

WebMCP ツールを使用しているエージェントが、請求手続きを開始し、必要な情報をすべて入力します。エージェントが追加情報を必要とする場合は、お客様にエージェントに提供するか、フォームに手動で記入して送信するよう依頼できます。

  • start_claim_process() をクリックして、適切なフォームに移動します。
  • populate_product_details(serial_number, purchase_date) をクリックして、特定の商品と日付の情報を入力します。
  • describe_issue(issue_description) を使用して、ユーザーのプロンプトから取得した障害の説明を長文テキスト フィールドに入力します。
  • populate_contact_info(name, email, phone)

このケースで WebMCP ツールを提供することで、ユーザーは保証請求フォームの場所を理解しなくても、エージェントのサポートを受けながらウェブサイトを操作できます。Charlie は、ウェブサイトの構造を詳しく理解する必要なく、ユーザー ジャーニーを完了できました。

イベント サービスのリクエスト

チャーリーとジェシーは 9 月に結婚式を挙げる予定で、ケータリング業者を雇いたいと考えています。この地域には数十のケータリング業者がおり、各リクエストに必要な情報が含まれていて、同じタイプのサービスを求めていることを確認したいと考えています。

Charlie はエージェントに次のように尋ねます。

「2026 年 9 月 8 日の結婚式で、スプリングフィールドを拠点とするケータリング業者について問い合わせを送信してもらえますか？100 人のゲスト向けのベジタリアン メニューをお願いします。2 名のお客様に食事制限があり、コーシャ料理やグルテンフリー料理などの特別な食事が必要になります。ビールとワインだけを含めたいのですが。」

次のツールを追加して、Charlie のエージェントがケータリング会社に問い合わせを送信できるようにします。

  • start_event_request()
  • create_wedding_reception(guests=100,date="September 8, 2026")
  • add_dietary_restrictions(restrictions=["kosher","gluten-free"], guests = 2)
  • select_drink_package(package = "Light")
  • submit_event_request()

ユーザーが情報をフィルタできるようにする

複雑なフィルタを備えたアイテムのコレクションが多数あるサイトは数多く存在します。何百、何千ものリスティングがあり、それぞれにユーザーが求める可能性のある機能の独自の組み合わせがあります。たとえば、住宅賃貸サイト、ホテル予約サイト、チケット販売サイトなどが該当します。

このセクションでは、Dana が自分の好みに合ったオプションを見つけるのを手伝います。

関連性の高い住宅リスティングを見つける

ダナさんは家族と一緒に新しい街に引っ越すため、アパートを探しています。どのサイトにもさまざまな情報が掲載されており、写真が掲載されているサイトもあれば、価格、寝室数、浴室数、その他の機能など、さまざまな種類のフィルタが用意されているサイトもあります。正確な場所が記載されているリスティングもあれば、近隣地域のみが記載されているリスティングもあります。

Dana はエージェントに次のように尋ねます。

「ブルックリンで A 線の駅から徒歩 10 分以内、トライベッカまで 1 時間以内の賃貸アパートを探して。アパート・マンションには少なくとも 3 つのベッドルームと食器洗い機が必要です。室内または建物内に洗濯機と乾燥機があると便利です。予算は 4,500 ドルです。」

Dana のエージェントが適切で関連性の高い賃貸物件を見つけられるようにするには、物件情報サイトにエージェント向けのフィルタを追加します。

search(
  max-price=4500,
  location="Brooklyn",
  features=["dishwasher"],
  rooms=3,
  optionalFeatures=["washer-dryer"]
)

フィルタを適用する

apply_filters(
  transit="train",
  max_time="1 hour",
  destination="Tribeca"
)

エージェントはこれらの関数を使用して物件のメタデータを解析し、結果がすべての要件（3 ベッドルーム、食洗機など）を満たしていることを確認します。これに対し、エージェントは特定のリスティングにリンクするピンと、トライベッカからの総距離を含む地図を返します。リスティングにオプション機能（洗濯機や乾燥機など）がある場合は、ピンの色が異なります。

旅行の予約

Dana と妻の Rosario は、ドイツのベルリンへの旅行を計画しています。Dana は、予算内で快適に宿泊できるホテルを探しています。ダナはエージェントに「ドイツのベルリンで、1 泊 300 ドル以下で、プールと朝食付きのホテルをいくつか探して」と依頼します。

あなたは、お得な旅行情報を探しているユーザー向けの旅行予約サービスのデベロッパーです。

検索

search_hotels(location = "Berlin", guests = 2)

フィルタを適用する

filter_search_results(max_price=300,amenities=["pool","restaurant"])

条件を満たす 3 つのホテルが返され、「他にも候補を表示しますか？」と尋ねられます。他に考慮すべき基準はありますか？」

フィードバックをお寄せください

WebMCP のメリットを享受できるユーザー ジャーニーはどのようなものだと思いますか？ご期待に沿えるよう、API に追加できる機能はありますか？これらの API をお試しになり、フィードバックがございましたら、ぜひお聞かせください。