Разработка оптового интернет-магазина для Groster
О клиенте
Groster – это интернет-магазин, работающий на рынке более 20 лет. Компания предлагает оптовым покупателям товары для сферы общественного питания (рестораны, кафе, фастфуд и пр.), упаковку для разных сфер бизнеса, спорттовары, праздничные аксессуары, предметы для дачи, бытовую химию, продукты питания и многое другое.
Задача
Разработать интернет-магазин, чтобы пользователи быстро и удобно совершали оптовые заказы. Сайт ориентирован на b2b, но с точки зрения UX/UI он должен соответствовать лучшим торговым площадкам в b2c.
Целевая аудитория
Владельцы и сотрудники ресторанов, фастфуда, представители гостиничного бизнеса, собственники магазинов и т.д.
Решение
Предыдущая версия сайта клиента перестала соответствовать его требованиям и устарела функциональн. Мы реализовали современный интернет-магазин для оптовиков, внешне и по функционалу похожий на маркетплейсы. Работа шла двухнедельными спринтами. Быстро адаптировались к требованиям заказчика и реализовывали фичи с учетом приоритетов.
Что мы сделали в процессе работы
1. Проработали сложный функционал каталога товаров
- Реализована выдача товаров с учетом разных параметров. Категории товаров наглядно представлены на сайте.
- Использован сервис поиска товаров, работающий по частичному вводу (например, кода, артикула или названия). Это обеспечено за счет интеграции с сервисом поиска Diginetica.
- Даже не выбирая фильтры, пользователь видит релевантные категории. Алгоритмы предлагают связанные по смыслу товары. Еще до открытия товарной карточки видна цена за единицу и количество товара. Можно получить информацию о наличии товара, учитывая местоположение пользователя.
- Разработаны индивидуальные фильтры сортировки с максимальной точностью и глубиной. Они быстро подгружаются.
- Проведена работа с десятками свойств товаров, обеспечена широкая вариативность выбора.
- Можно поделиться товаром, отправить ссылку, добавить в избранное.
- Реализован сложный функционал сравнения товаров на сайте.
- Перед покупкой большой партии товара можно заказать его видеопрезентацию в zoom или skype либо в мессенджерах. Это позволит клиентам убедиться, что товар подходит.
- Многоуровневая структура каталога предполагает бесконечную вложенность категорий.
2. Сделали удобный личный кабинет
Пользователь может войти в личный кабинет через почту или номер телефона. Сайт позволяет завести корпоративный профиль и привязать аккаунты сотрудников с учетом роли в компании. Можно указать юридическое лицо плательщиков.
В личном кабинете пользователь получает оповещения на товары, на которые подписан. Можно изучить прошлую историю заказов, посмотрев заказы по номеру, коду.
Система сохраняет адреса предыдущих доставок и предоставляет пользователю выбор, куда заказать. Она напоминает про регулярные заказы и позволяет в один клик повторить заказ целиком. А чтобы клиентам было удобнее вбивать номера и адреса, сделали интеграцию с DaData. Сервис проверит, правильно ли все написано.
3. Обеспечили информативную карточку товара
Карточка товара отображает максимум информации даже до клика по ней. Покупателю видно, сколько интересующих его товаров в наличии, и сколько они стоят. Сделано детальное текстовое описание товара и проработана мета-разметка для улучшения SEO.
4. Позаботились об удобном и быстром оформлении заказов
Пользователи могут использовать фильтры по адресу доставки и самовывоза. Можно выбрать объем товара, рассчитанный на основе стандартных объемов покупок. Приведены типовые значения.
Покупатели заказывают товары как штучно, так и комплектами (товар плюс тара). Расчет оптовой продукции заранее проводится сотнями и тысячами, что облегчает выбор для пользователей.
Можно начать делать заказ с телефона в удобной мобильной версии сайта, сохранить его и продолжить с компьютера. В корзине у каждого товара виден срок доставки. Товары визуально разбиты по категориям.
Доступны рекомендации по товарам. Можно выбрать в корзине аналог, чтоб сразу заменить. Пользователю предлагают то, что покупатели часто выбирают, также то, чем они интересовались, и что соответствует по смыслу. Сделана интеграция сайта с Leadhit.
Список товаров в корзине можно напечатать в формате коммерческого предложения и поделиться с пользователями. Благодаря нестандартному механизму печати в браузере создается кастомный pdf файл по требованиям бизнеса.
Можно в один клик завершить заказ в корзине и оплатить его онлайн. Сделана интеграция с Ю.Кассой. Клиентам доступны промокоды и скидки. Если что-то пошло не так, с формы обратной связи идет заявка в Telegram-канал службы поддержки. Это ускоряет общение с клиентами.
5. Реализовали BI-аналитику для сайта
Заказчик поручил нам визуализировать данные по заказам, клиентам и товарам интернет-магазина. Применить группы фильтров и учесть разные периоды времени. Мы сделали дашборды на Yandex DataLens, на которых информация в интернет-магазине отображается онлайн.
Проведенная работа открыла и нам, и бизнесу ключевые метрики по клиентам, заказам и товарам. Выявили наиболее проблемные места и точки роста, определили ядро целевой аудитории, зависимость продаж товаров определенных групп от форматов рекламы и пр. Это стало поводом для клиента пересмотреть бизнес-стратегию и маркетинговые активности.
Стек технологий: React.js, Next.js, Redux Toolkit, Symphony, PHP.
Результат
Интернет-магазин Groster стал лидером в регионе по функционалу и продажам. Он обеспечивает улучшенный пользовательский опыт. Покупателям доступны новые функциональности, а сервисы позволяют удобнее совершать покупки. Внешний вид и функционал сайта ориентированы на оптовиков с учетом лучших практик маркетплейсов в b2c.
Контент-менеджерам стало проще редактировать контент в админпанели. Можно развивать сайт, добавляя любые модули. Прошлая версия сайта поддерживалась на Bitrix, и ее доработка и поддержка упирались в ограничения. Сайт стал более устойчивым, масштабируемым и поддерживаемым. Обеспечена гибкость в работе и быстрая адаптация к требованиям.
Спасибо за прочтение :)
Если статья понравилась, поделитесь
