4fresh – интернет-магазин экотоваров

Интернет-магазин 4Fresh решил реализовать новую концепцию и обновить платформу.

Главная цель – создать уникальный нео-маркет с акцентом на товары собственного производства и улучшенный пользовательский опыт.

Команда должна была решить следующие задачи:

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

2. Добавить новые функции: гибкий каталог, публичные вишлисты, стримы, блог, рекомендации от экспертов и глоссарий.

3. Укрепить систему лояльности, включая внутреннюю валюту, реферальные программы и премиум-клуб.

4. Ускорить путь клиента к покупке за счёт улучшения навигации, фильтров и категорий. На реализацию проекта отводилось всего 5 месяцев, что создавало серьезные ограничения на планирование и ресурсы.

В кейсе описывается функционал в период до 2025 года, на данный момент платформа занимается ребрендингом.

Для достижения целей команда выбрала микросервисную архитектуру.

Работы велись на двух технологиях: PHP и NodeJS, это позволило разделить задачи между подгруппами и ускорить процесс разработки.

За счет такого решения удалось реализовать:

– переход на собственную платформу;

– кастомную CMS для гибкого управления контентом;

– полный перенос данных из старой системы с минимизацией потерь;

– интеграцию API для максимального удобства пользователей.

— Оценка текущего сайта: рассмотрение проекта на платформе 1С-Битрикс и определение компонентов для обновления.

— Изучение дизайна: разбор уже реализованных макетов, фиксация визуальных и функциональных элементов.

— Выбор архитектуры для обновленного продукта: разделение backend на микросервисы, подбор технологий для ускорения разработки.

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

— Планирование задач: создание дорожной карты проекта.

Работа велась в четырех ключевых направлениях:

1. Backend

2. Административная панель (CMS) 

3. Верстка и настройки сайта

4. Мобильное приложение

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

Разработка модуля пользователя. Основное внимание было уделено проектированию системы, которая интегрировалась с сервисом Mindbox, который предоставляет маркетинговые инструменты для управления данными. Основная информация о клиентах хранилась на сторонней платформе, это потребовало тесной работы с командой сервиса для настройки и оптимизации нашего взаимодействия.

Оплата. Подключили к сайту API сразу две разные платежные системы, чтобы каждый пользователь мог выбрать для себя наиболее удобный способ оплаты. Например, WebMoney или ЮMoney.

Ключевые функции. Команда сосредоточилась на интеграции основных аспектов интернет-магазина, таких как добавление товаров в корзину и оформление заказов. Также была важна интеграция с системой 1С, которая использовалась для учета и синхронизации данных о наличии ассортимента в магазине 4Fresh. Реализовали систему доставки, интегрированную с несколькими курьерскими службами в России, Беларуси и Казахстане, что позволило выбирать удобный способ доставки.

Разработка основных страниц и блоков. Главную страницу реализовали позже, так как она включала контент из других разделов, таких как каталог, акции и подборки товаров. Основное внимание было уделено тому, чтобы все функции корректно взаимодействовали друг с другом, обеспечивая стабильную работу магазина.

Решение позволило совершать покупки, просматривать товары и участвовать в активностях на платформе с любых устройств.

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

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

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

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

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

1. Для обучения команды со стороны заказчика создали инструкции и видеоролики, провели семинары.  

2. Выстроили службу поддержки для решения вопросов пользователей и раздел FAQ для быстрого получения информации. Весь этап был направлен на плавный переход на новую платформу и создание удобных условий для пользователей и команды.

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

4. Во время работы новой платформы проводился мониторинг производительности и стабильности.

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

Обновление интернет-магазина 4Fresh соответствует новым требованиям бизнеса и запросам пользователей.

Основные достижения — улучшение UX/UI, упрощенная навигация, обновленные категории и фильтры. Конверсия выросла за счет простого пути к покупке и расширенного функционала лояльности, включая фрэшкоины и реферальную программу.

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