Как разрабатывался интернет-магазин для Mark Formelle, занявший 1 место на TIBO-2019

Поделиться

Последний Новый год компания Mark Formelle отметила с размахом – созданием нового интернет-магазина, который был разработан веб-студией «Медиа Лайн».

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

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

Целью проекта было создание удобного и функционального сайта с каталогом товаров. Сосредоточились на трех главных задачах:

  1. Увеличить долю продаж компании через интернет;
  2. Наладить автоматическую загрузку актуальной информации о товаре;
  3. Избавить пользователей от необходимости совершить большое количество кликов.

Реализация:

Начало года – это всегда большое количество праздников: Новый год и Рождество, День защитников Отечества и Международный женский день, 14 февраля… Для любого магазина это сезон активных продаж. Предыдущий сайт часто сбоил и мог не выдержать нагрузку от притока посетителей. В этой связи нужно было создать сайт в самые сжатые сроки. Если в первоначальном плане срок сдачи был намечен на март 2019-го года, то в итоге его пришлось передвинуть на декабрь 2018-го.

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

Визуально сайт бренда должен был выглядеть свежо и современно. Для этого приняли решение сделать динамическую страницу «О компании» и расположить на главной блок, который подтягивает посты из Instagram по хэштегу #markformelle.

1-динамичский скролл.gif

2-посты из Instagram по хэштегу #markformelle..png

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

3-проверка наличия в магагзинах.gif

Одна из новых интересных возможностей, которые дает интернет-магазин – это оформление подписки на носки. Сервис предлагает ежемесячно получать с доставкой по 4 либо 7 пар по предоплате, иногда – еще до поступления этих моделей в магазины.

Для того, чтобы информация о товарах на сайте всегда была актуальной, специалисты провели двухстороннюю интеграцию с учетной системой Fox Pro. Что это значит? Между этой системой и интернет-магазином происходит двухсторонний обмен данными о фактическом поступлении заказа и о его статусе (оплачен, не оплачен, доставлен и т.д.). Информация обновляется каждые 20 минут.

4-подписка на носки.png 

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

Оформляя заказ, не нужно долго искать город: сайт подтягивает его в фильтры по вашему IP-адресу. В зависимости от вашего местоположения, будут предложены определенные условия доставки и оплаты товаров. Все это стало возможным именно благодаря правильно проведенной интеграции. Отметим, что для работы с B2B-пользователями используется другая система учета – 1С Бухгалтерия.

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

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

5-Карточка товара.png 

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

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

Итог:

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

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

Интернет-магазин весьма популярен: ежедневно его посещает 10-15 тысяч человек. Число уникальных пользователей в месяц доходит до 400 тысяч.

Сайт нашел отклик не только у обычных пользователей, но и у экспертов электронной коммерции. Подтверждение тому – выход в финал премии E-commerce 2019, где Markformelle.by признали одним из лучших интернет-магазинов страны среди крупного бизнеса. Критериями отбора были, в том числе, удобство сайта и оформление заказа, а также актуальность предоставляемой информации. Кроме того, сайт номинирован на Интернет-премию TIBO 2019, где занял 1 место в номинации «монобрендовых Интернет-магазинов».

Над проектом работала команда из 9 специалистов веб-студии «Медиа Лайн» – руководитель проекта, два дизайнера, два верстальщика, три программиста и контент-менеджер.

Поделиться
Материалы по теме:
Обсуждение:
Читайте также: