Сайт для автоматизированных продаж контактных линз «Линзы-тут»

Контактные линзы — это не импульсная покупка, как напиток или снеки из автомата. Здесь важны точные параметры продукта: марка, диоптрии, режим ношения и т.д. Чтобы эффективно продавать такие позиции через вендинговые автоматы, нашему клиенту потребовалась современная и удобная платформа.

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

«Линзы-тут» — лидер в сфере автоматизированных продаж контактных линз и smart-вендинга с развитой сетью из более чем 500 линзоматов. Со временем действующий сайт перестал справляться с операционными задачами бизнеса: отсутствовала автоматическая синхронизация с актуальными остатками товаров, не было удобного поиска ближайшего автомата с нужными параметрами, а интерфейс не отвечал современным мобильным сценариям использования. 

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

Bitrix

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

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

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

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

Мы предусмотрели два сценария, как это можно сделать. 

• Первый — через каталог. Пользователь изучает каталог, выбирает заходит в карточку нужной модели линз и нажимает кнопку «Где купить». Система перенаправляет его на страницу поиска линзоматов, где этот товар уже автоматически выбран в фильтре. Остается только уточнить параметры (радиус кривизны и диоптрии) и выбрать ближайшую точку покупки.

• Второй — сразу на странице «Линзоматы» с помощью фильтра. Если человек точно знает, какая модель ему нужна, он может сразу перейти к поиску на карте. В боковой панели фильтра он выбирает бренд, радиус кривизны и диоптрии. Система мгновенно обновляет карту: на экране остаются только те автоматы, где этот конкретный продукт есть в наличии.

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

Кроме выбора модели линз и оптических параметров, мы добавили в фильтр полезные детали о линзомате: «Круглосуточно», «Работает сейчас», «Оплата картами», «Начисляются баллы MyAcuvue» и «Скидка по промокоду». Это помогает покупателю найти оптимальную точку покупки.

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

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

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

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

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

• Покупатели быстро находят нужные линзы и ближайший линзомат
  Решили главную проблему покупки линз в автоматах: покупателю больше не нужно ехать наугад, чтобы проверить наличие. Благодаря двум сценариям поиска и мгновенной AJAX-фильтрации, пользователь за пару кликов находит автомат с нужным товаром. Ему остается только прийти и купить линзы в удобное время. Так сайт повышает конверсию в реальную покупку в автомате.
• Менеджеры избавились от ручного труда, а клиенты — от недостоверной информации
  Автоматический импорт данных по расписанию полностью закрыл проблему ручного обновления. Менеджеры больше не тратят часы на сверку цен и наличия. А клиенты видят только актуальное наличие, что исключает ситуации, когда человек едет к автомату, но нужной модели там уже нет.
• Сайт одинаково удобен на любом устройстве
  Поскольку основной трафик идет со смартфонов, мы сделали мобильную версию полноценным рабочим инструментом. Интерфейс, карта и фильтры адаптированы под сенсорное управление, поэтому можно легко найти линзомат в дороге.
• Клиент самостоятельно управляет контентом
  Кастомные компоненты и продуманная структура админки дают менеджерам возможность самим публиковать новости и менять описания товаров без обращения к разработчикам. При этом сложная техническая часть с импортом и фильтрами работает стабильно и не требует постоянного вмешательства.

Заключение

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