Перезапуск и развитие сайта оператора СберМобайл

СберМобайл

Клиент
СберМобайл — это мобильная связь большой экосистемы Сбера, которая работает на сетях МегаФона и t2. Сегодня СберМобайл доступен во всех регионах России.
Более 280 тысяч вышек обеспечивают масштабное покрытие, поэтому связь не пропадёт даже в самых дальних уголках страны.
Контекст
В июле 2024 года СберМобайл обновил визуальный стиль. Изменилась цветовая палитра бренда, дизайн иллюстраций, а также подход в коммуникации с аудиторией.
Все эти изменения нужно было отразить на дизайне сайта оператора, чтобы сохранить визуальное единообразие продуктов.

Работа над проектом

Клиент
Работа над проектом включала разработку, тестирование и последующую техническую поддержку.
В новом интерфейсе изменились пользовательские сценарии и появились полезные для абонентов функции.
Для реализации новой логики мы полностью переписали фронтенд и доработали бэкенд сайта.
Техническая реализация редизайна
Акцентом в дизайне стал оранжевый градиент. Он выполнял роль не только декоративного элемента, но и "визуального проводника".
Пользователи интуитивно следовали за переходами цвета и выполняли целевые действия.
Клиент
Чтобы оптимизировать сценарии взаимодействия, мы анализировали тепловые карты.
Это позволило выявить паттерны пользовательского поведения и поставить цветовые акценты в нужных местах.
Клиент
Чтобы сайт выглядел более привлекательным и современным, мы добавили анимации: ховеры, движение объектов при скролле, анимированные баннеры.
Это удерживает внимание пользователя и побуждает его совершить целевые действия.
Клиент
Так как большая часть трафика подобных сайтов сейчас идет с мобильных устройств, мы сделали ресурс максимально удобным и функциональным для пользователей смартфонов — оптимизировали структуру и визуальное оформление.
Переработка сценария оформления eSIM
Виртуальная сим-карта eSim оформляется по тому же принципу, что и физическая: с паспортом, договором и официальной подписью.
Весь процесс оформления eSim перенесен в онлайн. Пользователь заполняет информацию и получает сим-карту.
Контекст
Чтобы оформление проходило еще быстрее, мы сократили процесс получения eSim практически в 2 раза. Обмен данными происходит за секунды, а весь процесс заказа «симки» занимает не больше 5 минут.
«Под капотом» скрывается множество процессов — документы верифицируются, данные регистрируются и вносятся в базу, к профилю абонента привязывается его номер. Но для пользователя это занимает всего несколько минут.
Обмен данными
На каждом этапе оформления eSim нужно синхронизировать статус заказа между браузером абонента и бэкендом.
При этом оформлять «симку» могут сразу много пользователей, а это дополнительная нагрузка на сайт.
Контекст
Чтобы повысить отказоустойчивость ресурса, мы использовали сервер очередей Gearman и сервис Centrifugo.
Первый обрабатывает задачи в несколько потоков и передает второму, чтобы поддерживать быстрый обмен статусами между браузером и бэкендом.
Перенос номера
В форме для заказа eSim теперь можно сразу оформить переход на СберМобайл с номером другого оператора — в сценарий мы внедрили функцию переноса номера.
Пользователь заказывает eSim и одновременно подает заявку на переход — через 8 дней номер переносится в СберМобайл.
Настройка зон доставки для всей страны
Мы написали функцию, которая ограничивает зону доставки — теперь клиенты сразу видят, смогут они вызвать курьера или нет.
За счет этого удалось сократить негатив от клиентов и повысить их лояльность к компании.
Интеграция со службой доставки для доставки пластиковой сим-карты
Чтобы курьеры быстрее доставляли физические «симки», мы внедрили интеграцию по API с популярным сервисом доставки. Когда пользователь заказывает доставку, с бэкенда сайта отправляется запрос в сервис для поиска свободных сотрудников в нужном радиусе.
Для курьеров это выглядит как обычный заказ, только вместо продуктов они доставляют сим-карту СберМобайла. Пользователь получает ее в течение 30 минут.
Модуль SberPay
Мы первые в сегменте Сбера интегрировали на сайт модуль SberPay webSDK. Теперь для оплаты услуг СберМобайла пользователю достаточно авторизоваться на сайте по СберID и нажать кнопку оплаты.
Благодаря этой функции пополнять счет с компьютера или телефона стало удобнее.
Тест-кейсы для всех функций на сайте
Мы упорядочили процесс QA на сайте СберМобайла — написали библиотеку из 40+ тест-кейсов с документацией для проверки всех функций ресурса.
Для предрелизного QA мы составили чит-листы, в которых подробно описали последовательность действий для детальной проверки.
Настройка аналитики
Так как сценарии оформления eSim, авторизации и заказа сим-карты изменились, мы заново разметили функциональные страницы и настроили новые бизнес-цели.

Результаты

+47%
Общая конверсия
+42%
Конверсия Desktop
+74%
Конверсия Mobile
+6%
Глубина просмотра
+43%
Время на сайте
-5%
Отказы