Vercel Blog→ оригинал

Vercel Shop вышел в GA: витрины на Shopify научили продавать ИИ-агентам

Vercel объявила общедоступным Vercel Shop, открытый шаблон витрины на Next.js для Shopify. Вместе с ним в GA вышла переписанная Hydrogen SDK, которая теперь работает с разными JavaScript-фреймворками. Шаблон отдаёт агентам цену, наличие и опции товара в машиночитаемом виде и поддерживает Universal Commerce Protocol, а встроенный ассистент делит корзину с обычной витриной. Как пример Vercel приводит PAIGE: после перестройки платформы выручка за Black Friday и Cyber Monday выросла на 22%, конверсия на 76%. • Один URL отдаёт страницу людям и данные агентам • Агент ищет товары и собирает корзину через MCP • Установка одной командой через pnpm

AI-обработка оригинала Vercel Blog; редакция Hamidun News
Vercel Shop вышел в GA: витрины на Shopify научили продавать ИИ-агентам
Источник: Vercel Blog. Коллаж: Hamidun News.
◐ Слушать статью
⊞Паспорт материала и цифры
ПараметрДанные
ПервоисточникVercel Blog ↗
Главный редактор
Ключевой факт #1Один URL отдаёт страницу людям и данные агентам
Ключевой факт #2Агент ищет товары и собирает корзину через MCP
Ключевой факт #3Установка одной командой через pnpm

Vercel объявила общедоступным Vercel Shop, открытый шаблон витрины на Next.js для магазинов на Shopify. Одновременно в GA вышла переписанная Hydrogen SDK, которая теперь работает не только с одним фреймворком, но и с разными JavaScript-стеками. Исходная посылка проста: агенты уже покупают в вебе, но пользуются страницами и инструментами, сделанными для людей и поисковых систем. Vercel и Shopify предлагают считать агента полноценным покупателем и дать ему собственный слой данных и действий. В качестве аргумента компании приводят PAIGE. После перестройки e-commerce платформы бренд получил +22% выручки и +76% конверсии за Black Friday и Cyber Monday без простоев.

Один URL для человека и для агента

Главная механика Vercel Shop в том, что карточка товара существует в двух видах по одному адресу. Человек видит визуальную страницу. Агент получает цену, наличие и варианты товара как машиночитаемый контент, и ему не нужно разбирать вёрстку, чтобы вытащить эти поля. Для поисковых и answer-движков в шаблон встроены структурированные данные на страницах и в sitemap, чтобы они находили и понимали товары.

Основой служит Hydrogen SDK. Она даёт доступ к каталогу, корзине, управлению заказами, платежам и чекауту. Ранее в этом году Vercel и Shopify анонсировали планы переписать Hydrogen под разные JavaScript-фреймворки. Теперь это сделано, и SDK вышла в общий доступ.

UCP и MCP: как агент собирает корзину

Второй слой касается действий. Shopify участвовала в разработке Universal Commerce Protocol (UCP). Он задаёт стандартный способ, которым агент ищет по каталогу, читает карточку, проверяет наличие, собирает корзину и получает ссылку на чекаут. Vercel Shop делает эти возможности доступными на домене самого мерчанта. Агент подключается по MCP, ищет товары и формирует корзину, не навигируя по сайту.

На Vercel Ship SF об этом говорили Тоби Лютке и Гильермо Рауч. Лютке подчеркнул, что чекаут устроен сложно и требует «20 лет доводки». Поэтому Shopify открыта к тому, чтобы разработчики брали части её чекаута и собирали из них что угодно. Рауч описал шаблон как быстрый, хорошо спроектированный и готовый к работе с агентами.

Что входит в шаблон

  • Витрина на Next.js поверх каталога, корзины и чекаута Shopify.
  • Машиночитаемые карточки: цена, наличие, опции.
  • Структурированные данные и sitemap для поисковых и answer-движков.
  • Инструменты для агентов по UCP, доступные через MCP на домене мерчанта.
  • Встроенный ассистент на базе eve, который находит товары и кладёт их в корзину.
  • Единая корзина для обычной витрины и ассистента.
  • Skills для кодинг-агентов: помогают с настройкой, кастомизацией и обновлением шаблона.

Витрина и ассистент живут в одном репозитории. Команда может менять дизайн и поведение ассистента вместе, не поддерживая два отдельных проекта. Покупатель может начать с поиска через ассистента, перейти на страницу товара и не потерять корзину.

Как это попробовать

Первый живой пример — мерч-магазин vercel.store с лимитированными дропами. Он построен на Vercel Shop, а его шоппинг-агент подбирает товары, добавляет их в корзину и ведёт к оформлению. Связка Shopify, Next.js и Vercel уже работает у AG1, Bombas и PAIGE.

Для старта достаточно одной команды:

`pnpm create next-app@latest my-store --example https://github.com/vercel/shop`

Дальше нужно подключить магазин Shopify и настроить витрину по документации. Командам с готовым Shopify-каталогом имеет смысл проверить, как их карточки выглядят для агента: есть ли в них цена, наличие и опции в читаемом виде. Те, кто начинает с нуля или перестраивает фронтенд, получают агентский слой сразу в шаблоне. Цифры PAIGE относятся к общей перестройке платформы, а не к одному только агентскому каналу, поэтому влияние самих агентов лучше измерять отдельно на своих данных.

⧉ Сюжет

❓ Вопросы и ответы по материалу

Что известно по теме: один URL для человека и для агента?

Главная механика Vercel Shop в том, что карточка товара существует в двух видах по одному адресу. Человек видит визуальную страницу. Агент получает цену, наличие и варианты товара как машиночитаемый контент, и ему не нужно разбирать вёрстку, чтобы вытащить эти поля. Для поисковых и answer-движков в шаблон встроены структурированные данные на страницах и в sitemap, чтобы они находили и понимали товары. Основой служит Hydrogen SDK. Она даёт доступ к каталогу, корзине, управлению заказами, платежам и чекауту. Ранее в этом году Vercel и Shopify анонсировали планы переписать Hyd

Что известно по теме: UCP и MCP: как агент собирает корзину?

Второй слой касается действий. Shopify участвовала в разработке Universal Commerce Protocol (UCP). Он задаёт стандартный способ, которым агент ищет по каталогу, читает карточку, проверяет наличие, собирает корзину и получает ссылку на чекаут. Vercel Shop делает эти возможности доступными на домене самого мерчанта. Агент подключается по MCP, ищет товары и формирует корзину, не навигируя по сайту. На Vercel Ship SF об этом говорили Тоби Лютке и Гильермо Рауч. Лютке подчеркнул, что чекаут устроен сложно и требует «20 лет доводки». Поэтому Shopify открыта к тому, чтобы разработ

Что известно по теме: что входит в шаблон?

Витрина на Next.js поверх каталога, корзины и чекаута Shopify. Машиночитаемые карточки: цена, наличие, опции. Структурированные данные и sitemap для поисковых и answer-движков. Инструменты для агентов по UCP, доступные через MCP на домене мерчанта. Встроенный ассистент на базе eve, который находит товары и кладёт их в корзину. Единая корзина для обычной витрины и ассистента. Skills для кодинг-агентов: помогают с настройкой, кастомизацией и обновлением шаблона. Витрина и ассистент живут в одном репозитории. Команда может менять дизайн и поведение ассистента вместе, не поддер

ЖХ
Жемал Хамидун — CPO Alpina Digital, продакт-менеджер AlpinaGPT. Делает AI-продукты с 2019 года. Hamidun News — pet project, который вырос в production-агрегатор с 6000+ читателей.
✦ Автономные AI-агенты

Делегируйте ресёрч, код и рутину автономному AI-агенту

Интеллектуальная агентная среда NomadNet Agent (agent.nomadnet.ai) выполняет многошаговые задачи: глубокий веб-ресёрч, анализ данных, написание кода и автоматизацию браузера.

Запустить NomadNet Agent →Платформа NomadNet AI
Что вы думаете?
Загружаем комментарии…