Приложение
для обучения
для обучения
Как переосмысление главного экрана заставило студентов возвращаться обратно в приложение
Моя роль
Продуктовый дизайнер
За что отвечал
Product Strategy, In-depth Research, UI/UX/IxD, User Testing
Аудитория
Студенты
Платформа
IOS, Android
+14%
CSI
+18%
Sticky Factor
О проекте
Контекст
Приложение Нетологии запускалось как простой каталог курсов, и его архитектура несколько лет принципиально не пересматривалась. За это время продукт обзавёлся корпоративными клиентами, маркетинговыми активностями и новыми форматами обучения
Цели проекта
Совместно с командой стратегии и владельцами направлений договорились, что редизайн должен решать четыре задачи
Усиление платформы
Сделать приложение основной точкой входа в экосистему обучения, а не вспомогательным инструментом
Масштабирование для B2B/B2G
Подготовить инфраструктуру под корпоративных и государственных клиентов
Рост вовлечённости
Повысить частоту возвратов и увеличить время, которое пользователь проводит в обучении
Интеграция маркетинга
Встроить баннеры и промо так, чтобы они не мешали основному сценарию
Исследования
Кастдев
Провели глубинные интервью вместе с продакт-менеджером. Спрашивали не только что раздражает, а зачем студент вообще открывает приложение
Главная страница
Кнопка «Продолжить занятия» ведёт себя непредсказуемо
Иногда в пройденный урок, иногда в начало модуля, из-за чего пользователи перестали ей доверять и искали нужный урок вручную
Индикатор прогресс бара не даёт понять состояние в курсе
Полоса заполнения есть, но оценить, сколько пройдено и сколько осталось, быстро нельзя
Список курсов не структурирован
Отсутствие сортировки и группировки превращало поиск оплаченного курса в отдельную задачу
Главная страница
Скачанные материалы не найти
Студенты скачивают лекции для офлайн-обучения, но раздел логически не связан с курсом, из-за чего пользователи со временем перестают им пользоваться
Календарь не связан с активным курсом
Расписание существует как отдельный раздел, и пользователи не заходят в него, поскольку не считывают связь с текущим обучением
Пройденные модули не скрываются
Пользователи не заходят в скачанное и календарь, так как нужн они логически оторваны от курсов
Что говорят пользователи
Реальные слова наших студентов, которые мы услышали на кастдеве
Нажимаю "Продолжить" и попадаю в начало модуля, который уже прошла. Начинаю искать вручную
Смотрю на полоску прогресса и не понимаю, мне ещё много осталось или уже почти всё
У меня три курса. Хочу найти нужный и прокручиваю весь список. Это каждый раз
Нашла скачанные материалы случайно. До этого думала, что функции скачивания вообще нет
Проанализировали метрики
Параллельно с кастдевом проанализировали метрики CSI и Sticky Factor. Оба источника показали единую проблему: приложение открывают регулярно, но до непосредственного прохождения урока доходит менее половины пользователей
JTBD
Зачем студенты открывают приложение
За каждым заходом в приложение стоит конкретная ситуация. Мы выделили четыре основных сценариев и проектировали под них
Учиться офлайн
Еду без интернета — хочу открыть скачанные материалы сразу, а не искать их по разделам
Не потеряться в курсах
Учусь на нескольких программах одновременно — хочу быстро найти нужную, не листая весь список
Не пропустить важное
Хочу получить уведомление о новом модуле или дедлайне вовремя, а не узнавать об этом случайно
Спланировать обучение
Хочу видеть расписание занятий прямо в курсе, а не переключаться между разделами ради одной даты
Гипотезы
Гипотеза № 1. Настраиваемых хаб
Несколько точек входа плюс возможность собрать экран под себя, баннеры можно скрыть, если мешают
Гипотеза 2. Хаб со статичным баннером
Та же структура, но верхняя часть экрана отведена под акцентную зону для коммуникаций, компромисс между навигацией и маркетингом с потенциалом развития до сторис
Гипотеза 3. Главная вокруг календаря
Если сделать планирование основным сценарием, у пользователей появится привязка ко времени и дополнительный повод возвращаться. Структура строгая и без кастомизации
Тестирование
UX тест главной страницы
Прототипы тестировали на 7 респондентах. Проверяди общую логику и иерархию экрана: как пользователи ориентируются, считывают приоритеты и переходят к ключевым действиям
Впечатление о странице
№ 1
№2
Правильно определили, что за страница
7/7
5/7
Нашли точку входа в другие разделы приложения
7/7
5/7
Сочли удобным сортировку блоков
7/7
5/7
Виджет расписания
№ 1
№2
Нашли этот виджет
7/7
5/7
Правильно предположили как работает этот виджет
7/7
5/7
Подтвердили, что этот виджет им необходим в обучении
7/7
5/7
Виджет уведомлений
№ 1
№2
Нашли этот виджет
7/7
5/7
Правильно предположили как работает этот виджет
7/7
5/7
Подтвердили, что этот виджет им необходим в обучении
7/7
5/7
Виджет последней активности
№ 1
№2
Нашли этот виджет
7/7
5/7
Правильно предположили как работает этот виджет
7/7
5/7
Подтвердили, что этот виджет им необходим в обучении
7/7
5/7
UX тест страницы курса
Страницу курса тестировали на тех же 7 респондентах. Задача была проверить, насколько хорошо пользователь ориентируется внутри курса и замечает ключевые виджеты
Виджет последней активности
№ 1
№2
Нашли этот виджет
7/7
5/7
Правильно предположили как работает этот виджет
7/7
5/7
Подтвердили, что этот виджет им необходим в обучении
7/7
5/7
Выводы
Оба теста дали однозначный ответ: первый вариант каждого экрана работает лучше. Пользователи быстрее ориентировались на экранах, точнее находили нужные блоки и уверенно описывали логику виджетов. Взяли его за основу без структурных изменений
Работа над UI
От структуры к интерфейсу
После того как гипотезы подтвердилась на тестировании, начался этап сборки интерфейса. Ключевая задача заключалась в переводе проверенной структуры в рабочий UI, устойчивый к маркетинговой нагрузке и к масштабированию продукта
Результаты
Выводы
CSI вырос с 3.2 до 4.6. Рейтинг в Rustore поднялся с 3.1 до 4.2 без единой маркетинговой акции: только за счёт того, что приложение перестало дезориентировать пользователя на каждом шаге. Но главный результат не в цифрах. Модульная структура главного экрана дала продукту запас прочности для роста: новые разделы теперь можно добавлять без переработки фундамента. Это легло в основу роадмапа на четыре квартала вперёд.
Что я узнал
Этот проект изменил то, как я думаю об экранах с навигацией. Самые важные инсайты пришли не из аналитики, а из наблюдения за тем, как реальные студенты теряются в простых сценариях
Студенты учатся нелинейно
Они прерываются на недели, возвращаются в середину курса, прыгают между модулями. Главный экран должен всегда отвечать на один вопрос: «Где я сейчас?» — и держать в контексте всё, что связано с активным курсом
Контекст очень важен
Скачанные, календарь и уведомления казались холодными разделами. Они стали живыми, когда мы привязали их к активному курсу, а не вынесли отдельно. Никакого онбординга не понадобилось — использование выросло само
Нужна синхронизация
Студенты переключаются между устройствами в середине курса. Если состояние не синхронизировано — доверие к приложению падает
Масштабируемость начинается со структуры
Прежде чем добавлять новые разделы, экран нужно было привести к чёткой иерархии. Модульная раскладка, которую мы выбрали, стала основой для роадмапа следующих двух кварталов
Phone
Email