🔸 Клиент
Triplay — это ИИ-планнер путешествий. Сервис позволяет путешественникам в считанные секунды составлять удобные и интересные туристические маршруты в любом городе мира.
Ко мне обратились с проблемой того, что пользователи едва зайдя и попробовав сервис, довольно быстрого покидали. аСервис хотел улучшить свои показатели удобства, чтобы стать уверенным игроком на развивающемся рынке ИИ-планнеров путешествий и привлечь больше инвестиций.
🔸 Решение
Я провела интервью с пользователями и просмотрела записи пользовательских сессий: они показали, что люди не понимают, как пользоваться сервисом, так как интерфейс слишком сложный и запутанный. То же подтвердила составленная мною CJM. Дополнительно я провела анализ конкурентов и составила таблицы с лучшими практиками.
В исходном дизайне было много элементов с неочевидным значением (иконка замочка, тумблер AI-ассистента и др). Также, отсутствовала грамотная визуальная иерархия, из-за чего было не понятно, на что смотреть в первую очередь, а сам визуал казался нагруженным и безликим.
🔸 Решение
Я переработала визуальную иерархию так, что взгляд идет сверху-вниз по основным элементам и контроллам. Второстепенные функции скрыла в иконки с 3-мя точками. Убрала из хэдера кнопку переключения режима просмотра на карту, где её не найдут. Сделала табы переключения разделов в виде слов, а не иконок, чтобы точно было понятно, чего ожидать от соседних разделов. Для цепляющего визуала добавила яркое фото города, флаг страны, а нумерацию достопримечательностей сделала в виде воздушных шаров: получилась отличная “перекличка” с логотипом.
📈 Повторное исследование анализа записей пользовательских сессий и обратной связи показало, что удержание пользователей в первые сессии выросло с ~10% до ~60%.
🔸 Использование mobile-first подхода
Так как согласно статистике больше 80% пользователей сервиса заходят в него с мобильных устройств, я предложила взять за основу mobile-first подход. Поэтому сначала я разработала все мобильные интерфейсы, которые потом отлично легли и на десктоп. Это решение ускорило верстку десктопной версии в 2,5 раза.
🔸 Детализированные вайрфреймы
Прежде чем разрабатывать обновленный дизайн-концепт, я продемонстрировала улучшенную логику работы сервиса с помощью детализированных вайрфреймов.
🔸 Приложение
Я разработала дизайн для кросс-платформенного мобильного приложения. Взяла лучшее из веб-версии и добавила нижний бар, на котором в центре выделено ключевое действие — создание новой поездки.
Фирменные 2д иллюстрации отлично сочетаются с 3д плашками: дизайн получился ярким и запоминающимся.
Стартовый экран с регистрацией и авторизацией
Создание плана путешествий
Создание плана происходит в 3 шага: выбор локации, дат и интересов. Для пользователей без премиум подписки количество дней больше 3-х аккуратно подсвечивается иконками короны.
Настройки профиля и подписки
🔸 Дизайн новых разделов с нуля
Флоу добавления в маршрут локации с карты
Флоу оптимизации маршрута
Можно менять дни местами с помощью функции drag and drop, зафиксировать локацию, перенести её в другой день и изменить время пребывания в ней. Ко многим экранам я добавляю комментарии для разработчиков.
Для разработчиков я отмечаю зоны нажатия у кликабельных элементов, предусматривая достаточные отступы для удобства пользователя.
Онбординг
Для десктопной версии продуман онбординг из 6 шагов, где подсвечиваются основные элементы сервиса.
🔸 Маркетинговые материалы
Для сайта я создала несколько дизайн-концепций хиро-блока.
Соцсети
Для Инстаграма я разработала шаблоны обложек постов, которые подходят для разных тем и поддерживают фирменный брендинг.
Рекламные баннеры
Для рекламных кампаний я также подготовила несколько баннеров, которые можно в последующем переиспользовать.