Добавили новый интересный кейс 👉 https://whitebox1.io/cases/neos

Редизайн сайта по продаже билетов ФК «‎Сочи»

Данный редизайн был первым шагом футбольного клуба по обновлению своей экосистемы. Это наш первый кейс по работе со спортивными нишами, благодаря большому опыту в дизайне и разработке это не стало для нас проблемой и мы взяли проект.

Что не устраивало в старом сайте

  • Устаревший дизайн
  • Неудобство использования
  • Низкая скорость работы

Подготовка


Мы изучили ТЗ, предоставленное клиентом, выполнили грубый набросок, чтобы понять расположение логических блоков и объем работы и преступили к работе.

Дизайн


После подготовительного этапа мы детализировали наброски до полноценного чернобелого UX-макета, таким образом появилось большее понимание и у нас и у клиента, где должны находиться те или иные элементы.

1

Устранив все недочеты и слепые пятна в юзабилити мы приступили к разработке UI дизайна. Разработка дизайна велась с учетом существующих фирменных цветов и шрифтов с ориентиром на свежесть и понятность.

2

Теперь при выборе сектора и место пользователи видят расопложение их места относительно футбольного поля. Добавили быструю билетную корзину в правом нижнем углу, она дает больше прозрачности и понимания при покупке. У мест есть цветовая кодировка, которая помогает пользователю быстрее ориентироваться в ценовых категориях

3

Обновлению подвергя и личный кабинет болельщика. Теперь в нем легче ориентироваться и с легкостью можно получить доступ ко всем своим покупкам и бонусам.

Верстка и программирование


При работе над проектом верстальщик руководствовался тем, что сделанная им верстка пойдет в работу бэкэнд-разработчикам из другой команды, а потому должна быть понятной 
и легко встраиваемой. Интересным аспектом задачи была плотная работа с svg-схемой стадиона предоставленной заказчиком. Нужно было перекрасить стадион по секторам, добавить hover-бордеры, разбить некоторые сектора на дополнительные секции и к тому же адаптировать эту схему для мобильных устройств. Почти все эти задачи были решены на уровне css и не потребовали изменений в самой схеме. На выходе получили иделано вписавшуюся в дизайн интерактивную схему стадиона - удобную для взаимодействия с клиентом как в дексктопном формате, так и на мобильных девайсах.

Есть подобная задача?

WhiteBox будет рад взяться за нее!

ОСТАВИТЬ ЗАЯВКУ