Формулирование бизнес-задач: дизайн и интеграция с внешней базой
Любая качественная разработка начинается с глубокого понимания коммерческих целей клиента. Стартовая точка проекта — раздел «Запчасти», в котором представлено свыше ста тысяч позиций. Заказчик определил четыре ключевые задачи.
1. Визуальная модернизация интерфейса
Владелец бизнеса честно оценил состояние существующей страницы — её внешний вид устарел и не соответствовал современным стандартам. Требовалось презентовать товар достойно и обеспечить визуальный уровень не ниже, чем у конкурентов.
Сам заказчик провел исследование рынка и подготовил техническое задание. При этом он оставался полностью открыт к нашим экспертным предложениям и готов был рассматривать альтернативные решения.
2. Организация автоматизированного импорта данных
Вторая сторона медали — серверная часть. В основе бизнес-логики компании лежит внешняя база данных на платформе Oracle общим объемом около 11 миллионов записей. Из соображений безопасности прямой доступ к этой базе был невозможен, однако заказчик предоставил два канала получения информации:
-
Формат XML — выгрузки дважды в сутки, содержащие актуальную номенклатуру
-
Формат JSON — непрерывный поток данных с оперативной информацией об остатках и ценах на запчасти
3. Разработка интуитивно понятной системы поиска
Ручной перебор сотен тысяч наименований запчастей — неприемлемый вариант. Необходимо было создать многоуровневую систему фильтрации с учетом ключевых параметров: модель техники, ценовой диапазон, наличие на складе, сроки поставки, взаимозаменяемость деталей и другие значимые критерии.
4. Комплексная SEO-оптимизация
Предыдущая версия раздела практически не учитывала требования поисковых систем к индексации контента. Требовалось пересмотреть семантическую структуру страниц, расположение элементов, иерархию заголовков — всё это для того, чтобы обеспечить удобство пользователей и одновременно высокие позиции сайта в результатах поиска.
Первый раздел: путь от замысла к реализации через преодоление трудностей
После серии встреч и детальной проработки нюансов мы приступили к активной фазе работы. На бумаге всё выглядело логично и выполнимо. Однако реальная реализация преподнесла немало сюрпризов. Рассмотрим каждый этап подробно.
Этап первый: работа над визуальной составляющей
Первое, с чем мы столкнулись — полное отсутствие исходных файлов дизайна. Предыдущая команда разработчиков верстала интерфейс напрямую, без подготовки макетов, что фактически означало необходимость создавать весь визуальный слой с нуля.
Дополнительная сложность заключалась в том, что предложенная заказчиком концепция внешнего вида раздела не отвечала современным трендам UX/UI. Мы объяснили причины, по которым поверхностная проработка не решит проблему, требуется глубокая переработка архитектуры интерфейса. Заказчик прислушался, и к работе подключились наши дизайнеры.
Была проведена кропотливая работа над каждым элементом: всё было детально проработано в Figma, создан полноценный UI Kit — библиотека готовых компонентов, из которых в дальнейшем можно будет оперативно собирать любые страницы сайта как из конструктора.
Этап второй: реализация механизма импорта данных
Этот этап оказался наиболее трудоемким и занял свыше месяца непрерывной работы. Oracle-база заказчика оставалась закрытой для прямого доступа. В наше распоряжение передали лишь исходный код существующего сайта на Python и Django, а также готовность предоставлять XML-выгрузки. Однако быстро стало ясно, что архитектура старого кода устарела и не отвечает современным требованиям.
Мы начали с внедрения базовой инфраструктуры на Docker — это позволило стандартизировать окружение для работы с данными на стороне заказчика, автоматизировать развертывание контейнеров и упростить процессы тестирования.
Следующая проблема проявилась при работе с объемами: данные поступали пакетами по 1–1,5 гигабайта. Отсутствовал механизм валидации, а обработка одного такого пакета занимала несколько часов — для бизнеса с высокой скоростью оборачиваемости запчастей такой вариант был неприемлем.
Решение потребовало нетривиального подхода. Вместо обработки массивных файлов целиком мы реализовали поэтапную выгрузку небольшими порциями. Размер каждой порции определяется динамически — в зависимости от того, какие именно позиции изменились по цене или остаткам. Зачем пересчитывать и обновлять миллионы неизмененных записей, расходуя вычислительные ресурсы сервера?
Механизм обновления данных работает следующим образом: информация поступает автоматически по расписанию. Номенклатура (добавление новых артикулов) обновляется дважды в сутки через XML. Цены и остатки передаются в формате JSON в реальном времени — при каждом изменении в базе заказчика. Например, если клиент приобрёл последнюю единицу запчасти, в нашу систему мгновенно приходит обновленный остаток «ноль».
Все передаваемые данные проходят многоступенчатую валидацию — как на стороне заказчика, так и в нашей системе. Это исключает ошибки форматирования, дублирование записей и другие потенциальные проблемы.
Схема организации обмена данными между системами
Первые тестовые запуски показали: даже с новой архитектурой вычислительной мощности существующего сервера недостаточно. После увеличения производительности арендованного оборудования в дата-центре примерно на 50% скорость обработки возросла многократно.
Кульминацией этапа стала первая полная выгрузка всего массива данных. В дальнейшем система работала по принципу инкрементальных обновлений через специально разработанный API.
Финальный результат превзошел ожидания: вместо часов обработка данных стала занимать считанные минуты, а обновления в течение дня происходят незаметно для пользователей и не влияют на общую производительность сайта.
Этап третий: внедрение продуманной поисковой системы
Отдельную задачу представляла разработка логики поиска. Какие фильтры наиболее востребованы? Как сделать процесс поиска максимально удобным? Мы провели серию встреч с экспертами заказчика, детально прорабатывая сценарии использования и оптимизируя алгоритмы.
В итоге была реализована двухрежимная система поиска:
- Экспресс-поиск — минималистичный интерфейс с двумя полями: выбор модели техники и подкатегории запчастей. Система автоматически ограничивает список предложений только совместимыми позициями — клиент никогда не увидит запчасть, не подходящую для его техники.
- Расширенный поиск — при переходе на следующий уровень пользователь получает доступ к полному набору фильтров. Это позволяет быстро находить нужные позиции либо по техническим характеристикам, либо по производителю.
Этап четвертый: оптимизация под требования поисковых систем
Пока разработчики трудились над импортом данных и поисковой системой, SEO-эксперты анализировали дизайн-макеты и вносили рекомендации по улучшению индексируемости.
На согласование всех правок для раздела «Запчасти» потребовалось две итерации. Заказчик получил уверенность в том, что его ресурс будет уверенно конкурировать за высокие позиции в выдаче как Яндекса, так и Google.
Этап пятый: обновление технологического стека
Существующая версия сайта работала на Python 3.7 и Django 2.2 — связке, актуальной еще в 2018 году, но уже устаревшей на момент старта проекта. Продолжение работы с таким стеком создавало серьезные риски:
-
Несовместимость с современными библиотеками и внешними сервисами;
-
Отсутствие поддержки исправлений критических уязвимостей, что угрожало безопасности системы.
После обсуждения с заказчиком было принято решение о миграции на актуальные версии: Python 3.13 и Django 5.0. Чтобы сократить сроки, процессы были распараллелены: одна группа разработчиков создавала новые модули, другая — одновременно адаптировала уже готовые компоненты под новый стек. Такой подход позволил выполнить миграцию практически безболезненно и без простоев в работе сайта.
Итоги работы над первым разделом
Разработка обновленного раздела «Запчасти» заняла примерно два месяца с учетом всех технических сложностей и этапов согласования. Финальный результат включал:
-
Динамическое обновление цен и остатков в течение дня с минимальными временными затратами;
-
Полностью защищенный канал взаимодействия с базой данных Oracle с подробной технической документацией;
-
Интуитивно понятный поиск с мгновенной реакцией системы;
-
Современный дизайн, соответствующий требованиям юзабилити и поисковой оптимизации;
-
Полностью актуальный и поддерживаемый технологический стек.
Расширение проекта: полная адаптация сайта под бизнес-логику компании
На тот момент сайт «Техстройконтракт» включал следующие ключевые разделы:
• Новая техника
• Техника с пробегом
• Аренда техники
• Навесное оборудование
• Запчасти (уже обновлённый раздел)
• Сервисное обслуживание
У каждого раздела — своя специфика и уникальная бизнес-логика, которую необходимо было глубоко изучить и корректно отразить в цифровой среде. Дополнительно стояла задача внедрения единой экосистемы: личных кабинетов клиентов, унифицированных форм заказа, онлайн-записи на сервис, возможности добавления арендованной техники в корзину и множества других функций.
Какие бизнес-проблемы предполагалось решить с помощью модернизации сайта?
- Высокая загрузка менеджеров— значительная часть их времени уходила на рутинные операции: запись клиентов на ТО, оформление заказов через электронную переписку или телефонные звонки.
- Отсутствие автоматизации— необходимость ручного внесения данных вместо автоматической синхронизации сайта с корпоративной базой Oracle.
- Неудобство для клиентов— растущее предпочтение самостоятельного оформления заказов онлайн без необходимости личного общения. Отсутствие корректно работающих форм напрямую влияет на лояльность клиентов.
- Морально устаревший дизайн— учитывая стоимость техники (от десятков до сотен миллионов рублей), имидж компании и качество цифровых точек контакта играют критическую роль в принятии решения о покупке. Наличие уже обновленного раздела «Запчасти» давало готовую основу для масштабирования дизайна на весь сайт.
За последующие восемь месяцев нам удалось не только выполнить все запланированные задачи, но и превзойти изначальные ожидания заказчика. Ниже — примеры реализованных решений.
- Клиентская база компании включает две принципиально разные категории: физические и юридические лица. Для каждой требуется своя логика регистрации, разный набор полей и отличающиеся уровни доступа к функциям (оформление заказа, управление корзиной, история обращений в сервис). Все взаимосвязи между типом клиента и доступным функционалом прорабатывались совместно со специалистами заказчика.
- Рост конверсии на 25%: история модернизации сайта компании, продающей дорожно-строительную технику
- Адаптивные формы регистрации для физических и юридических лиц с динамической подстройкой интерфейса
Были созданы универсальные шаблоны для разных типов техники и услуг, однако конкретное наполнение полей определяется автоматически в зависимости от категории товара. Такая архитектура обеспечивает единообразие и одновременно гибкость — при появлении новых типов техники не потребуется переписывать всю систему.
Для обеспечения стабильности было разработано более 90 автоматизированных тестов. Да, это усложнило этап разработки, но значительно упростило дальнейшую поддержку и масштабирование.
Наглядный пример: в карточках арендованной техники автоматически отображаются VIN-номер и филиал расположения, тогда как для новой техники эти поля не требуются.
Онлайн-запись на сервисное обслуживание
Сценарий: клиент записывается на обслуживание своей техники. Система должна учитывать:
• Тип техники (разные модели требуют разных видов работ);
• Выбор из 93 филиалов по всей России;
• Отображение доступных временных слотов в реальном времени;
• Расчет предварительной стоимости работ на основе моточасов (аналог пробега для автомобилей).
Вся информация передается мгновенно, синхронизируется с сервером заказчика и автоматически уведомляет соответствующее сервисное подразделение конкретного филиала: «Клиент Иванов с экскаватором модели Х прибудет 15 октября в 10:00».
Финальные результаты: +25% конверсии и другие достижения
Полная доработка сайта «Техстройконтракт» заняла десять месяцев. После финальной приемки и подготовки полного пакета технической документации состоялся официальный релиз обновлённой платформы.
Первые три месяца эксплуатации проходили в режиме активного мониторинга: мы устраняли мелкие неточности, оптимизировали работу микросервисов и отслеживали динамику трафика и конверсии. Результаты превзошли все ожидания: за этот период трафик вырос на 30%, а конверсия в целевые заявки увеличилась на 25%. Ни заказчик, ни наша команда не прогнозировали столь быстрого эффекта.
Причины успеха очевидны:
-
Сайт стал работать значительно быстрее: обновление цен и остатков по 11 млн позиций происходит несколько раз в день без замедления работы интерфейса, поиск мгновенно реагирует на запросы.
-
Появились удобные инструменты для клиентов: формы заказа, личные кабинеты, онлайн-запись на сервис — всё это снижает барьеры для совершения покупки.
-
По стратегически важным коммерческим запросам сайт поднялся в поисковой выдаче на более высокие позиции.
-
Современный дизайн создаёт совершенно иное впечатление о компании — сайт стал выглядеть премиально и технологично.
Дополнительные преимущества для бизнеса:
-
Менеджеры получили возможность концентрироваться на активных продажах вместо рутинной обработки заявок.
-
Архитектура системы полностью соответствует требованиям информационной безопасности — внешние запросы не могут получить доступ к основной базе данных Oracle.
-
Поддержка и развитие платформы упростились благодаря внедрению инструментов непрерывной интеграции и миграции на современный стек технологий.
«В настоящий момент мы проводим миграцию сайта на современный технологический стек NextJS. В будущем планируем углубить интеграцию с внешними сервисами и корпоративной CRM-системой заказчика», — комментирует Дмитрий, руководитель нашей команды разработки.
Этот проект стал ярким примером того, как комплексный подход к цифровой трансформации — от дизайна до глубокой интеграции с бизнес-системами — способен не только обновить внешний вид сайта, но и кардинально оптимизировать бизнес-процессы, повысить удовлетворённость клиентов и напрямую повлиять на финансовые показатели компании.
