Редизайн сайта по продаже билетов ФК «Сочи»
Данный редизайн был первым шагом футбольного клуба по обновлению своей экосистемы. Это наш первый кейс по работе со спортивными нишами, благодаря большому опыту в дизайне и разработке это не стало для нас проблемой и мы взяли проект.
Что не устраивало в старом сайте
- Устаревший дизайн
- Неудобство использования
- Низкая скорость работы
Подготовка
Мы изучили ТЗ, предоставленное клиентом, выполнили грубый набросок, чтобы понять расположение логических блоков и объем работы и преступили к работе.
Дизайн
После подготовительного этапа мы детализировали наброски до полноценного чернобелого UX-макета, таким образом появилось большее понимание и у нас и у клиента, где должны находиться те или иные элементы.
Устранив все недочеты и слепые пятна в юзабилити мы приступили к разработке UI дизайна. Разработка дизайна велась с учетом существующих фирменных цветов и шрифтов с ориентиром на свежесть и понятность.
Теперь при выборе сектора и место пользователи видят расопложение их места относительно футбольного поля. Добавили быструю билетную корзину в правом нижнем углу, она дает больше прозрачности и понимания при покупке. У мест есть цветовая кодировка, которая помогает пользователю быстрее ориентироваться в ценовых категориях
Обновлению подвергя и личный кабинет болельщика. Теперь в нем легче ориентироваться и с легкостью можно получить доступ ко всем своим покупкам и бонусам.
Верстка и программирование
При работе над проектом верстальщик руководствовался тем, что сделанная им верстка пойдет в работу бэкэнд-разработчикам из другой команды, а потому должна быть понятной и легко встраиваемой. Интересным аспектом задачи была плотная работа с svg-схемой стадиона предоставленной заказчиком. Нужно было перекрасить стадион по секторам, добавить hover-бордеры, разбить некоторые сектора на дополнительные секции и к тому же адаптировать эту схему для мобильных устройств. Почти все эти задачи были решены на уровне css и не потребовали изменений в самой схеме. На выходе получили иделано вписавшуюся в дизайн интерактивную схему стадиона - удобную для взаимодействия с клиентом как в дексктопном формате, так и на мобильных девайсах.