Каталог услуг федерального оператора связи МТТ

Главное о кейсе

За счет удобной корзины с алгоритмом рекомендаций увеличивается средний чек и растет количество заявок.

Бизнес-задача и ее решение

Цель: обновить сайт и увеличить количество заявок на покупку услуг компании.

Задачи:
1. Упростить процесс покупки услуг МТТ.
2. Улучшить поведенческие факторы и юзабилити: время на сайте, глубину просмотра, отказы, возвраты.
3. Повысить лояльность клиентов и партнеров с помощью экспертных материалов, актуальных новостей, пресс-релизов, отчетов.

Решение:
1. Мы разработали мастер-страницу со всеми возможными компонентами страницы услуг. Теперь любой специалист компании может создавать веб-страницы сам, просто набирая нужные детали, как в конструкторе.
2. Пользователь может набрать в корзину нужные услуги и оформить заказ онлайн. CTA-кнопки под рукой на каждой странице.
3. Умная корзина с фильтрами и алгоритмом рекомендаций похожих услуг увеличивает средний чек.
4. Интеграции с hh.ru и CRM Заказчика экономят ресурсы специалистов компании.
5. Сайт многопланово оптимизирован для поисковых систем — все страницы являются уникальными для каждого города, каждый поддомен имеет собственную карту сайта.
6. Разработаны собственные обработчики информации, которые актуализируют большие объемы информации без помощи программиста.
7. Раздел «Помощь и поддержка» с базой знаний о бизнесе и телекоме, FAQ и техподдержкой с чат-ботом повышает лояльность клиентов.
8. Ключевой принцип разработки дизайна — mobile first. Блоки упрощены, управление осуществляется пальцем одной руки.
9. Навигация сайта последовательно ведет к покупке. Баннер с выгодными предложениями и заголовки с хайлайтами вовлекают, а CTA-кнопки позволяют сделать быстрый заказ.

Крафт (мастерство), реализация, технические детали

Использовали библиотеки:
-gsap — для анимации всех элементов.
-select2 — для реализации выпадающих списков (селектов).
-magnific popup — для реализации попапов (всплывающих окон).
-parsley.js — для валидации полей.
-swiper — для реализации слайдеров.
-locomotive scroll — для эффекта плавного скролла страниц.
-vue.js — для реализации корзины и блока с выбором номеров.

Скриншоты