Сайт доставки еды
Сайт доставки еды «Горячо» — уголь, томатный и сливочный, жирный гротеск: первый экран с живым отсчётом «привезём за 28:00» и бургером из CSS-слоёв, меню с корзиной в закреплённой полосе и прогрессом до бесплатной доставки, конструктор боула со слоями в миске, зона доставки на SVG-карте кварталов, трекер заказа с курьером по маршруту, промо приложения с QR и промокодом, отзывы-стикеры с реакциями и счётчиком заказов, вопросы и подвал с контурным словом. Unbounded, Russo One и Onest.
Сайт, где заказ собирается без лишних переходов: меню с корзиной в закреплённой полосе, прогресс до бесплатной доставки, конструктор боула по слоям. Первый экран обещает время доставки. Сервис в демо вымышленный.
Из чего собрано
10 блоков из каталога, в порядке появления на странице. Каждый ставится своей командой; ничего не пересоздаётся.
1. Шапка
Шапка доставки еды с адресом, временем и корзиной-счётчикомnavbar-038
Чип «адрес · N мин», корзина с бейджем, томатная линия при прокрутке, бургер.
2. Первый экран
Хиро доставки еды с фоновым роликом: бургер собирается в слоу-мо, живой таймерhero-048
Фоновый ролик: бургер собирается в слоу-мо и замирает, живой таймер доставки, бегущая строка блюд.
3. Меню
Меню доставки: карточки блюд с подсветкой за курсором, полётом в корзину и полосой «до бесплатной доставки»delivery-001
Фильтры, карточки с подсветкой за курсором, полёт фото в корзину, закреплённая корзина с прогрессом.
4. Конструктор
Конструктор боула: ингредиенты с фото падают в миску, калории и цена на летуdelivery-002
Плитки с фото ингредиентов, миска собирается на глазах, калории и цена на лету.
5. Зона доставки
Зона доставки на Яндекс Карте: кольца зон от кухни, метки адресов, клик → время и ценаdelivery-003
Яндекс Карта с кольцами зон от кухни и метками адресов, клик → минуты и стоимость.
6. Трекер
Трекер заказа: шаги с живым прогрессом и телефон с картой, по которой едет курьерdelivery-004
Шаги с живым прогрессом, телефон с картой — курьер едет по улицам, стартует сам.
7. Приложение
Промо приложения доставки: промокод, магазины, SMS-ссылка и QR-стикерdownload-011
Промокод с копированием, магазины, SMS-форма, QR-стикер.
8. Отзывы
Отзывы-стикеры с эмодзи-реакциями и живым счётчиком заказовdelivery-005
Стикеры со скотчем и эмодзи-реакциями, счётчик заказов сегодня.
9. Вопросы
Вопросы аккордеоном с плюсом-крестикомfaq-023
Аккордеон с плюсом-крестиком.
10. Подвал
Подвал доставки с часами работы, телефоном и словом-контуромfooter-037
Часы, телефон, колонки, огромное контурное «ГОРЯЧО».
Pro
Точный состав, код страницы и ссылка для агента — в PRO
Демо и список блоков открыты всем. Подписчику показываются пропсы каждого блока как в демо, общие правила темы, промпты картинок и одна ссылка, по которой ИИ-агент собирает такую же страницу.
Открыть PROЧастые вопросы
- Из чего собрана страница «Сайт доставки еды»?
- Из 10 секций каталога по порядку: Шапка доставки еды с адресом, временем и корзиной-счётчиком, Хиро доставки еды с фоновым роликом, Меню доставки, Конструктор боула, Зона доставки на Яндекс Карте, Трекер заказа, Промо приложения доставки, Отзывы-стикеры с эмодзи-реакциями и живым счётчиком заказов, Вопросы аккордеоном с плюсом-крестиком, Подвал доставки с часами работы, телефоном и словом-контуром. Каждая — отдельный item VibeUI.
- Как собрать такую страницу через ИИ-агента?
- Нажмите «Копировать сценарий для ИИ» и вставьте в Cursor или Claude Code: агент получит исходник страницы, общие правила темы и промпты картинок и поставит каждую секцию из реестра через shadcn CLI.
- Сценарий бесплатный?
- Живое демо и список секций открыты всем. Исходник страницы и инструкция для агента — в подписке PRO.