Флоу проведения турнира по падел-теннису
Задачу выполняла в роли продуктового дизайнера в проекте Easy Padel в 2023 году.
О проекте
Easy Padel — это экосистема цифровых продуктов для падел-клубов и игроков. C помощью Easy клубы могут управлять бронированием кортов, отслеживать платежи за тренировки и организовывать турниры.
Задачей было максимально оперативно оптимизировать флоу проведения турниров и разработать удобный интерфейс.
Я провела серию интервью с пользователем Easy, чтобы погрузиться в специфику проекта и основные проблемы. Провела аудит предыдущего дизайна. Описала предполагаемые пользовательские действия на экранах и функциональные возможности платформы. Собрала прототип и написала спецификации. Разработала дизайн. Контролировала разработку, проводила ревью верстки и тестировала флоу.
Как решала задачу
Провела аудит предыдущего дизайна
У Easy уже был дизайн флоу проведения турнира, однако тесты показали, что пользователям там было сложно ориентироваться. Навигация была запутанной, было сложно разобраться в функционале.
Открыв раздел «Турниры», пользователя встречает пустота и отсутствие понимания что делать.
На этапе переклички много кнопок с разными стилями. Не понятно что важное, что второстепенное, на что обращать внимание и как тут всё работает.
На экране проведения турнира всё так же шумно и не понятно.
Заложила основу под дизайн-систему
Дизайн-системы не было, поэтому заложила основу под её создание — привела кнопки к общему стилю, создала компоненты, систему типографики, цветов, сеток и отступов. Сфокусировалась на упорядоченности и минимализме. Сделала приятный, простой и понятный интерфейс.
Упростила раздел «Турниры»
Навигацию разгрузили и упростили — панель-меню переехала наверх, а от сайд-бара вовсе отказались, так как он создавал лишнюю вложенность и путал пользователей. Теперь навигация простая и понятная — пользователю очевидно в каком разделе он находится.
В карточках турниров стало проще ориентироваться — на них появилась ключевая информация — теперь можно, не заходя в турнир, смотреть кто организатор, какой формат турнира, для какого он уровня игроков и на каких кортах запланирована тренировка.
Так же, добавили сортировку по запланированным турнирам, завершённым и отменённым, чтобы сотрудник клуба мог быстрее найти нужный турнир.
Упростила этап регистрации на турнир
Интерфейс этапа регистрации стал чистым и понятным — убрали лишние элементы, строуки и отступы. Основная информация по турниру отображается в шапке — так у тренера всегда перед глазами важная информация, категория турнира, количество игроков и дата и время проведения. По акцентной кнопке «Start roll-call» (в переводе с англ. — «начать перекличку») понятно, что, чтобы начать турнир, необходимо перейти к этапу переклички. Чтобы тренер мог отличать на игре пользователей, добавили цветных аватаров.
Упростила этап переклички
На этапе переклички достаточно нажать на крупный чекбокс на карточке с игроком, чтобы отметить его как участника турнира.
Пересобрала и упростила флоу проведения турнира
На основе интервью с пользователями пришли к выводу, что тренерам, при проведении турнира удобно, когда карточки идут вниз по вертикали, а не змейкой, как было в предыдущем дизайне.
На случай, если игроков много, добавили переключать «Hide who played», чтобы тренер мог быстрее находить тех, кому очки ещё не проставлены.
Слева на табах видно количество раундов и какой текущий — так тренеру проще рассчитывать время на игру.
Собрала Лидерборд
В ходе игры можно отслеживать лидерборд. Этот экран также доступен игрокам. Здесь можно отслеживать на сколько позиций игрок поднялся вверх или вниз по турнирной таблице, какое место занимает в общем списке игроков и видеть основные показатели игры — победы, поражения, ничьи и разница очков.
Посмотреть этот дизайн можно на сайте Падел.ру в разделе «Быстрая игра». Флоу игры создан по аналогии с макетами, описанными в данном кейсе.