Publié le 18 mai 2026
WebMCP peut être utilisé de nombreuses façons. Dans ce document, vous découvrirez comment implémenter WebMCP pour aider les utilisateurs et leurs agents. Vous découvrirez ce processus du point de vue de l'utilisateur et de l'agent, avec des recommandations d'outils que vous pouvez fournir pour prendre en charge un parcours utilisateur critique (CUJ).
Aider les utilisateurs à effectuer des achats
Les développeurs de magasins de détail sont d'excellents candidats pour WebMCP. Dans certaines circonstances, un utilisateur peut vouloir choisir un article à la main, par exemple pour trouver la pièce manquante de sa collection. Dans d'autres cas, la tâche doit simplement être effectuée. Il peut s'agir de sa liste de courses hebdomadaire, de l'organisation d'une fête ou de la commande de ses achats préférés.
Notre utilisateur pour ces CUJ d'achat est Jesse. Jesse ne veut pas passer de temps à parcourir les catégories pour trouver exactement ce qu'il recherche. Au lieu de cela, il s'appuie sur l'agent de son navigateur pour répondre à ses besoins d'achat, ce qui lui permet de trouver plus rapidement les articles qu'il souhaite et de passer à la caisse plus rapidement.
Prendre en charge le parcours d'achat
Jesse a décidé d'acheter des fournitures pour la fête d'anniversaire de ses enfants. Le thème de la fête est l'espace, et Jesse a déjà écrit une liste de courses. Certaines fournitures peuvent provenir d'épiceries spécialisées, d'autres de grandes surfaces et d'autres encore de fournisseurs spécialisés dans les articles de fête.
Jesse demande à l'agent de son navigateur : "Trouve-moi les meilleurs prix pour les produits de ma liste de courses dans deux ou trois magasins locaux. Crée ma liste de souhaits pour que je puisse finaliser ma commande. Dis-moi s'il y a des produits que tu ne trouves pas."
Jesse a fait quelques hypothèses en posant cette question. Il suppose, entre autres, que l'agent n'ajoutera pas le même article dans plusieurs paniers. Si deux magasins proposent un article, l'agent déterminera lequel est le moins cher et l'ajoutera à ce panier. Jesse suppose également que les magasins locaux se trouvent à Springfield.
Que vous soyez développeur pour un établissement local, Space Shoppe, qui propose un grand nombre d'articles de fête pour enfants, ou développeur dans une grande chaîne d'épiceries, vous pouvez créer des outils pour aider l'agent de Jesse.
search_products()pour que Jesse trouve des articles possibles dans une catégorie qui répondent aux attentes de la liste de courses. Par exemple,productType="wall-decorations",category="planets", etage="child".add_to_wishlist()pour que Jesse examine tous les articles avant de les ajouter à son panier.- Si Jesse demande que tous les produits coûtent moins d'un certain montant, vous pouvez
proposer un outil pour affiner la recherche, tel que
refine_search(priceRange = "0-49.99").
Prendre en charge les achats répétés
Jesse a adoré les bâtonnets de fromage de l'épicerie Example Grocery Company, mais il ne se souvient plus de la marque. Jesse demande à son agent : "Peux-tu recommander les bâtonnets de fromage que j'ai achetés le mois dernier ?"
Si vous ne proposez pas de service sur abonnement, vous pouvez toujours aider les clients à commander à nouveau le même produit avec leur agent. En tant que développeur pour Example Grocery Company, vous pouvez proposer les outils suivants :
get_order_history(startdate="",enddate="",)qui renvoie les détails du produit avec la date de commande et l'état de la livraison.add_to_wishlist(productId="XYZ", quantity = 1)pour que Jesse examine tous les articles avant de les ajouter à son panier.delivery(method="pickup")
L'agent répond à Jesse : "J'ai trouvé votre commande de Cheddar Peelers du 7 mars. J'ai ajouté un paquet à votre panier. Voulez-vous passer à la caisse ?" Jesse peut ensuite passer rapidement à la caisse depuis Example Grocery Company pour commander uniquement les Cheddar Peelers, ou continuer à parcourir et à acheter d'autres produits.
Aider les utilisateurs à remplir des formulaires
La saisie automatique est une fonctionnalité de navigateur incroyablement utile qui, lorsqu'elle est déployée correctement, peut réduire le taux d'abandon des formulaires de 75%. Nous vous encourageons à créer des formulaires avec saisie automatique, mais nous pouvons améliorer encore davantage les taux de remplissage à l'aide de WebMCP.
WebMCP permet aux agents des utilisateurs de remplir des formulaires longs rapidement et correctement. Dans les sections suivantes, nous aidons Charlie à remplir différents formulaires complexes.
Gérer les tâches
Charlie travaille dans l'informatique dans un cabinet d'avocats, et il a engagé un sous-traitant pour concevoir un nouveau site Web pour le cabinet. La gestion des dépenses et des feuilles de temps est très difficile, en particulier parce qu'elle a des attentes différentes de celles des feuilles de temps des avocats.
Vous travaillez pour une entreprise de logiciels de gestion du travail et vous souhaitez permettre à tous les fournisseurs et avocats de saisir plus facilement leurs feuilles de temps avec le contexte approprié, afin que l'entreprise facture le bon montant au bon service. Vous pouvez ajouter un outil WebMCP pour permettre aux sous-traitants et aux avocats de Charlie d'utiliser un agent pour saisir les tâches quotidiennes de leur feuille de temps.
<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>
Acheter une voiture
Charlie souhaite acheter une voiture d'occasion. Certaines caractéristiques lui tiennent particulièrement à cœur, comme le type de voiture, le nombre de sièges et le carburant préféré. D'autres caractéristiques, comme la couleur de la voiture et les équipements tels qu'une caméra de recul, sont moins importantes. Charlie demande à son agent : "Peux-tu m'aider à trouver une voiture familiale ? Elle doit avoir sept places, fonctionner à l'essence ordinaire et être un modèle des 10 dernières années."
Si votre site Web comporte déjà un formulaire avec des champs obligatoires et facultatifs, il ne vous faudra que deux étapes pour le transformer en outil 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, ... })
Réclamation au titre de la garantie
Charlie souhaite faire une réclamation au titre de la garantie pour sa télévision. Il arrive sur la page principale du site Web sur lequel il a commandé la télévision. Il indique immédiatement son intention à un agent :
"Accède à la page d'assistance et fais une réclamation au titre de la garantie pour ma télévision. L'écran ne s'allume pas. Le numéro de série est XYZ-987. Utilise les informations que j'ai enregistrées pour le reste."
L'agent qui utilise les outils WebMCP lance le processus de réclamation et remplit toutes les informations nécessaires. S'il a besoin de plus d'informations, il peut demander à l'utilisateur de les fournir à l'agent ou de remplir le formulaire manuellement et de l'envoyer.
start_claim_process()pour accéder au formulaire approprié.populate_product_details(serial_number, purchase_date)pour saisir les informations spécifiques sur le produit et la date.describe_issue(issue_description)pour remplir le champ de texte long avec la description du problème à partir du prompt de l'utilisateur.populate_contact_info(name, email, phone)
En fournissant des outils WebMCP dans ce cas, nous aidons les utilisateurs avec des agents à naviguer sur le site Web sans avoir à comprendre où trouver un formulaire de réclamation au titre de la garantie. Charlie a pu mener à bien son parcours utilisateur sans avoir besoin de comprendre en détail la structure du site Web.
Demande de services pour un événement
Charlie et Jesse se marient en septembre et souhaitent engager un traiteur. Des dizaines de traiteurs sont disponibles dans leur région, et ils veulent s'assurer que chaque demande contient les informations requises et demande le même type de service.
Charlie demande à son agent :
"Peux-tu envoyer une demande de renseignements à des traiteurs basés à Springfield pour notre mariage le 8 septembre 2026 ? Nous souhaitons un menu végétarien pour 100 invités. Deux de nos invités ont des restrictions alimentaires et auront besoin de repas spéciaux, dont un repas casher et un repas sans gluten. Nous ne voulons inclure que de la bière et du vin."
Aidez l'agent de Charlie à envoyer une demande de renseignements à votre entreprise de traiteur en ajoutant ces outils :
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()
Aider les utilisateurs à filtrer les informations
Il existe de nombreux types de sites avec de grandes collections d'articles qui comportent des filtres complexes. Il peut y avoir des centaines ou des milliers d'annonces, chacune avec une combinaison unique de fonctionnalités qu'un utilisateur peut rechercher. Par exemple, cela peut inclure des sites Web de location de logements, des sources de réservation d'hôtels et des sites de billetterie.
Dans cette section, nous aidons Dana à trouver des options pertinentes pour ses préférences spécifiques.
Trouver des annonces immobilières pertinentes
Dana déménage dans une nouvelle ville avec sa famille et doit trouver un appartement. Tous les sites immobiliers affichent des informations différentes. Certains ont des photos, d'autres proposent plusieurs types de filtres, y compris le prix, le nombre de chambres, le nombre de salles de bain et d'autres caractéristiques. Certaines annonces indiquent un emplacement exact, tandis que d'autres ne mentionnent que le quartier.
Dana demande à son agent :
"Montre-moi les appartements à louer à Brooklyn qui se trouvent à moins de 10 minutes à pied d'une station de métro A et à moins d'une heure de Tribeca. L'appartement doit avoir au moins trois chambres et un lave-vaisselle. Il serait bien d'avoir un lave-linge et un sèche-linge dans l'appartement ou dans l'immeuble. Notre budget est de 4 500 $."
Vous pouvez aider l'agent de Dana à trouver des locations adaptées et pertinentes en ajoutant un filtrage adapté aux agents à votre site d'annonces :
Rechercher
search(
max-price=4500,
location="Brooklyn",
features=["dishwasher"],
rooms=3,
optionalFeatures=["washer-dryer"]
)
Appliquer des filtres
apply_filters(
transit="train",
max_time="1 hour",
destination="Tribeca"
)
L'agent utilise ces fonctions pour analyser les métadonnées de la propriété et s'assurer que les résultats répondent à toutes les exigences (y compris trois chambres et un lave-vaisselle). En réponse, l'agent renvoie une carte avec des repères qui renvoient à des annonces spécifiques, ainsi que la distance totale depuis Tribeca. Les repères sont d'une couleur différente s'ils comportent la fonctionnalité facultative, un lave-linge et un sèche-linge, dans l'annonce.
Réserver un voyage
Dana et sa femme, Rosario, prévoient des vacances à Berlin, en Allemagne. Dana souhaite trouver des options d'hôtel qui répondent à leurs critères, en leur offrant un séjour confortable à un prix abordable. Dana demande à son agent : "Trouve-moi quelques hôtels à Berlin, en Allemagne, à moins de 300 $ la nuit, avec piscine et petit-déjeuner inclus."
Vous êtes développeur pour un service de réservation de voyages qui cherche à trouver des offres de voyage intéressantes :
Rechercher
search_hotels(location = "Berlin", guests = 2)
Appliquer des filtres
filter_search_results(max_price=300,amenities=["pool","restaurant"])
L'agent de Dana renvoie trois hôtels qui répondent aux critères et demande : "Souhaitez-vous que je vous montre d'autres options ? Ou y a-t-il d'autres critères à prendre en compte ?"
Envoyer des commentaires
Quels types de parcours utilisateur pensez-vous pouvoir bénéficier de WebMCP ? Des fonctionnalités supplémentaires peuvent-elles être ajoutées aux API pour répondre à vos attentes ? Si vous essayez ces API et que vous avez des commentaires, n'hésitez pas à nous en faire part.
- Lisez l'explication de WebMCP, posez des questions et participez à la discussion.
- Consultez l'implémentation de Chrome sur Chrome Status.
- Rejoignez le programme d'aperçu anticipé pour découvrir les nouvelles API et accéder à notre liste de diffusion.
- Si vous avez des commentaires sur l'implémentation de Chrome, signalez un bug dans Chromium.