B2C-приложение для отслеживания подписок «SubScout»
Помогает пользователям отслеживать расходы на сервисы, получать напоминания о списаниях и экономить бюджет. Полный цикл: от исследований до тестируемого прототипа.
UX/UI дизайн, прототипирование, юзабилити-тестирование
Роль
Срок
Результат
6 недель
кликабельный прототип основного сценария
Проблема
Бизнес-задача
Пользовательская задача
Люди теряют деньги из-за забытых подписок. Пробные периоды заканчиваются незаметно, списания происходят автоматически, а общая сумма расходов остаётся неочевидной.
Создать приложение, которое сделает управление подписками прозрачным и поможет контролировать бюджет.
Быстро добавить подписку, видеть общую сумму расходов
и получать напоминания о списаниях заранее.
и получать напоминания о списаниях заранее.
Процесс:
01. исследование и анализ (в команде)
02. проектирование сценариев (в команде)
03. вайрфрейминг (индивидуально)
04. визуальный дизайн (индивидуально)
05. прототипирование и тестирование (индивидуально)
01. исследование и анализ
Пользователи хотят «пробовать» приложение перед покупкой, но боятся, что забудут отменить подписку, если не понравится
Анализ 7 конкурентов (App Store, Google Play), формулирование гипотез и 6 глубинных интервью с целевой аудиторией.
Методы:
Инсайт
Решение в продукте
Онбординг раздражает, нужны подсказки в моменте
Пользователям важно иметь возможность выбирать
тип сортировки подписок.
тип сортировки подписок.
Не все подписки могут быть в каталоге
Пробный первый месяц премиума с добавлением подписки на наше приложение в списки подписок (придет уведомление о списании)
Контекстные тултипы вместо обязательного обучения
Реализовали гибкую сортировку подписок
Добавили возможность создать кастомную подписку
02. проектирование сценариев
Совместно с командой разработала блок-схемы пользовательских сценариев для ключевых путей:
1. Основной — поиск и добавление подписки из каталога.
2. Дополнительные — редактирование подписки, переход на сайт сервиса и др.
3. Экстренный — ошибка оплаты.
2. Дополнительные — редактирование подписки, переход на сайт сервиса и др.
3. Экстренный — ошибка оплаты.
03. вайрфрейминг
Сфокусировалась на логике навигации и снижении когнитивной нагрузки. Делала акцент на том, чтобы пользователь видел всю важную информацию сразу, а не держал в голове данные из предыдущих экранов. Отработала сценарии добавления подписки, включая экстренные.
04. визуальный дизайн
Разработала современный неоновый стиль в тёмной теме — это создаёт ощущение инноваций, контроля и доверия. Яркие акцентные цвета помогают выделять важные элементы (даты списаний, кнопки действий), а тёмный фон снижает утомляемость при частом использовании. Минималистичная композиция и продуманная типографика обеспечивают читаемость даже при большом количестве данных.
05. прототипирование и тестирование
Создала кликабельный прототип основного сценария «Поиск и добавление подписки». Провела юзабилити-тестирование на 3 пользователях.
1. Все респонденты поняли функционал приложения и смогли добавить подписку без особенных усилий.
2. Всем респондентам удалось пройти весь путь приблизительно за 30 секунд.
3. Все респонденты оценили яркий дизайн приложения.
2. Всем респондентам удалось пройти весь путь приблизительно за 30 секунд.
3. Все респонденты оценили яркий дизайн приложения.
Результаты:
Найденные проблемы:
1. Было сложновато открыть список «категории», нужно нажать пальцем минимум два раза, чтобы открылось.
2. Галочка «бесплатно первые 30 дней» запутывает пользователей, они на неё нажимают и ждут отклика от системы, не понимая, что нажали не на то.
3. Кнопка назад не всегда заметна, особенно мешает, если хочется быстро вернуться на предыдущую страницу.
2. Галочка «бесплатно первые 30 дней» запутывает пользователей, они на неё нажимают и ждут отклика от системы, не понимая, что нажали не на то.
3. Кнопка назад не всегда заметна, особенно мешает, если хочется быстро вернуться на предыдущую страницу.
Гипотезы по улучшению приложения после указанных недостатков:
- Если увеличить размер кнопки «добавить категорию», пользователь будет открывать выплывающий список с первого раза и использовать эту функцию в 2 раза чаще.
- Если задать функции «бесплатно первые 30 дней» другой вид, а из основной галочки при выборе тарифа сделать чекбокс, то пользователь не будет путаться на этой странице и сократит время пребывания на ней на 5–7 секунд.
- Если вынести кнопку «назад» на верхнюю часть экрана, то пользователь не будет суетиться в её поисках, и это сократит время пребывания на странице.
Эти гипотезы были зафиксированы для проверки в следующих итерациях.
Ожидаемое влияние на метрики
Поскольку проект находится на стадии концепта с протестированным прототипом, реальные метрики будут собраны после релиза. На этапе проектирования я определила целевые показатели:
Метрика
Цель
Как измерить
Доля активации
Время на задачу
Возвращаемость
Уровень ошибок
60% пользователей добавляют 1+ подписку в первый сеанс
Добавление подписки ≤ 1 минуты
40% пользователей возвращаются через неделю
< 5% ошибок при добавлении подписки
Трекинг событий в аналитике
Когортный анализ
Логи ошибок в интерфейсе
Замер времени от входа до успеха
SUS (удобство)
≥ 75 баллов
Опрос после тестирования
Выводы и уроки
Проект научил меня балансу между функциональностью и простотой в B2C-продукте. Самой большой сложностью было учесть все важные для пользователя моменты,
не перегрузив интерфейс, но и не сделав его бесполезно пустым.
не перегрузив интерфейс, но и не сделав его бесполезно пустым.
Я поняла, насколько критично тестировать прототип до финального дизайна — проблемы, которые нашли пользователи (галочка, кнопка назад), были бы незаметны без живого теста.
Важный урок по доступности: в процессе работы я использовала шрифт 10 кегля, что
по современным стандартам ниже минимума для мобильных интерфейсов. Для повышения читаемости и соответствия WCAG в следующих итерациях я бы увеличила кегль до 12–14 пунктов и проработала контрастность текстовых элементов.
по современным стандартам ниже минимума для мобильных интерфейсов. Для повышения читаемости и соответствия WCAG в следующих итерациях я бы увеличила кегль до 12–14 пунктов и проработала контрастность текстовых элементов.
Главный инсайт: пользователи ценят контроль и прозрачность больше, чем красивый онбординг. Подсказки в моменте работают лучше, чем обязательное обучение.
Если бы начинала сейчас, провела бы больше итераций тестирования до визуального дизайна — это сэкономило бы время на правках.