Интернет-магазин косметики на Magento eCommerce. О сложностях разработки

Привет! Мы полезная команда разработки WPP.DIGITAL. Уже 15 лет мы помогаем компаниям поддерживать и развивать сайты, приложения и другие веб-продукты. Начинали мы как студия с единственной услугой — поддержка сайтов на битрикс. Время шло, и мы расширяли свой стек. Так, в 2016 году у нас уже появилась мобильная разработка, сильный менеджмент проектов и толковый бухгалтер. Но мы не закостенели в плену того, что понятно и просто. 

Эта история о вызове, который мы бросили сами себе, взявшись за продукт на не самой популярной CMS в России — Magento-2. 

Что не так с Magento

Magento-2 — CMS-система для создания и управления интернет-магазинами от Adobe. Ближайший российский аналог — система 1C Bitrix: управление сайтом. И там, и там есть развитый набор инструментов для формирования каталога, корзины, работы с различными видами онлайн-оплаты и доставки. Функционально они крайне похожи, но есть различия. 

«Magento — во многом аналог битрикс, но есть отличия. Их одновременно можно считать и плюсом и минусом.  В magento cms изначально расширяемый в любые стороны, очень гибкий флоу заказа. Очень здорово, но требуется время разобраться в «гибкости» пути заказа, когда берешь уже начатый проект. Усложняется работа еще тем, что фреймворк редко используют в России и документации на русском мало». 

Андрей Назариков, php-разработчик wpp.digital

Magento-2 — редкий фреймворк для России, поэтому найти российскую команду с хорошим опытом сложно. Согласно «Рейтингу Рунета» в СНГ всего 5 it-агентств, которые разработали на magento больше 3-х интернет магазинов.  Для сравнения — в том же рейтинге минимум 200 агентств занимаются разработкой сайта на битрикс, а это в 40 раз больше, чем на magento. О непопулярности cms от Adobe свидетельствует и количество сайтов в рунете. 11250 интернет-магазинов используют битрикс для управления сайтом, magento commerce — только 176.

У нас был скромный опыт работы на Magento-2 по меркам digital-рынка — всего 2 проекта. Это мало для того, чтобы сказать, что Magento — наш профиль. Для сравнения — на Битриксе у нас около 50 реализованных проектов и 10 специалистов на постоянной основе. 

Весной 2024 года к нам обратился русский интернет-магазин на Magento-2 за услугой технической поддержки и развития сайта. Мы были больше склонны отказаться от проекта, чем согласиться. У нас не было опыта работы на magento на аутсорсе, было много темных пятен в знаниях. На первом звонке мы честно сказали клиенту о нашем опыте, не украшали факты. Клиент взял время на раздумья. На следующий день вернулся с ответом — готов был нам довериться. Так mirra.ru стал первым цифровым продуктом на magento commerce, для которого мы предоставили выделенную команду.

«Я работал 3 года над разработкой именно e-commerce. Чуть меньше с екомм-продуктами на Magento. Предметная область была мне знакома довольно хорошо и глубоко. 60-70% знаний у меня было. Остальное добивалось по ходу боя».

Андрей Назариков, php-разработчик wpp.digital

Теперь подробнее о клиенте.

Давайте знакомиться, Mirra

Mirra — косметический бренд ЗАО «МИРРА-М». У компании собственное производство, лаборатория, 200+ оффлайн-магазинов в России, Чехии, Словакии, Японии, Белоруссии, Казахстане, Армении, Кыргызстане и Узбекистане. Сегодня с компанией сотрудничают 100 000+ дистрибьюторов, работающих по системе МLМ (сетевой маркетинг).

Сайт  — один из каналов продаж, благодаря которому ежедневно совершают оптовые покупки более 100 пользователей. В онлайн-магазине 300+ позиций косметики, бадов и парфюмерии. Сайт ориентирован и на b2b- и на b2c-сектора.

Последние 5 лет интернет-магазин поддерживал и развивал небольшой внутренний IT-отдел в тесной связке с российским it-подрядчиком. Сотрудничество было тяжелым. Внутреннюю команду не устраивала скорость работы IT-подрядчика. Но найти новую команду было сложно. СMS Magento-2 мало используемая в России, поэтому решили искать аутсорс-команду по рекомендациям коллег.

«Через рекомендации  быстрее и проще искать подрядчика, меньше вероятности, что команда сделает плохо. Конечно, это все равно своеобразный кот в мешке, но он уже не такой черный. Нас посоветовали коллеги из другого IT-агентства. Так заказчик нашел нас 6 месяцев назад».  

Василий Гребенников, директор wpp.digital

Полгода назад онлайн-магазин Mirra попал к нам. Предыдущий IT-подрядчик выполнил некоторые работы по функционалу: в магазине можно было зарегистрироваться, сложить товар в корзину и сделать заказ. Страдали UX и работоспособность части функционала. Товар можно было купить, но при оформлении заказа часто всплывали ошибки разного характера. С этими проблемами и предстояло разобраться в первую очередь.

«За 6 месяцев it-команда WPP.DIGITAL выполнила около 300 задач. Из них большинство реально большие и критичные. Многие вещи на сайте работали неправильно, что отталкивало клиентов: не позволяло им завершить заказ, не позволяло им хорошо ориентироваться на сайте. От постоянных клиентов в наш телеграм-канал поступало много жалоб».

Александр Трифонов, руководитель IT-отдела ЗАО «МИРРА-М»

Сайт — самый удобный инструмент покупки. В личном кабинете сразу отображаются релевантные скидки, промокоды, сеть клиентов и прочая нужная информация для конкретного пользователя и конкретного заказа. Сделать заказ можно и по телефону, через менеджера компании. Но такой вариант дольше и не в ногу со временем, особенно для уже взрослого поколения-Z, которым естественнее онлайн-шоппинг. Поэтому сайт для компании постепенно становится единственным способом удаленного заказа, особенно для дистрибьюторов.

Реанимация реферальной программы 

На момент 2024 основной клиент интернет-магазина — дистрибьютор, работающий по MLM-системе. Доход от дистрибьюторской сети составляет 30-40% от общего числа форматов продаж. В этом большая мотивация делать покупки через сайт максимально удобными и легкими, чтобы их было больше. Сам личный кабинет должен стать персональной картой бизнеса для каждого дистрибьютора: чтобы он мог в любое время зайти в свой личный кабинет и понять, как его бизнес выглядит сейчас и как его можно улучшить. 

Дистрибьютор заинтересован в расширении своего дерева. Чем больше у него ветвей, участников, тем больше они заказывают и тем ниже закупочная цена косметики для обоих. Новые участники присоединяются к команде по промо-коду. Как владелец промо-кода дистрибьютор получает 20% скидку за первый заказ новичка, а новичок — 10%. 

Первая функциональная проблема, с которой нам предстояло справиться — учет скидки для дистрибьютора и нового участника его программы. Новый участник привязывался только в базе магазина. В личном кабинете дистрибьютор и член его команды друг друга видели, но скидка не применялась.

«Отсутствовал метод для интеграции, чтобы уведомление о подключении приходило и человеку, и в систему. С front-end сайта оно уходило на back-end и там тихо погибало, не записывая информацию никуда».

Андрей Назариков, php-разработчик wpp.digital

Баллы — сколько и кому достались

Баллы (PV) — это данные, по которым дистрибьюторам платят вознаграждение. Дистрибьютор и его «подчиненные» копят баллы, покупая косметику и выполняя другие условия маркетинг-плана. В конце каждого месяца выплачивается вознаграждение. Оно зависит от количества баллов у дистрибьютора и у всех участников его дерева продаж. Чтобы выполнить маркетинг-план и получить большее вознаграждение, участники одного дерева продаж могут обмениваться баллами в личном кабинете на сайте. 

Следующая функциональная проблема, которую предстояло решить — баллы. Информация о баллах в личном кабиенете была ненаглядной: текущий баланс, история пополнения и списания. Все операции с баллами были реализованы в бэкенде, но до клиента эта информация не доходила.

«По итогам  отчетного периода мы начисляем вознаграждение клиентам по маркетинг-плану на основе совершенных покупок. До решения проблемы с баллами, перед закрытием периода, у нас был аврал, так как ошибку приходилось поправлять вручную. Многие клиенты жаловались на функционал: не туда перенесли баллы, а отменить действие они не могли; не видели, пришли им переданные баллы или нет.

Александр Трифонов, руководитель IT-отдела ЗАО «МИРРА-М»

Поменять доставку = пересобрать заказ

С доставкой также было не все гладко. Она осуществлялась несколькими способами: курьером; Почтой России; до пункта выдачи СДЭК, 5Post; до оффлайн-магазинов сети. Если покупатель хотел поменять способ доставки, ему приходилось пересоздавать заказ. Система делала смену способа доставки только на фронтенде, на бэкенде же ничего не происходило. Если в заказе — 3 позиции, то проблема не выглядит страшной, а когда в корзине косметики на 200 000 руб., то проблема становится глобальной. Дистрибьютор просто бросал пересобирать такие заказы на пол пути. 

Пока Сбер, привет ЮKassa

Параллельно с задачами по «исправлению» функционала мы выполняли глобальный квест по изменению платежной системы. С мая 2024 года 
ПАО «Сбербанк» перестал обслуживать свой платежный шлюз «Сберпэй». Как и другие клиенты Сбера, mirra.ru должен был перейти на «ЮKassa». Чтобы оплата в онлайн-магазине работала и дальше, за 3 недели мы должны были перевезти сайт на новую платежную систему. 

«Платежную систему подключить несложно, но конкретно на нашем сайте это усложнялось тем, что работа Magento-2 во многом построена на различных плагинах, и некоторые из них были самописными. Приходилось разбираться в коде и модифицировать плагины для того, чтобы они работали с «ЮKassа» корректно».

Василий Гребенников, директор wpp.digital

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

Андрей Назариков, php-разработчик wpp.digital

Осложняли «переезд» интеграции. В продукте mirra.ru их больше 5. Каждая интеграция — это зависимость работы системы от некой внешней. Любые изменения во внешних системах должны поддерживаться со стороны Magento-2 и наоборот. Конкретно в нашем интернет-магазине заказы обрабатываются сразу учетной системой, платежным шлюзом, кассовым сервисом и системой учета маркетинговой информации. Любые попытки что-то поменять на сайте должны учитывать все эти связи и не ломать их.

«Путь информации выглядит так: данные о том, на какой стадии находится заказ — оплачен, собран, передан в доставку и т.д. — передаются в Magento, затем идут в «ЮKassa». После оплаты данные заказа и оплаты идут в 1С».

Виктория Добаринова, QA-инженер в wpp.digital

Поженить «Плати частями» и «ЮKassa»

После подключения «ЮKassa» на стандартные платежи мы приступили к интеграции системы «Плати частями». Сделали за 2 месяца. Решение позволяет разделить оплату заказа на 4 равные части. Маркетинговый отдел предполагал, что рассрочка мотивирует дистрибьюторов заказывать больше, то есть увеличит средний чек. Так и вышло.

Пока мы настраивали корректную работу между «Плати Частями» и «ЮKassa», нас уже поджидала задача по изменению процесса заказа. Некоторые плагины, связанные с чекаутом и перенаправлением на платежный шлюз, были рассчитаны только на один платежный метод. К ним нельзя было подключить сразу 2 платежные системы. Чтобы при оплате можно было использовать одновременно «ЮKassа» и «Плати частям», доработали плагины и планомерно тестировали. Двигались небольшими шажками через циклы: разработка — тест — локальная отладка — ретест. После весь цикл повторяли снова.

В «Плати частями» фискализация работала только на тестах. В боевом режиме эта функция не была реализована. Чеки не отправлялись в сервисы касс, вроде АТОЛа и т.д. Они уходили на заглушки для касс, подключенные разработчиками «Плати частями», поддержка которых была остановлена пару лет назад. Мы самостоятельно технически дорабатывали модуль отправки чеков, чтобы он заработал по актуальному стандарту.

«Настроили интеграцию и допилили модуль отправки чеков. Когда сайт видит, что платеж прошел успешно, он формирует чек и отправляет его в кассу».

Андрей Назариков, php-разработчик wpp.digital

Раньше, когда все платежи проходили через шлюз «Сберпэй», система сообщала о них заказчику. Ему приходило письмо на почту. Он выгружал заказы в 1С и там видел всю информацию по ним. Ни в «ЮKassa», ни в «Плати частями» такой функции нет. Отсутствие письма могло напугать дистрибьюторов и стать поводом грозных писем в поддержку. Поэтому, предугадывая реакцию покупателя, мы настроили автоматическую отправку писем на почту покупателям с оповещением о совершенной сделке.

Впереди улучшение UX

Сейчас мы стремимся сделать сайт не только функционально «чистым», но и максимально удобным каналом продаж. На финальной стадии усовершенствование онлайн-каталога магазина. 

«Думаю, что впереди у продукта громадный потенциал и поле для улучшений. Именно таких улучшений, которые помогают пользователям наслаждаться покупкой. То чувство, когда покупаешь настолько легко, что хочется купить снова».

Василий Гребенников, директор wpp.digital