Yandex.Metrika Counter

 

Редизайн интернет-магазина сантехники

Компания FORS продаёт сантехнику и комплектующие для монтажа инженерных систем, связанных с водоснабжением и водоотведением через интернет-магазин 47.ru. В ассортименте — собственная продукция и товары партнёров.

Нашей задачей было обновить дизайн интернет-магазина 47.ru. Сделать его современным, удобным и понятным для всех сегментов целевой аудитории 47.ru.

О проекте

Старт работ: декабрь 2019
Финал проекта: ноябрь 2020

В течение 2020 года страница за страницей мы обновляли дизайн интернет-магазина. Активное участие в работе над проектом принимали маркетологи FORS. Главной целью было сделать интернет-магазин удобным для розничных и оптовых закупок.

Команда fuse8

Руководитель проекта
Вениамин Мустафин

Дизайнеры
Алексей Пилишков
Валентин Кротов

Команда «47.ru»

Директор по маркетингу
Тимур Кушаков

Разработчик
Артём Ванат

Процесс

Мы начали работу над проектом с изучения целевой аудитории интернет-магазина 47.ru. Это физические лица, юридические лица и специалисты. 

Целевая аудитория интернет-магазина 47.ru

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

Мы также изучили сайты конкурентов FORS и популярные интернет-магазины — «Леруа-Мерлен», «Ситилинк», OZON, DNS, AliExpress и другие. Последние формируют пользовательский опыт — то, как люди привыкли взаимодействовать с коммерческими площадками в сети. Поэтому изучать их интерфейсные решения — всегда хорошая идея.

Собрав этот багаж знаний и идей, мы предложили свое видение дизайна интернет-магазина 47.ru в виде прототипов. Затем обсудили их с заказчиком, внесли коррективы и начали, страница за страницей, создавать дизайн-макеты обновленного сайта 47.ru.

Результат

Главная страница

Самый заметный объект на главной странице — блок с категориями товаров. Он выполняет сразу две задачи:

  • привлекает внимание пользователя, дает понять, что продает магазин, и помогает сориентироваться — в какой раздел идти;
  • разделяет целевые аудитории: профессиональные монтажники обращаются к разделам «Отопление», «Водоснабжение» и «Канализация», а обычные покупатели, которые делают ремонт в ванной, — к разделу с сантехникой.
Интерфейс главной страницы интернет-магазина 47.ru

Каталог

Сверху страницы есть раскрывающееся навигационное меню с разбивкой на категории товаров.

Верхнее навигационное меню

Слева — дополнительное меню с товарами, относящимися к выбранной категории.

Боковое меню облегчает доступ к каталогу

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

Плитка удобна для сравнения товаров визуально. При наведении на карточку появляется дополнительная информация и кнопка «В корзину».

Таблица удобна для крупных закупок. На странице помещается больше товаров. В правой колонке — кнопка для моментального добавления в корзину.

Переключение отображения товаров в каталоге

Страница товара

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

Страница товара

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

Галерея с миниатюрами товара

Ниже на странице товара — информация о доставке, адресах пунктов самовывоза, и раздел «С этим товаром покупают». Его мы дополнили тэгами, которые помогут покупателю найти сопутствующие товары.

Теги внизу страницы помогают найти сопутствующие товары

Сравнение товаров

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

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

Страница сравнения товаров — десктопная и мобильная версии

Корзина

Корзина на сайте 47.ru — это инструмент управления заказом. Здесь можно добавить единицу товара, заменить его на аналог, удалить ненужное, поделиться списком с кем-то еще или распечатать его.

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

Корзина и сценарий оформления заказа в один клик

Из корзины можно купить товар в один клик. Для этого нужно ввести только номер телефона и электронную почту. Менеджеры 47.ru свяжутся с покупателем, чтобы подтвердить заказ и уточнить способы его получения и оплаты.

Оформление заказа

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

Страница оформления заказа

Личный кабинет

В личном кабинете можно отслеживать статусы заказов, делиться списками покупок, оплачивать и распечатывать счета, формировать шаблоны заказов. Здесь сохраняется вся история покупок и выбранные ранее адреса доставки и пункты выдачи.

Дизайн-система

Мы создали для заказчика большую библиотеку компонентов. В ней собраны все визаульные элементы сайта в разных состояниях. Теперь, если заказчику потребуется создать новую страницу на 47.ru, у дизайнера это не займет много времени.

 

Отзыв клиента

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

директор по маркетингу FORS

Обсудить проект

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

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