Разработка интернет-магазина профессионального оборудования для ресторанов

Исходная ситуация

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

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

Цель проекта

Создать интернет-магазин, который:

1. удобно работает с большим каталогом;
2. помогает быстро находить нужное оборудование;
3. показывает важную информацию о товарах;
4. упрощает оформление заказа;
5. выглядит не как шаблон, а как продукт под бизнес клиента.

План реализации

Работы были разбиты на несколько этапов:

1. Настройка готового решения.
2. Доработка поиска.
3. Верстка и программирование главной страницы.
4. Улучшение каталога и фильтров.

Кроме того, после запуска проекта были выполнены такие работы, как:

1. Переработка карточки товара.
2. Доработка корзины и оформления заказа.

Этап 1. Умный поиск по каталогу

Для проекта с большим ассортиментом ключевым элементом стал поиск.

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

Это позволяло покупателям более быстро и точно найти требуемый товар.

Сделали вывод подсказок с похожими товарами, чтобы покупателям было легче ориентироваться в товарах:

Данные доработки позволили пользователям быстрее находить нужное оборудование и не теряться в каталоге

Этап 2. Главная страница и навигация

Главная страница должна была сразу вести пользователя к товарам.

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

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

На главную страницу вывели блок с поиском товаров по брендам, так как данный вид поиска является удобным для многих покупателей

Этап 3. Шапка сайта

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

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

Так, если посетителю сайта нужны товары для пиццерии — нет необходимости в поиске каждого товара по-отдельности. Достаточно перейти в соответствующий раздел, где уже собраны все товары.

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

Этап 4. Каталог товаров

В каталог вывели большое количество разделов для удобного поиска необходимых товаров:

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

Мы произвели доработку фильтра по статусам товаров: хит, новинка

Также была доработка по наличию товаров: в наличие, под заказ.

Все стикеры выделили цветом для лучшей наглядности

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

Этап 5. Карточка товара

Прежде всего мы увеличили масштаб фото товара, сделав его более крупным и акцентным:

Рядом с фото товара мы вывели блок с его основными характеристиками:

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

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

Разделили характеристики товаров по группам (заводские данные, основные характеристики, особенности и прочее), так как на стандартном шаблоне данного функционала не хватало.

Поделили блок «с этим товаром покупают» на табы: похожие, хиты продаж:

Этап 6. Корзина и оформление заказа

Проанализировав пользовательский путь, мы приняли решение сократить его на 1 шаг.

Как известно, чем он короче, тем легче пользователям совершить покупку.

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

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

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

Для покупателей — юр.лиц добавили возможность скачать корзину при оформлении заказа в формате XLS или PDF.

Это особенно важно для B2B-клиентов, которые часто согласовывают покупки с руководством

Результат

В результате мы запустили интернет-магазин, который:

1. удобно работает с большим каталогом;
2. помогает быстро находить оборудование;
3. показывает документацию и характеристики;
4. поддерживает сценарии B2B-покупок;
5. выглядит как кастомный продукт, а не шаблон.

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

Комментарии компании RANX

Проект Рефро — хороший пример того, как готовое решение можно превратить в полноценный e-commerce-продукт. Мы работали не только с дизайном, но и с логикой поиска, подбора и покупки оборудования.

Если вам нужен интернет-магазин с большим каталогом и удобным сценарием покупки — мы в RANX поможем превратить шаблон в рабочий инструмент продаж.

Оставьте заявку — обсудим ваш проект и предложим решения под задачи бизнеса.