backend frontend UI-дизайн сайты
·

Онлайн-сервис для регистрации на партнерские мероприятия ТД «Петрович»

Упростили регистрацию на мероприятия для «Петровича»: расширенные возможности, автоматизация и уведомления.

Задача

СТД «Петрович» периодически проводит мероприятия для участников «Клуба друзей Петровича» — своей программы лояльности.

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

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

Торговый дом «Петрович» — это крупнейший ритейлер товаров для строительства и ремонта. Компании принадлежит 21 строительно-торговый центр. Ассортимент — более 34 тысяч наименований.

Как раньше была устроена регистрация на мероприятия

«Петрович» часто проводит мероприятия для лояльных клиентов ― встречи с экспертами, мастер-классы и бизнес-ужины. Иногда события проходят совместно с поставщиками и включают в себя экскурсии на производство или мастер-классы по новым технологиям и материалам. Участники регистрируются по номеру карты лояльности.

Раньше под мероприятие настраивался лендинг. При этом его можно настроить только под одно конкретное событие. В этом заключалась первая большая проблема — нельзя было собирать регистрации одновременно на несколько событий.

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

Страница мероприятия и форма регистрации обновлённого сайта
Страница мероприятия и форма регистрации обновлённого сайта

Поэтому заказчик решил разработать новый сайт для мероприятий и сформулировал к нему такие требования:

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

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

Этап проектирования

Первым шагом мы подробно обсудили и описали все бизнес-процессы, которые касаются будущего сайта, в том числе:

  • Как будут рекламироваться мероприятия.
  • Откуда посетители будут попадать на сайт.
  • Какие вопросы и потребности будут у посетителей.
  • Как компания обрабатывает данные из форм регистрации.
Пользовательский сценарий в макетах к сайту
Пользовательский сценарий в макетах к сайту

Планирование работ

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

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

  • Список мероприятий,
  • Детальные страницы мероприятий,
  • Регистрация,
  • Отправка SMS и e-mail после регистрации,
  • Админка для управления мероприятиями,
  • Экспорт заявок в excel.

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

А все второстепенные функции мы вынесли на второй этап:

  • Страницы прошедших событий,
  • Автогенерация ics-файлов для добавления событий в календарь,
  • Форма для вопросов пользователей.

Этими задачами можно заняться уже после первого запуска.

На этапе проектирования мы составили список всех функций сервиса с сортировкой по приоритету
На этапе проектирования мы составили список всех функций сервиса с сортировкой по приоритету

Технологический стэк

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

Для сайта мероприятий мы взяли за основу бэкенд текущего сайта клиента, который построен на CMS «Битрикс». Так удобней и быстрее, к тому же админка для управления мероприятиями, построенная на «Битриксе», будет уже знакома контент-менеджерам.

У нас была возможность создать фронтенд тоже на CMS «Битрикс», но мы предпочитаем вместо этого создавать обособленный фронтенд на отдельном фреймворке. Такой подход проще и гибче в разработке и поддержке.

На этом проекте мы использовали для фронтенда наш любимый фреймворк Nuxt.

Информация о мероприятии как её видно в админке (слева) и на сайте (справа)
Информация о мероприятии как её видно в админке (слева) и на сайте (справа)

Новые функции и интеграции

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

Для отправки SMS мы использовали сервис Mindbox, который уже был интегрирован на сайте клиента. А для сокращения длинных ссылок в сообщениях мы подключились к сервису сокращения ссылок от Яндекса.

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

Участникам отправляются уведомления в виде sms, пуш-уведомлений и электронных писем
Участникам отправляются уведомления в виде sms, пуш-уведомлений и электронных писем

Результат

В итоге проект реализовал все нужные бизнесу функции:

  1. Теперь для каждого мероприятия, которое добавляет контент-менеджер, будет создаваться отдельная страница.
  2. Пользователи могут регистрироваться на мероприятия.
  3. Пользователи могут добавить событие себе в календарь с помощью файла ics.
  4. Участники мгновенно получают уведомления по e-mail и SMS, не дожидаясь ручной обработки заявки.
  5. Специалист поддержки имеет широкие возможности работы с заявками, в том числе фильтр по параметрам и экспорт в xls — и всё это в привычной админке «Битрикса».

С результатом можно ознакомиться на сайте:

Строительный торговый дом «Петрович» ― наш постоянный клиент с 2014 года. Мы уже разработали для «Петровича» информационный ресурс для ЭДО, сайт программы лояльности, HR-сайт компании и несколько десятков лендингов.

Расскажите о вашей задаче

Все поля формы обязательны