Design & Dev Tools

Shopify, Vercel Arm Stores for AI Agents

Shopify and Vercel are collaborating to build ecommerce shops for humans and AI alike.

Sharing a stage at Vercel’s Ship 26 conference in San Francisco on October 15, Shopify CEO Tobi Lütke and Vercel CEO Guillermo Rauch discussed the future of agentic ecommerce, including the release of Shopify’s rebuilt Hydrogen software development kit and Vercel’s AI-enabled open-source storefront template called Vercel Shop.

Hydrogen gives developers reusable tools for building Shopify storefronts across JavaScript frameworks. Vercel Shop puts those tools into a customizable store with agent-readable product information and shopping tools.

Vercel Shop also includes an optional assistant for shoppers. Hence an outside agent can shop on behalf of humans, and the store’s own assistant can help human visitors find products and manage a cart.

Screenshot of a Vercel Shop product page for the PeakDrive men’s tee at $48. The page shows a red T-shirt in four photos: a flat lay, a male model facing forward, a full-length shot with black shorts, and a side profile. An enlarged callout with a blue arrow points to the browser’s address bar, which reads template.vercel.shop/products/peakdrive-tee-mens-c8e348?Color=Red&Size=LG. The URL shows the selected color and size as parameters. A “Shop Agent” chat panel on the right reads “Hi, how can I help?”

The Vercel Shop template produces a typical ecommerce storefront for human shoppers, while still hinting at structured product information in the URL parameters.

Cooperation

The October announcement was the latest example of cooperation between the ecommerce platform and the application development provider, following the June 30 Hydrogen rebuild, allowing developers to use Shopify’s storefront tools across various JavaScript frameworks and runtimes.

To this end, the rebuilt Hydrogen SDK organizes common ecommerce functions into shared tools. Developers can reuse those functions while choosing how to build the shopper experience.

Custom Storefronts

Custom ecommerce storefronts require extensive integration. Developers must connect the shopping experience to the systems that enable purchases. Product pages need catalog data. The cart needs current prices and availability. The checkout page must retrieve the shopper’s selected items.

The rebuilt Hydrogen SDK and Vercel Shop template address that work in three related ways.

  • Commerce integration. Hydrogen provides access to Shopify data to manage carts, connect customer accounts, and handle checkout routes.
  • Framework choice. The rebuilt SDK leaves JavaScript framework and runtime selection to the developers.
  • A working foundation. Vercel Shop combines Hydrogen with a Next.js storefront template, giving developers product pages, search, a cart, and agent features to customize without starting from scratch.

Lütke described the reasoning behind that approach, stating, “Checkouts are ridiculously hard to get right. It’s one of those pieces of software that actually does need 20 years of tinkering with. And Shopify has always been very open, and so we invite people to remix pieces from our checkout just as much as you want. Basically taking all the infrastructure that Shopify built, and you can build whatever you want with it.”

Thus Shopify’s software enables developers to focus on how shoppers find products and interact with the store, building on shared commerce tools and extending the template as needed.

That foundation also supports multiple shopping experiences. People can browse the storefront or ask its assistant for help, while compatible outside agents can access product information and shopping tools on the merchant’s domain.

External Agents

An AI agent shopping on a consumer’s behalf needs to find products, check options, and eventually build a cart. Vercel Shop supports those tasks without requiring the agent to navigate the visual storefront.

  • Product information. Storefront pages can return Markdown to agents while displaying visual pages to people. The Markdown includes descriptions, prices, options, and product-level availability.
  • Shopping. The Universal Commerce Protocol provides catalog search, live availability for specific variants, cart operations, and checkout links. Vercel Shop makes these tools accessible at the merchant’s domain through the Model Context Protocol.

Imagine an agent looking for a black jacket in a particular size. That agent doesn’t need to parse HTML or take a screenshot to find the information. Rather, the product information appears in a way the AI can easily understand.

Store Assistant

Vercel Shop’s second agent experience is built into the store itself. The optional AI-powered shopping assistant — think Walmart’s Sparky or Amazon’s Alexa for Shopping — helps shoppers find products, navigate product variants, ask about store policies, and manage their shopping cart via chat.

The assistant uses the same Shopify cart as the visual storefront. A shopper can add a jacket while browsing, then ask the assistant to change its size or find a matching hat. The cart reflects changes whether they come from the human or the AI agent.

Shopify confirms prices, availability, and permitted cart changes. The assistant cannot place orders or process payments, so shoppers complete the purchases through a familiar checkout flow.

The assistant is disabled by default. Developers must enable it and configure access to Vercel’s AI Gateway. They can customize the guidance it provides and how it presents products.

Vercel’s own merchandise store is a working example of the template and its shopping assistant.

Armando Roggio
Armando Roggio
Bio