Что вы получите
- Один HTML-файл со встроенными шрифтами и изображениями или версия для Next.js, React, Vue или Astro
- Главная, каталог с фильтрами, карточки товаров, коллекции, корзина и демо-оформление заказа
- Подбор размера, доставка, FAQ, контакты, «О нас», рассылка, юридические страницы и 404
- Валидатор ссылок, структуры, работы офлайн и оставшихся имён из примера
- По желанию: согласованные фото товаров и кампании от PopNow с ценой перед каждым запуском
Подходит для
- Бренды кроссовок, обуви и спортивной одежды
- Небольшие марки одежды, которым нужен вид рекламной кампании
- Прототипы магазина для передачи разработчику до подключения настоящей корзины
Не подходит для
- Приём реальных платежей уже сейчас: оформление заказа остаётся демо, пока не подключён платёжный провайдер
- Каталоги из сотен товаров, которым нужна база данных
- Кричащие, тёмные или неоновые айдентики
Как пользоваться
В Claude или ChatGPT
Используйте навык PopNow «Шаблон сайта магазина кроссовок» (sneaker-store-website) для этой задачи: Сделайте магазин для Northfold — небольшого бренда трейловой обуви, который продаёт пять моделей в EUR, с бесплатной доставкой от 120 EUR и возвратом в течение 30 дней.
В агенте для кода
/popnow-sneaker-store-website Сделайте магазин для Northfold — небольшого бренда трейловой обуви, который продаёт пять моделей в EUR, с бесплатной доставкой от 120 EUR и возвратом в течение 30 дней.
Потом попробуйте
Поместите мои фото товаров из ./photos на фон магазина, но сначала назовите цену.
Перенесите магазин в мой проект на Next.js и оставьте оформление заказа в демо-режиме.
Что подготовить
- Названия товаров, цены, расцветки и размеры
- Две-четыре коллекции и ваши условия доставки и возврата
- Фото товаров или API-ключ PopNow для их генерации
- Адрес и часы работы, если у вас есть офлайн-магазин
Похожие навыки
Смотреть все →3D-конструктор аватаров
+3Соберите милого плюшевого 3D-персонажа прямо в браузере и сохраните его как прозрачный PNG или 3D-страницу.
Календарная тепловая карта активности
+3Год ежедневной активности в виде календарной сетки с заливкой — с сериями, итогами и управлением с клавиатуры.
Лендинг SaaS с ИИ
+3Песочный фон, тонкие направляющие и штриховка вокруг живой канбан-доски, где ассистент планирует задачи.
Анимированный первый экран сайта
+3Первый экран лендинга с плавно сменяющимся словом в заголовке, двумя кнопками и широкой рамкой для изображения.
Сайт агентства с шейдерным героем
+3Живой оранжевый шейдерный герой под крупным заявлением, навигация-таблетка и сетка кейсов.
Тёмный лендинг для SaaS
+3Тёмный маркетинговый сайт с насыщенной анимацией для программного продукта — в одном автономном HTML-файле.
Сайт портфолио дизайнера
+3Шесть наклонённых карточек вокруг заголовка на сером фоне, красная карточка портрета и кейсы.
Сайт-портфолио разработчика
+3Тёмный личный сайт для инженеров с кейсами, статьями, докладами, резюме и формой обратной связи.
Редакционный сайт SaaS
+3Тёмно-синий разделённый герой, заголовок с засечками рядом с документальным кадром и кобальтовый акцент.
Шаблон сайта в стиле глассморфизма
+3Матовые стеклянные таблетки на почти чёрном фоне, крупный заголовок с засечками и подписка.
Сайт аппаратного продукта
+3Огромные тонкие названия моделей на студийных кадрах, матовые карточки характеристик и линейка в масштабе.
Интерактивная схема архитектуры
+3Офлайн-схема системы, по которой можно кликать: построена из проверенной JSON-модели, с обоснованием для каждого блока.
Интерактивный герой с сеткой
+3Тёмная сетка тонких нитей, которая гнётся к курсору, и светящееся кольцо от каждого клика.
Граф знаний из заметок
+3Превратите заметки проекта в офлайн-граф с поиском, где каждое утверждение ведёт к строке источника.
Шаблон KPI-дашборда
+3Четыре KPI-плитки с чипами изменений, линейный график, таблица разбивки и целевые полосы на тёплой бумаге.
Лендинг из ИИ-макетов
+3Сначала три полноэкранных макета на выбор, затем ваш агент собирает выбранный как чистый адаптивный код.
Шаблон сайта журнала
+3Сайт журнала с качеством печатного издания: статьи, рубрики, небольшой магазин и подписка — в одном HTML-файле.
Герой с анимацией частиц
+3Текст на тёплой бумаге рядом со сферой из чернильных и бирюзовых точек, меняющей форму под каждую идею.
Сайт личного бренда
+3Портрет, растворённый в тёплой бумаге под тонкой скобкой, с лёгким и жирным заявлением по бокам.
Кинематографичная страница запуска продукта
+3Почти чёрная страница в свете премьеры: заголовок с засечками, ночная сцена в letterbox и форма брони.
Шаблон админ-панели
+3Рабочая консоль бэк-офиса с графиками, таблицами, канбаном и календарём — в одном офлайн-HTML-файле.
Шаблон лендинга для SaaS
+3Спокойный светлый маркетинговый сайт для программного продукта с рабочей консолью продукта, ценами и регистрацией.
Сайт-портфолио в стиле скрапбукинга
+3Многостраничное онлайн-резюме из бумажных предметов, с кейсами и версией резюме для печати.
Лендинг автоматизации процессов
+3Графитовая страница, небольшой заголовок слева и живой граф узлов: запускается, повторяет попытку, пишет логи.
Вопросы
Принимает ли оформление заказа реальные платежи?
Нет. Оно проверяет форму, пересчитывает итог в зависимости от способа доставки и показывает подтверждение, но явно останавливается перед оплатой. Подключение платёжного провайдера — отдельный шаг в реальном проекте.
Можно ли использовать мои фото товаров?
Да. Добавьте их, и навык использует их как есть или — с вашего одобрения и после расчёта цены в кредитах — поместит их на единый фон магазина либо вырежет по контуру с помощью PopNow, чтобы сетка выглядела единообразно.
Подойдёт ли он для одежды, а не обуви?
Да. Размеры переключаются на буквенные, подбор размера превращается в таблицу мерок, а варианты полноты — в варианты посадки. Коллекции и линейки можно переименовать или удалить.
Что, если у меня нет API-ключа PopNow?
Магазин всё равно соберётся. У товаров будут подписанные плитки-заглушки или ваши фото, а в ответе будет список мест, где ещё нужны изображения.