Три пути к одной витрине
Экран витрины на всех трёх путях одинаковый. Разница дальше: кто правит цены и где лежат данные.
| Критерий | Нанять разработчика | Купить подписку | Собрать самому |
|---|---|---|---|
| Деньги | Десятки тысяч рублей за релиз и смета на доработки. | Ежемесячный платёж за доступ к чужому сервису. | 0 ₽ на старте: 5 млн токенов в подарок. |
| Срок | Недели на бриф, макеты и согласования. | День на шаблон и ожидание чужих обновлений. | Один вечер: 7 шагов и ответы боту. |
| Правки | Через задачу, оценку и итерацию. | Через поддержку и очередь. | Словами в чат: «добавь фильтр по свету». |
| Кому принадлежит результат | Разработчику: доступы, код, хостинг. | Сервису: витрина уходит с подпиской. | Вам: один HTML-файл на диске. |
итогНикакого платежа за сам факт существования: платите за создание и распоряжаетесь файлом сами.
Почему магазин лучше сделать своими руками
Не ради процесса, а ради результата: витрина без чужого тарифа и графика.
-
01
Экономия на старте
Первый экран не требует подрядчика и абонентской платы. Токены на сборку бесплатны.
-
02
Приложение принадлежит вам
Вы получаете файл, а не аккаунт: его можно открыть на любом хостинге.
-
03
Правки словами
Нужен фильтр по уходу? Пишете предложение в чат — получаете новый файл.
-
04
Не нужно ждать разработчика
Привоз или акция к выходным — витрина меняется в тот же вечер.
-
05
Нет лимитов тарифа на функции
Фильтры, корзина и статусы не разложены по платным уровням.
Семь экранов, которые закрывают продажу
Не набор кнопок, а путь покупателя: от «что есть» до «заказ получен».
Каталог с фильтрами
Поиск по названию, категории, цене и наличию. Сортировка по цене и новинкам.
Страница растения
Цена, остаток, свет, полив, горшок, грунт. Кнопка «В корзину».
Корзина с количеством
Плюс и минус у позиции, сумма и удаление.
Заказ без лишних полей
Имя, телефон, получение, комментарий. Итог сразу.
Пять состояний заказа
Новый, подтверждён, собран, отправлен, получен.
Список заказов
Дата, покупатель, сумма, состав, статус. Фильтр по статусу.
Добавление товаров
Название, категория, цена, остаток и уход.
Жизнь заказа
- новый
- подтверждён
- собран
- отправлен
- получен
Покупатель смотрит статус сам и не спрашивает «а моё уже выехало?».
Раньше — двадцать сообщений в директе. Теперь карточка сама говорит: рассеянный свет, полив раз в неделю.
Остаток на карточке: «3 шт» или «под заказ». Не продаёте то, чего нет.
Заказ в списке, вы меняете статус. Покупателю не нужно писать.
Семь шагов от пустого экрана до витрины
Скриншоты сняты на реальном экране. Промпт ниже, скачивать ничего не нужно.
-
1
Приложение уже установлено
Ссылку присылает бот после слова «старт». Откройте её — ярлык появится на рабочем столе.
Ярлык приложения на рабочем столе -
2
Нажмите «Открыть веб-интерфейс»
На экране «С чего начнём?» нужна кнопка, ведущая в браузер: там удобнее с длинным промптом.
Кнопка «Открыть веб-интерфейс» -
3
Нажмите «Создать проект»
Каждый проект — отдельная папка: магазин не перепутается с другими задачами.
Создание отдельного проекта -
4
Впишите название и нажмите «Создать проект»
Подойдёт «Магазин растений». После подтверждения откроется пустой чат.
Название проекта и подтверждение -
5
Скопируйте промпт с этой страницы
Нажмите «Скопировать промпт» ниже и вставьте текст в поле сообщения: Ctrl + V.
Промпт в поле сообщения -
6
Нажмите «Отправить» ↑
Кнопка со стрелкой или Enter. Длинный текст — это нормально.
Отправка промпта кнопкой ↑ -
7
Ответьте на 8–15 вопросов бота
Бот спросит про ассортимент, категории и доставку. Отвечайте по одному предложению.
Готовый HTML-файл
Готовый текст для бота
Скопируйте целиком и вставьте в поле сообщения на шаге 5.
Ты — senior product designer и frontend-разработчик.
Сначала задай мне 8–15 простых вопросов о моей работе, по одному за раз, и дождись ответов.
Потом собери приложение «Магазин: магазин растений» одним HTML-файлом.
Моя задача: витрина магазина растений.
Что должно быть внутри:
- Сущности: товар, категория, корзина, заказ, покупатель.
- Витрина: карточки, поиск, фильтры по категории, цене, наличию и уходу, сортировка.
- Карточка товара: фото-заглушка на CSS, цена, остаток, свет, полив, горшок, кнопка «В корзину».
- Корзина: количество, сумма, удаление, пустое состояние.
- Оформление заказа: имя, телефон, получение, комментарий, итог.
- Статусы: новый → подтверждён → собран → отправлен → получен.
- Список заказов: таблица с датой, покупателем, суммой и фильтром по статусу.
- Добавление товаров: название, категория, цена, остаток, уход.
- Данные в localStorage, без сервера, внешних библиотек и картинок.
- Один HTML-файл: inline CSS и JS, продуктовый интерфейс, адаптивность.
- Никаких пустых заглушек: придумай названия растений, цены и уход для демо-каталога.Если копирование не сработало, выделите текст вручную: от «Ты — senior product designer» до последней строки.
Что обычно спрашивают перед сборкой
Нужен ли хостинг и домен, чтобы витрина заработала?
Для первых показов — нет: файл открывается локально, заказы живут в браузере. Домен понадобится, когда захотите отправлять ссылку покупателям.
Можно ли принимать оплату прямо в приложении?
Заказ собирается целиком, а деньги вы принимаете переводом, счётом или при получении. Форму оплаты можно добавить правкой.
Сколько растений выдержит витрина и не начнёт тормозить?
Сотня-две позиций с фильтрами работают так же быстро, как десять. Для тысяч понадобится подгрузка по частям.
Как менять цены, фото и остаток, когда придут новые поставки?
Через экран добавления товара: правите цену, количество и уход, сохраняете. Изменения сразу на витрине, старые позиции можно скрыть.
Будут ли новые заказы приходить в Telegram?
В базовой версии заказы копятся в списке внутри приложения. Уведомления в Telegram добавляются правкой.
Получится ли вести магазин с телефона между поливами?
Да: карточки в одну колонку, фильтры чипами, поля не выходят за границы.
Витрина начинается с одного сообщения боту
Откройте бота, отправьте «старт», пройдите семь шагов и вставьте промпт. Через несколько ответов у вас будет файл магазина растений.
5 000 000 токенов бесплатно · без подписки · файл остаётся у вас