Привет. Меня зовут Денис, я продакт-оунер Дизайн-системы Ростелекома. Ещё недавно я был тимлидом команды продуктовых дизайнеров, мы работали над дизайном и пользовательскими сценариями личных кабинетов абонента. Исторически функционал кабинетов огромного телекома со временем усложнялся и превращался в несколько больших комбайнов, не везде цифровых, и не всегда удобных для обычного человека. Нашей задачей было всё спроектировать как одно общее пользовательское пространство. Т.к. цифровизация это ещё и множество систем и разнообразный технологический ландшафт, то помимо нас над проектом работало много других специалистов, всего более 300 человек.

Вместе с аналитиком Дизайн-системы Юлией Берниковой, мы расскажем в данной статье о том, как проходил этот большой и интересный проект.

Появление продуктового подхода

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

Масштабная трансформация Ростелекома началась в 2016 году. Появились команды цифровых сервисов, которые запустили продуктовую разработку на основе реальных потребностей пользователей в противовес классической разработке по бизнес-требованиям. В следующие несколько лет компания выпустила несколько успешных цифровых продуктов, в том числе WinkПереезд и Лицей. Это было первыми шагами Ростелекома в цифровом сегменте.

К 2018 году оформившимся трендом в IT стало создание цифровых экосистем. Многие крупные компании, в том числе Сбер, Яндекс и Mail.ru, анонсировали объединение своих сервисов в продуктовые экосистемы для улучшения клиентского опыта. Через призму продуктового видения начал планировать своё дальнейшее развитие и Ростелеком.

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

Михаил Маркус, директор ЦК по развитию цифровой экосистемы, один из идеологов цифровизации Ростелекома

«Концепция цифровизации родилась из идеи сделать нечто большее, чем просто объединить продукты в общее клиентское пространство, что-то, что завершит трансформацию Ростелекома в digital-компанию, поменяет Ростелеком снаружи и внутри — и технологически, и культурно». 

Иван Фролов, директор ЦК по реализации digital-проектов, один из идеологов цифровизации Ростелекома

Концепция продуктового развития основывалась на следующих компонентах:

  1. Создание бесшовного пользовательского опыта: любой сервис или канал должен ощущаться частью единого пространства Ростелекома;

  2. Масштабирование продуктового подхода: все решения должны приниматься на основе данных, исследований клиентского опыта, и бизнес-моделирования;

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

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

Леонид Новожилов, первый заместитель генерального директора, один из идеологов цифровизации Ростелекома

Новые механики продаж и выравнивание клиентского пути

Точкой входа в большинство сервисов Ростелекома является единый личный кабинет, или ЕЛК. Как и сам Ростелеком, ЕЛК объединяет внутри себя множество сервисов, региональных провайдеров и операторов. Несмотря на функциональность, в ЕЛК отсутствовали необходимые механики продаж цифровых продуктов. ЕЛК также не покрывал полного клиентского пути, в частности, не становился точкой входа для новых пользователей — многие клиенты ни разу после подключения услуг Ростелекома не заходили в личный кабинет. Вдобавок ЕЛК не имел общего с другими клиентскими системами UI/UX. Для трансформации бизнеса и создания бесшовного пользовательского опыта в цифровом пространстве ЕЛК необходимо было модернизировать.

Главная страница ЕЛК в старом дизайне, до появления Старта
Главная страница ЕЛК в старом дизайне, до появления Старта

Модернизация началась с определения сценариев онбординга пользователей и вынесения их на отдельный портал, получивший соответствующее название Старт. Это позволило расширить функционал личного кабинета и обогатить его технологический ландшафт. Старт должен был не только стать каналом онбординга новых пользователей, но и предоставить единый UI/UX, отличный от ЕЛК. Для этого разработка велась совместно с командой дизайна.

По инициативе дизайнеров у Ростелекома появилась первая собственная Дизайн-система (design.rt.ru): UI-кит и стандартизированные правила его использования. В своей начальной версии дизайн-система была представлена только компонентами в Figma без кода, но даже это существенно ускоряло разработку — дизайнерам не нужно было тратить время на создание типичных UI-элементов.

«У меня давно было смутное ощущение, что нам не хватает каких-то стандартов — всё разъезжается, разные отступы и шрифты. Дизайн-система — именно то, чего я ждал. Она ускорила дизайн и разработку существенным образом: есть правила, по ним надо просто сделать дизайн. С точки зрения бизнеса это большой шаг вперёд». 

Георгий Бастраков, главный архитектор блока по развитию цифровых технологий, участвовал в разработке Старта

Главная страница Старта
Главная страница Старта
Компоненты дизайн-системы в Figma
Компоненты дизайн-системы в Figma

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

Редизайн начался с визуального обновления основных страниц — главной ЕЛК, лицевого счёта, страницы услуг, страницы настроек и прочих. Новая Дизайн-система позволила сделать это максимально быстро: тимлид дизайн-команды Дима Макаров, который только пришёл в Ростелеком в марте 2020-го, завершил первый этап редизайна за два месяца.

«Меня на тот момент очень выручило наличие Дизайн-системы в Figma. Это было очень круто и заметно сокращало время. У нас были концептуальные наработки, драфты, и набор компонентов — на этой основе у меня получалось очень быстро готовить варианты редизайна». 

Дмитрий Макаров, дизайн-тимлид ЦК по UI/UX, работал над редизайном ЕЛК

Страница услуги до редизайна
Страница услуги до редизайна
Страница услуги после редизайна
Страница услуги после редизайна

После успешного первого этапа — обновления UI — фокус редизайна сместился на изменение UX в соответствии с пользовательскими сценариями. На этой стадии было необходимо более плотное взаимодействие с бизнес-заказчиками, разработчиками и другими командами. Обычно это требует много времени: аналитик должен собрать информацию, поставить и утвердить задачу, согласовать промежуточные результаты и прочее. Этот процесс получилось ускорить на порядок благодаря Дизайн-системе.

Команда ввела практику кодизайна — совместной работы в Figma через Zoom для экономии времени. Дизайн-система позволяла дизайнеру быстро менять мокапы по замечаниям от представителей бизнеса, получать необходимые данные у лидов разработки и аналитики и согласовывать конечные варианты интерфейса. Это заметно ускорило работу — разработка практически готового прототипа занимала не несколько недель, а одну Zoom-встречу с командой. Такая совместная работа повысила и вовлечённость команды.

«Кооперативный дизайн сплотил команду и поднял общую экспертизу. Даже бизнес и продакты с интересом участвовали, находили для себя пользу и отмечали, что начали понимать UI/UX». 

Дмитрий Макаров, дизайн-тимлид ЦК по UI/UX, работал над редизайном ЕЛК

В дальнейшем по Дизайн-системе был произведён и редизайн официального сайта Ростелекома rt.ru. Появление собственной Дизайн-системы, а благодаря ей и единого визуального стиля у сайта, онбординг-портала и личного кабинета стало первым заметным итогом внедрения продуктового подхода в Ростелекоме.

«Дизайн-система — это необходимая гигиена существования системы продуктов, визуальный образ, который за счёт единого дизайна и единых UX-паттернов помогает пользователю понять, что он находится именно в продукте Ростелекома». 

Андрей Гундырев, директор ЦК по UI/UX, один из идеологов цифровизации Ростелекома

Внедрение R&D

Важный компонент продуктового развития — принятие продуктовых решений на основе данных о реальных потребностях пользователей. Так в компании заработал механизм R&D-исследований и запустилась фабрика пилотов. За время существования программы фабрика провела 12 успешных пилотов, показав бизнес-результатыи уменьшив отток пользователей.

Одним из первых успешных кейсов применения R&D стало выявление более глубоких потребностей пользователей ЕЛК после первичного редизайна. Так, выяснилось, что история начислений и оплат, наиболее важный для клиентов раздел личного кабинета, не полностью справлялась со своей функцией — пользователям часто было непонятно, как считается сумма к оплате и какие услуги или оборудование входят в начисленную сумму. На истории начислений и сфокусировалось первое custdev-исследование.

Команда R&D сформировала гипотезы о возможных улучшениях UI/UX ЕЛК, которые бы сделали историю начислений более прозрачной для пользователей. Присоединившаяся к команде дизайнер Наташа Ни визуализировала эти улучшения, разработав в Figma интерактивные прототипы интерфейсов. Эти прототипы использовались для проведения UX-тестирования с респондентами и проверки сформированных гипотез. Исследование проводилось итеративно: прототипы дорабатывались по полученным от респондентов комментариям и потом использовались в следующем UX-тестировании с другой группой пользователей. Дизайн-система делала работу над прототипами очень быстрой — 4 итерации UX-тестирования с 15-ю респондентами завершились всего за 4 недели. Больше про это исследование можно почитать на Behance.

«Мне было очень удобно работать с дизайн-системой, потому что тестирования проводились каждую неделю. Внести дополнительные правки для следующей итерации можно было очень быстро — требовалось всего 1-2 часа на обновление интерактивного макета из большого количества связанных экранов». 

Наташа Ни, веб-дизайнер ЦК по UI/UX, участвовала в редизайне ЕЛК и разрабатывала прототипы для UX-тестирования

Прототип интерфейса со связанными экранами в Figma
Прототип интерфейса со связанными экранами в Figma
Контекст тестирования и одно из заданий
Контекст тестирования и одно из заданий
Работа с интерактивным прототипом
Работа с интерактивным прототипом

UX-тестирование не только подтвердило некоторые гипотезы команды R&D, но и дало ценные инсайты от респондентов. Изменения в истории начислений и оплат, сделанные по результатам исследования, действительно обеспечили более понятное управление операциями, а также уменьшили нагрузку на техническую поддержку.

Сейчас R&D — неотъемлемая часть процесса создания и развития продуктов и сервисов Ростелекома. Перед постановкой задачи команде разработки центр R&D проводит исследования, опросы, UX-тестирование и бизнес-моделирование, чтобы понять реальные потребности пользователей. Именно процесс R&D позволяет компании выпускать востребованные и экономически успешные продукты.

«Благодаря быстрому дизайну и единым паттернам фокус сместился на то, как создать правильный продукт, который принесёт пользу клиентам и компании. Дизайн-система позволила осознанно управлять подходом к дизайну в Ростелекоме, что заложило основу продуктовой культуры». 

Андрей Гундырев, директор ЦК по UI/UX, один из идеологов цифровизации Ростелекома

Создание единого пространства

Продуктовый подход предполагал объединение всех продуктов и сервисов Ростелекома единым пространством и единым аккаунтом. Несмотря на то, что Старт, ЕЛК и сайт Ростелекома — технологически отдельные платформы, визуально они уже выглядели как единое пространство благодаря использованию дизайн-системы. Именно их единый дизайн натолкнул на идею создания авторизованной зоны, которая объединяла бы пространства на уровне интерфейсов, а не технологий.

Такое объединение стало возможным с Ростелеком ID — единым аккаунтом для всех продуктов Ростелекома, объединяющим учётные записи разных сервисов. После авторизации с Ростелеком ID пользователь плавно перемещается между сайтом, Стартом и ЕЛК внутри единого клиентского пространства. Переключение между платформами происходит прозрачно, но незаметно для пользователя благодаря выровненным шапкам и единому UI.

Главная сайта (rt.ru)
Главная сайта (rt.ru)
Главная личного кабинета (start.rt.ru)
Главная личного кабинета (start.rt.ru)
Раздел бонусов личного кабинета (lk.rt.ru)
Раздел бонусов личного кабинета (lk.rt.ru)

ЕЛК объединяет общим интерфейсом множество региональных IT-систем и систем биллинга, и масштабирование любых изменений в таком ландшафте требует отдельного проекта технической реализации для каждого региона. Интеграция платформ с помощью Ростелеком ID происходит итеративно — единое пространство должно стать доступно во всех регионах до конца этого года. В регионах, где единое пространство уже реализовано, оно позволило объединить веб-интерфейс у более чем десятка продуктов, среди которых мобильная связь, интернет, телефония, Видеонаблюдение, Умный дом, Ключ, Лицей, игровые тарифы, акции и прочее. Управлять услугами в одном месте стало удобнее, что уменьшило отток клиентов.

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

Леонид Новожилов, первый заместитель генерального директора, один из идеологов цифровизации Ростелекома

Будущее продуктов Ростелекома

Работа в продуктовом подходе поменяла общую культуру Ростелекома. Компании удалось отказаться от старых паттернов, изменить образ мышления и научиться смотреть на продукты через призму клиентского опыта. Цифровизация достигла не всех поставленных целей, но ей удалось объединить множество продуктов единым интерфейсом и создать новый технологический ландшафт для огромной корпорации. IT-команда Ростелекома получила опыт полностью самостоятельного создания решений и их развития не только с технологической стороны, но и со стороны бизнеса. Всё это превратило Ростелеком в современную цифровую компанию, где на первом месте стоит клиентский опыт, качественное, комфортное и единообразное взаимодействие с пользователями в цифровых каналах. А отказ от вендоров и фокус на создании собственных решений обеспечили независимость — сегодня в IT-кластере Ростелекома работает 3,5 тысячи человек, что позволяет компании самостоятельно реализовывать даже самые сложные и масштабные проекты.

Следующий этап развития компании — связывание продуктов Ростелекома в рамках единой системы, создание синергии, поиск сложных сценариев и переиспользование сервисов. Это принципиально новые для IT-команды задачи, а значит и возможность расширить использование дизайн-системы и других технологий, получить новый опыт и экспертизу и достичь новых успехов вместе с Ростелекомом. ♥

«Формально история цифровизации завершена, но она оставила после себя много артефактов, которые будут развиваться дальше. Мы запустили абсолютно новые для компании продукты, но наш основной актив — команда, которая научилась реализовывать самые амбициозные инициативы на принципиально другом качественном уровне». 

Михаил Маркус, директор ЦК по развитию цифровой экосистемы, один из идеологов цифровизации Ростелекома

Над статьей работали:
Юлия Берникова — редактор;
Денис Пушкарь — редактор и куратор.

Комментарии (0)