Кейс | Разработка интернет-магазина премиальных товаров для маникюра и педикюра

Заказчик

Магазин товаров премиум-сегмента для маникюра и педикюра «Сорока».

Задача

Разработать функциональный и эстетичный сайт для beauty-сферы, подходящий как для начинающего мастера, так и для опытного специалиста по закупу из крупной компании.

О проекте 

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

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

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

До сотрудничества с нами у магазина «Сорока» не было собственного сайта. Продажи велись через социальные сети и оффлайн-магазины. В определенный период компания доросла до цифровизации продаж и автоматизации при обработке заказов. На этом этапе потребовалось создание собственного интернет-магазина, чтобы интеграцией с 1с, поддержкой актуального наличия товаров, оплатой и доставкой уже занимался не менеджер, а сайт.

 Что требовалось?

•  Разработать интернет-магазин с дружественным интерфейсом
• Поработать над дизайном, структурой и архитектурой сайта
• Наладить интеграцию товаров с системой учета 1С
• Реализовать авторизацию на сайте через личный кабинет
• Настроить быстрый поиск с всплывающими карточками товаров
• Интегрировать сайт с «Почта России» и СДЭК, платежными сервисами
• Реализовать расчет стоимости доставки с учетом зон
• Адаптировать сайт под мобильную версию, т.к. в современном мире интернет-магазины ассоциируются исключительно со смартфонами

Сложности проекта

• Находить баланс между дорого и красиво, при этом предлагая заказчику адекватную стоимость разработки.
• Трудности были в построении блока с товарами. По желанию владельцев карточки нужно было сделать разного размера, чтобы придать акцент некоторым товарам и за счет этого визуально выделиться среди конкурентов
• Работа с проектом затруднялась из-за большого ассортимента. Мелкие баги заползали далеко в недра каталога или поиска. Чтобы их найти и исправить, требовалось много времени

Что было сделано?

1. Сбор информации, подготовка структуры сайта

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

2. Прототипирование и создание дизайна

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

Каталог товаров

Необходимо было разработать несколько фильтров для поиска. При вводе слова в поле поиска, под ним требовалось развернуть список товаров. Особенностью интернет-магазина «Сорока» стало то, что предварительные результаты поиска (еще в модальном окне) выводятся в виде карточек товаров: с фото, ценами, акциями, кнопкой "добавить в корзину". Благодаря этой функции не обязательно нажимать на кнопку "Найти" для того, чтобы добавить товар в корзину. Это удобно для людей, которые знают, что ищут в магазине. Они могут быстро наполнить корзину товарами, не пролистывая каталог.

Карточка товара

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

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

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

Личный кабинет покупателя

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

3. Интеграции

• Настроен полноценный обмен товарами с ценами/количеством из конфигурации «1С:Предприятие Управление торговлей». Благодаря этой интеграции пользователи интернет-магазина видят на сайте только актуальные товары с остатками по корректным ценам. Для владельца магазина интеграция с 1С — это уверенность в том, что покупатель не купит товар, которого нет; высвобождение дополнительных ресурсов для занесения товарных позиций и своевременное обновление информации по наличию; автоматическое списание товара в системе учета. Интеграция в положительном ключе влияет на трудовые ресурсы: заказы создаются автоматически, переходят в статус оплачены и отправляются на сборку сотрудниками склада. Менеджерам больше не требуется тратить время и разносить заказы в 1С вручную.
• Произведена интеграция с платежным шлюзом Сбербанка через официальный модуль. Шлюз гарантирует надежность и безопасность передачи данных между покупателем и продавцом. Он является связующим звеном между ними и сетью банков-эквайеров. За счет данной интеграции клиент может расплачиваться за заказ онлайн любой банковской картой.
• Выполнена интеграция со службами доставки («Почта России» и СДЭК). Это позволило автоматизировать зоны доставки, чтобы владелец магазина определял, куда везти заказ и от какой суммы. Механика работы такая: товары добавляются в корзину с выбранным адресом, затем при переходе в корзину в списке доступных доставок высвечиваются СДЭК или «Почта России». Если это небольшой населенный пункт, то туда заказ доставит только «Почта России», т.к. обычно там нет СДЭК. Если заказ входит в зоны доставки магазина «Сорока», то к списку доставок добавляется "Доставка Сорока (например, определенный район города «Мясокомбинат»).

Благодаря интеграциям мы автоматизировали работу магазина, а для пользователя процесс заказа и доставки стал прозрачен. Интеграция с 1С вместе с онлайн оплатой и доставкой дает возможность высвободить человеческий ресурс, распределив его на более сложные задачи. И самое главное — это скорость. Менеджер не теряет время на подтверждение заказа менеджером, на выставление счета, на передачу заказа в сборку.

4. Мобильное приложение Владельцы магазина «Сорока» нацелены на построение долгосрочных отношений со своими клиентами и поддержание высокого сервиса обслуживания. По этой причине мы предложили им разработать WebView приложение, благодаря чему постоянные клиенты имеют быстрый доступ к ресурсу, оперативно узнают об изменениях в работе и новом поступлении. А владельцы, в свою очередь, получают возможность управлять спросом благодаря push-уведомлениям.

Стек технологий: Backend: HTML, CSS, JS, PHP, CMS - Bitrix/Битрикс Лицензия Бизнес.

Результаты:

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

2. Интегрировали сайт с 1С, Сбербанком, Почтой России и СДЭК: автоматизировали процессы работы и освободили менеджера от рутины.

3. Автоматизировали зоны доставки, чтобы пользователь сразу видел стоимость доставки на свой адрес.

4. Настроили умный поиск товаров с всплывающими карточками товаров.

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

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

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

Перейти на сайт