Сайт Baku City Circuit
Задача
Сайт этапа Гран‑при Формулы‑1 в Азербайджане, одного из важнейших событий как для мира автоспорта, так и для туристической сферы принимающей страны.
Погрузиться в невероятную атмосферу драйва и скорости, превышающей зачастую отметку в 300 км/ч, и полностью спланировать свои гоночные выходные в рамках одного сервиса — то, что должно быть доступно для каждого фаната «королевских гонок».
Награды
Технологии
Gulp
Sass
Webpack
Easel JS
TweenJS
Three.js
Yii 2 Framework
MySQL
Data Import
Data Export
Интеграции
iTicket.UZ
Аналитика
Проведение Гран‑при Формулы‑1 в Баку важно не только с точки зрения спорта, но и как направление развития событийного туризма.
Проектирование
Формула‑1 — это, в первую очередь, особая атмосфера, которую нам важно было передать. С главной страницы мы ведем пользователя в раздел «Как это было в 2016», где он может оценить масштаб и уникальность события.
Имея представление о программе гоночного уикенда в Баку, пользователь может выбрать лучшую трибуну, забронировать ближайший к ней отель и приобрести билеты в разделе «Купить».
Составить свою уникальную программу тем, кто уже купил билеты, поможет интерактивный «Гид по гонке» — в этом разделе собрана полезная информация об инфраструктуре мероприятия, расписании гонки и развлекательной программе, а также полезные советы для туристов.
Одна из бизнес‑задач события и сайта — привлечение туристов в Азербайджан. Уникальная культура, исторические и природные достопримечательности Страны огней также заслуживают особого внимания — увидеть, насколько интересным может быть путешествие по Азербайджану, пользователи могут на трехмерной карте.
Для тех, кто привык к стремительному темпу, мы собрали ключевую информацию из всех разделов на главной странице сайта — один скролл вниз — и все самое важное уже на экране.
Концепция | Полное погружение
Скорость с первых секунд — на главной странице пользователь видит несущийся на фоне главных достопримечательностей Баку болид. Анимация создает динамику и ощущение трехмерности изображения.
Ваше место на гонке
Наблюдать за полосой разгона или следить за болидами, несущимися по старому Баку, поселиться неподалеку от трассы или отдохнуть от шума гонки, купить сувениры и перекусить между заездами — всю необходимую информацию можно найти на интерактивной карте трассы в разделе «Гид по гонке».
Благодаря фильтру по типу объектов пользователи могут быстро найти нужную трибуну или отель и перейти в его карточку, чтобы увидеть подробную информацию. В мобильной версии сайта на карте также можно увидеть расстояние от места, где находится пользователь, до выбранного объекта.
Поскольку раздел должен помочь не только подготовиться к гонке, но и не затеряться в гуще событий во время ее проведения, мы начали с создания его мобильной версии. 95% пользователей зашли сюда именно с мобильных устройств.
Карта
Для создания головокружительной трехмерной карты Азербайджана и Баку мы использовали спутниковые снимки и градиентную карту высот. Благодаря технологии Displacement mapping, которая позволяет за счет градиентной карты высот формировать рельеф в 3D — чем светлее точка на изображении, тем сильнее выдвигается это место на объекте. При этом камера плавно опускается в процессе прокрутки.
Для реализации технологии мы разработали собственные решения, которые работают не только в десктопной, но и в мобильной версии.
Онлайн-витрина
В разделе Shopping посетители могут приобрести билеты на гонку, забронировать номер в гостинице, заказать сувениры и сделать другие необходимые покупки.
На сайте можно детально изучить каждое предложение, например, ознакомиться с интерактивной панорамой трассы и выбрать подходящую трибуну.
В любой комплектации
Мы понимали, что во время гонки больше половины трафика будет со смартфонов и тщательно проработали мобильную версию. Все страницы сайта отображаются корректно и все функции работают на любых мобильных устройствах. Чтобы пользователи успели получить максимум впечатлений за короткий гоночный уикенд.