Redesign онлайн курсов Tradimo
Tradimo — это онлайн-платформа для обучения трейдингу и инвестициям, ориентированная на европейский рынок. Здесь пользователи могут проходить курсы, участвовать в вебинарах, а благодаря геймификации — зарабатывать баллы за активность и обменивать их на книги или консультации с ведущими экспертами в мире инвестиций.
Мы работали небольшой, но сплочённой командой: SEO, я — дизайнер, фронтенд-разработчик, два бэкенд-разработчика и тестировщик. Несмотря на компактный состав, нам удалось реализовать масштабный редизайн всего за 3 месяца.
Задача
Передо мной стояла задача — полностью обновить UX/UI платформы и создать современную мобильную версию. Это было критически важно, поскольку 80% пользователей заходят на Tradimo со смартфонов. Я сфокусировалась на трёх ключевых аспектах: удобство, вовлечённость и удержание пользователей.
Чтобы измерить эффективность изменений, я определила основные метрики успеха и работала над их улучшением на каждом экране: retention, cреднее количество завершённых курсов на одного пользователя, вовлечённость в геймификацию.
Для быстрого внедрения изменений мы выбрали дизайн-библиотеку Tailwind. Это решение позволило оперативно прототипировать интерфейсы и синхронизировать работу дизайна и разработки на каждом этапе.
Процесс
- Исследование проблем: собрала обратную связь от пользователей и команды, чтобы выявить основные боли платформы.
- Анализ конкурентов: изучила лучшие решения в EdTech, чтобы понять, что работает у лидеров рынка.
- Wireframes и тестирование: создала прототипы и провела юзабилити-тесты на мобильных сценариях.
- Адаптация UI-библиотеки и создание макетов: интегрировала готовые компоненты, доработала их под задачи платформы и протестировала на ключевых сценариях.
- Внедрение и синхронизация: организовала работу по Agile — завела доску задач, распределила задачи по спринтам, наладила коммуникацию между всеми участниками процесса.
Основные изменения
- Сайдбар: количество пунктов сократили почти вдвое — с 15 до 8, объединив схожие разделы. Например, магазин и история покупок теперь находятся на одной странице с удобными табами.
- Дашборд: структурировала блоки по важности, улучшила визуализацию прогресса и геймификации, добавила новые разделы: «Ваши курсы», «Ближайшие вебинары», «Ваш уровень», «Миссия».
3. Сценарий прохождение курса
Полностью переработала карточки курсов — теперь они лаконичные и информативные, отображают только ключевые параметры: длительность, баллы, прогресс, уровень, тема.
Весь пользовательский флоу стал проще: открыть дашборд → выбрать курс → пройти урок → пройти викторину → получить баллы → обменять их на призы.
Навигация стала удобнее: на каждой странице урока можно быстро перейти назад или вперёд, есть быстрый доступ к содержанию курса и прогрессу, а видео можно развернуть на весь экран. Раньше карточки были перегружены и не помещались на экране, а навигация была запутанной.
4. Вебинары: раньше вебинары проходили на стороннем ресурсе, теперь они интегрированы прямо на платформе. Я добавила новую страницу просмотра вебинара с основной информацией и общим чатом для участников.
5. Редизайн лендинга
Я полностью пересмотрела структуру лендинга: убрала лишнюю информацию, сократила текст и сделала акценты более понятными для пользователя. Добавила изображения с платформы, чтобы сразу показать её функциональность. Внедрила новые блоки с отзывами пользователей, что повысило доверие к сервису. В отдельном разделе представила товары и услуги, которые можно получить за заработанные баллы. Подчеркнула конкурентные преимущества Tradimo и реализовала поддержку тёмной темы.
Итоги
Всего за 3 месяца мы полностью обновили Tradimo, сделав платформу удобной, современной и мобильной. Благодаря этим изменениям повысились ключевые пользовательские метрики и улучшить мобильный опыт.