Разобрали и собрали заново: обновили цифровую инфраструктуру крупной сети Оптика 3Z

Привет, это Женя — руководитель отдела разработки в Лиге А.! Перехватил аккаунт Лизы, чтобы рассказать о нашем большом проекте для сети салонов Оптика 3Z. Мы обновили сайт и техническую основу под задачи растущего бизнеса: настроили доставку через DPD и Boxberry, подключили кассы Атол, связали сайт с ERP-системой и автоматизировали оформление заказов. Новый сайт стал удобнее для пользователей и упростил работу менеджеров.

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

Когда бизнес большой, даже простые решения проходят через многих людей и согласований. Проект с Оптикой 3Z был как раз таким — многослойным и сложным, но от этого только интереснее. Особенно приятно, что со стороны клиента была сильная и вовлечённая команда. Мы постоянно были на связи, принимали совместные решения и двигались как одна команда.

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

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

Зачем интернет-магазинам обновлять сайт визуально и технически

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

Чаще всего спустя несколько лет бизнес сталкивается с типичными проблемами:

  • Сайт работает не так быстро, как ожидалось. Устаревшие технологии тормозят загрузку страниц, дизайн выглядит несовременно, а адаптивная версия даёт сбои. Это влияет на пользовательский опыт и снижает конверсию;
  • Сложности с управлением. Чтобы обновить информацию, нужно сделать много ручных действий. Менеджеры обрабатывают заказы без автоматизации — статусы не отслеживаются, а уведомления клиентам не отправляются. Рутинные задачи отнимают рабочее время и тормозят процессы;
  • Любые изменения — долго и сложно. В самописных системах простое действие «поменять кнопку» часто превращается в недельную разработку. А ведь цель интернет-магазина — чтобы клиент как можно быстрее купил товар и оплатил. Чем проще путь до покупки, тем быстрее бизнес получает деньги. Мы помогаем этот путь упростить и ускорить;
  • Системы не связаны. Сайт живёт отдельно, 1С — отдельно, касса — сама по себе. Заказы теряются, менеджеры ищут данные вручную, автоматизация не работает. В итоге команда делает то, что должен делать сайт.

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

Оптика 3Z тоже решили заново выстроить цифровую инфраструктуру — от вёрстки по готовому дизайну до связки с 1С и автоматизации внутренних процессов.

Большой бизнес со своей спецификой и уникальными задачами

Оптика 3Z — сеть салонов оптики, которая уже 17 лет проверяет зрение, подбирает линзы и изготавливает очки для клиентов по всей России. У клиента есть медицинские оправы, контактные линзы, солнцезащитные очки мировых брендов и собственной марки.

Разобрали и собрали заново: обновили цифровую инфраструктуру крупной сети Оптика 3Z

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

Появились новые потребности для Оптики, с которыми нужна была помощь:

  • Самостоятельно добавить что-то на сайт — сложно и затратно по времени;
  • Менеджеры тратили ресурсы на обработку заказов вручную;
  • Интеграции сайта с другими частями системы не работали стабильно.

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

Мы уже работали с командой Оптики на другом проекте, поэтому к этой задаче нас пригласили как проверенного подрядчика

Клиент пришёл к нам с запросом «успеть до Нового года»

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

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

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

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

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

Как договорились работать:

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

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

Основная задача — фундаментально перейти к техническим изменениям

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

Вместе с клиентом поставили следующие цели:

  • Заново сверстать сайт и предложить улучшения по сценариям оформления и покупки товаров;
  • В качестве бэкенда выбрать Битрикс. В том числе за наличие большого количества готовых, стабильно работающих решений для типовых задач;
  • Настроить интеграцию с DPD, Boxberry, Атол, Unisender и Unisender Go для маркетинговых рассылок и триггерных писем.

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

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

Мы взяли на себя аналитику, структурировали требования и подготовили проект. По итогам встреч составили подробную смету, расставили приоритеты и согласовали план запуска.

Настроили понятный процесс, чтобы синхронизироваться:

  • Задачи ведём в системе управления YouGile (аналог Trello);
  • Клиент добавляет в неё новые задачи и предложения по развитию;
  • Регулярно собираем накопившиеся задачи, оцениваем и запускаем новыми этапами.

Такой подход помог быстро реагировать на изменения и при этом не терять структуру

Параллельно с нашей работой по сайту, Оптика обновляла свои внутренние системы

Часть наших решений была завязана на системы клиента, которые ещё находились в разработке — бухгалтерия, учёт и 1С . Мы не могли начать работу, пока со своей стороны изменения не внесёт команда Оптики. Поэтому договорились работать по такой схеме:

  • Если задача простая и не требует глубокой проработки, команда клиента сначала реализует нужные изменения у себя — тогда мы подключаемся;
  • Если задача крупная и требует затрат времени с обеих сторон, но не критична для запуска, переносим её в отложенные и возвращаемся позже.

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

Основную часть вёрстки мы закрыли на старте, а дальше дорабатываем новые функции

Огромный объём вёрстки по готовым макетам мы реализовали в первые этапы. Сейчас продолжаем адаптировать страницы под новые сценарии и развивать функциональность.

Соовсем немного экранов, с которыми работали
Соовсем немного экранов, с которыми работали

Вместе с клиентом запланировали этапы:

  • Подготовка,
  • Вёрстка компонентов,
  • Сборка страниц, багфиксы,
  • Небольшие правки по запросам клиента и команды бэкенда.

Мы отвечали за весь проект: от аналитики и фронтенда до интеграций. Дальше рассказываем, что именно делали.

Прорабатывали сценарии и адаптировали макеты под реальные пользовательские задачи

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

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

Добавили фоновый запрос для сторонних сервисов и лоадер

Представьте, что пользователь заходит в корзину и выбирает самовывоз. В зависимости от выбранного города система определяет, какие способы получения доступны: самовывоз из салона, доставка курьером или ПВЗ DPD / Boxberry. Пользователь может сменить город прямо в корзине — данные и опции обновляются автоматически.

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

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

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

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

Сначала мы хотели автоматически подтягивать товары из 1С

Изначально мы запланировали синхронизацию каталога с 1С, но учли, что структура может не совпасть. Каталог на стороне клиента в процессе переработки, поэтому мы разработали промежуточное решение: настроили ручной импорт с возможностью переключиться на автоматический режим позже.

Перевели сайт на платформу Битрикс

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

Сейчас у клиента в разработке собственная ERP-система

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

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

Заглянем внутрь: как мы интегрировали сайт с DPD и Boxberry

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

  • Подключили API DPD и Boxberry;
  • Реализовали автоматический расчёт сроков и стоимости доставки — в зависимости от города пользователя;
  • Настроили подгрузку карты пунктов выдачи, если пользователь выбирает самовывоз.

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

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

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

Отдельная гордость: НДС без участия менеджера

Товары на сайте относятся к разным налоговым категориям. Например, на контактные линзы действует ставка 10%, а на готовые очки — 20%. Это важно для корректной работы онлайн-кассы и налоговой отчётности.

Что сделали:

  • Настроили классификацию товаров в CMS по ставкам НДС;
  • Подключили кассу Атол с учётом налоговых категорий;
  • Обеспечили автоматическую передачу данных в ОФД и налоговую.

Теперь чеки формируются корректно, без участия менеджеров. Сайт сам учитывает нужную ставку НДС, касса работает без сбоев, а заказ проходит весь путь автоматически 🧾

Новый сценарий оформления заказа: удобно для клиента, эффективно для бизнеса

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

Было долго, а сейчас так:

Разобрали и собрали заново: обновили цифровую инфраструктуру крупной сети Оптика 3Z

Если в заказе есть запись на услугу, то информация передаётся специалисту в салон:

Всё работает через единую систему, без дублирования действий
Всё работает через единую систему, без дублирования действий

Результаты

  1. Собрали интерфейсы по новым дизайн-макетам: огромная база компонентов, десятки страниц и множество решений по улучшению UX/UI сайта прямо по ходу вёрстки;
  2. Настроили интеграции с DPD, Boxberry, Unisender и отдельно Unisender Go для триггерных писем;
  3. Сделали автоматические письма со статусами заказов через Unisender Go. Подключили его к Битриксу, чтобы клиенты получали понятные уведомления о доставке;
  4. Упростили и автоматизировали доставку — теперь клиент сам выбирает способ, всё подтверждается без звонков, а статусы приходят автоматически;
  5. Подстроились под процессы клиента и для общего удобства выстроили прозрачную работу в таск-трекере YouGile.

Нам доверяют, потому что мы копаем

На созвонах клиент отмечал, что мы задаём правильные вопросы. Это не просто вежливость — речь о подходе.

Такие приятные слова получили от клиента после запуска сайта
Такие приятные слова получили от клиента после запуска сайта

Наша цель — понять, как бизнес работает на самом деле: какие процессы стоят за запросом, кто и как с этим работает каждый день

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

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

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

Что сейчас в работе:

  • Уже провели аналитику и собрали прототипы личного кабинета;
  • Приступаем к разработке дизайна;
  • Пишем техническое задание на разработку фронтенда и бэкенда для Личного кабинета.
Сейчас пилим удобный личный кабинет для клиентов Оптики
Сейчас пилим удобный личный кабинет для клиентов Оптики

Уже запланировали доработки в бэклоге: улучшения в админке, новые интеграции, доработка витрины.

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

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

2
1
Начать дискуссию