Интернет-магазин косметического средства: демо по ТЗ за ночь

Разбираю демо интернет-магазина для одного косметического средства: что в нём работает по-настоящему, что имитировано и почему так.

Задача

Заказчик выпускает косметическое средство в двух форматах и продаёт их по одному и набором. Товар подлежит маркировке. В ТЗ было много обязательных вещей: оплата через ЮKassa с двумя чеками для маркированного товара, передача кодов маркировки, доставка СДЭК и Почтой, кабинет покупателя, отдельный сервис заявок и рассылок, где письмо уходит только тем, кто дал согласие.

Отдельное ограничение задаёт сама категория. Это косметика, поэтому на сайте нельзя обещать лечение. Тексты карточек и ответов на вопросы я держал в рамках ухода, без медицинских формулировок.

Задача демо: показать заказчику весь путь покупателя и работу менеджера до того, как подписывать договоры с платёжным шлюзом и службой доставки.

Что я сделал

Сервер на FastAPI с базой SQLite, страницы без сборки, общий файл дизайн-токенов. Собрано за одну ночь. Разделы для покупателя:

• Главная и каталог с тремя позициями: два формата и набор.
• Карточка товара: состав, способ применения, вопросы и ответы, отзывы.
• Корзина с промокодом и подсказкой, сколько штук добавить до следующего бонуса.
• Оформление: способ доставки, адрес, согласия, расчёт итоговой суммы на сервере.
• Оплата: страница с тестовыми кнопками «оплатить» и «отказ банка», повтор оплаты.
• Кабинет: вход по телефону и коду, заказы, адреса, согласия, запрос на удаление данных.

Плюс служебные страницы: доставка, возврат, оферта, политика, отписка от рассылки по ссылке из письма.

Как устроено

Корзина и расчёт

Цена заказа считается только на сервере. Клиент присылает состав, промокод и способ доставки, сервер возвращает итог. Так промокод нельзя подделать в браузере. В демо три промокода: два рабочих и один выключенный, чтобы показать сообщение об ошибке. Бонусы за объём работают по порогам: от определённого количества штук покупатель получает дополнительные единицы в подарок. Корзина подсказывает, сколько осталось до следующего порога.

Чеки для маркированного товара

Для маркированного товара при предоплате нужны два чека. Первый при оплате: чек предоплаты на всю сумму. Второй при отгрузке: чек полного расчёта с кодами маркировки, которые сканируют при сборке. В демо оба чека формируются и записываются в журнал заказа с пометкой «имитация». В админке есть отдельный экран со списком чеков. Логика двух чеков готова, к реальной кассе и оператору фискальных данных она не подключена.

Админка

Заказы со статусами: новый, оплачен, в обработке, отправлен, выполнен, отменён. Переходы разрешены только по правилам, перескочить из «нового» в «выполнен» нельзя. Заказы выгружаются в CSV. Дальше редактирование товаров и контента, промокоды и правила бонусов, тарифы доставки, модерация отзывов, вопросы и ответы, отчёт по продажам. Кнопка «Сбросить демо» возвращает исходные данные перед показом.

Заявки и рассылки

Формы «вопрос специалисту», «заказать звонок», «консультация», подписка и покупка в один клик падают в общий список заявок. На первый ответ стоит норматив в 15 минут, просроченные видны сразу. Рассылки собираются по сегментам, письмо можно посмотреть перед отправкой. Получают его только контакты с согласием, у каждого письма своя ссылка отписки. Цепочки писем включаются и выключаются переключателем. Реальной отправки в демо нет: письмо формируется и пишется в журнал.

Персональные данные

В кабинете покупатель видит свои согласия и может их отозвать. Запрос на удаление данных создаёт уведомление менеджеру со сроком ответа. О том, что требует закон от магазина, писал отдельно: 152-ФЗ для интернет-магазина.

Что было сложно

Самое сложное в таком демо было удержаться от выдумки там, где нужны данные заказчика. В ТЗ была цена только одной позиции. Цены второго формата и набора, пороги бонусов, тарифы доставки и ставку налога я поставил сам, чтобы корзина считала. Все эти значения выписаны отдельным списком для сверки с заказчиком. До сверки это только предположения.

Второе: тексты. Для косметики соблазнительно написать «лечит» или «убирает», но этого нельзя. Я писал про уход и ощущения, а вопросы, где покупатель спрашивает про лечение, перевёл на консультацию специалиста.

Третье: отзывы и заказы. Без них админка пустая и демо не показать. Поэтому они сгенерированы, на рабочем сайте их не будет, и в разговоре с заказчиком я это проговорил.

Что получилось

Демо стоит на моём сервере и показано заказчику. Цену проекта на момент публикации мы не обсуждали.

Что ещё не сделано

• Подключение ЮKassa и онлайн-кассы с передачей чеков. Нужен договор магазина с платёжным сервисом. Как это выглядит, разбирал в статье приём оплаты на сайт.
• Работа с «Честным знаком»: регистрация, коды, вывод из оборота. Это делает заказчик со своей подписью, порядок описан в статье подключение к Честному знаку.
• СДЭК и Почта: тарифы в демо заданы руками, реального расчёта и трек-номеров нет.
• Настоящая отправка писем и SMS.
• Рабочая версия должна жить на сервере заказчика, демо закрыто от индексации.

Частые вопросы

Зачем два чека, если покупатель платит один раз?

При полной предоплате маркированного товара коды маркировки известны только при сборке. Поэтому сначала пробивается чек предоплаты, а при отгрузке чек полного расчёта с кодами.

Зачем свой магазин под три товара, если есть маркетплейсы?

Маркетплейс берёт комиссию и не даёт свою базу покупателей. Свой магазин нужен, когда важны повторные продажи, рассылки и прямой контакт.

Можно ли перенести демо в рабочий магазин?

Логика корзины, заказов, админки и чеков переносится. Меняются подключения: вместо тестовых кнопок платёжный шлюз, вместо ручных тарифов служба доставки, вместо журнала настоящая отправка.

Коротко о главном

Демо магазина за ночь возможно, если честно разделить, что работает, а что изображено. Корзина, промокоды, бонусы, кабинет и админка в нём настоящие. Оплата, маркировка, доставка и рассылки имитированы и ждут договоров заказчика. Похожий проект с реальным каталогом разобран в кейсе про каталог косметики и связь с кассой. Если нужен свой магазин, смотрите страницу про разработку сайтов или пишите в Telegram, MAX или VK.