Фанатский сервис для Crystal Palace: как мы создали многофункциональную веб-платформу футбольного клуба

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

Главная страница платформы Crystal Palace

Спортивные сервисы, рассчитанные под высокие пользовательские нагрузки и множество контента, за годы работы стали одной из наших специализаций. Например, летом мы рассказывали, как делали портал для гольф-турнира The Open. Кроме этого проекта были и другие – на одном из них сфокусируемся в этом материале.

Crystal Palace – это английский профессиональный футбольный клуб из Лондона, основанный в 1905 году. Сейчас выступает в Премьер-лиге, высшем дивизионе в системе футбольных лиг Англии.

Запрос

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

Crystal Palace нужно было повысить вовлечение болельщиков через веб-ресурс и сделать опыт его использования персонализированным, создать «прямой контакт» с клубом.

Измеримые результаты

  • На 40% увеличился доход клуба от покупки болельщиками членства.
  • На 78% увеличилось количество веб-сессий по сравнению с предыдущим решением.
  • Расходы на серверные мощности для обслуживания сервиса сократились в 10 раз.

Основа решения

Платформа футбольного клуба – это в первую очередь большое количество различного контента, который часто обновляется, и наплывы пользователей. Во время матчей публикуется множество статей, постоянно обновляется счет, а нагрузка в месяц достигает 2 млн пользователей, и основная часть визитов приходится на часы матчей.

Матч-центр на платформе Crystal Palace

Чтобы реализовать возможность быстрой обработки и выкладки контента, в гибридном режиме использовали Static site generation (SSG) и Client side rendering (CSR) – такой подход позволил выдерживать высокую нагрузку во время матчей и больших новостей, а также дал основу для хорошей SEO-оптимизации. Подробнее о том, какие подходы к отображению контента использовать для определенных нужд проекта, читайте в другой нашей статье.

Работа с контентом в админке портала должна была быть удобной. Для этих целей хорошо подходят готовые решения – digital experience платформы. Одну из них – InCrowd – мы использовали для Crystal Palace. Вместе с ней интегрировали CRM-систему, через которую реализовывалась функциональность регистрации и логина для пользователей.

Фронтенд и бекенд реализовали на Next.js. С этим стеком сократили расходы на серверы в 10 раз.

Интеграции и единый логин

Для полноценной работы платформы требовалось интегрировать основной веб-ресурс с контентом и регистрацией пользователей с другими системами. Среди них, например стриминговая платформа, интеграция с которой позволила создать раздел PalaceTV, где в реалтайме можно смотреть матчи или пересматривать хайлайты из уже сыгранных.

Страница PalaceTV

Нашей задачей было встроить в веб-сервис трансляции, которые организуются партнером клуба. Видео-команда, отвечающая за прямые трансляции и нарезки, работает как бы «на другой стороне», но все, что они делают, отображается на портале Crystal Palace благодаря интеграции. Видеоплееры ограничены – избранный контент доступен только для зарегистрированных пользователей. Это ограничение работает на вовлечение и позволяет клубу узнать больше о своих фанатах.

Crystal Palace Shop и Ticket Hub

Другая интеграция – Shop — это также отдельная платформа, позволяющая делать покупки, интернет-магазин. Его мы не разрабатывали самостоятельно, а интегрировали в платформу. Точно так же, как и раздел для покупки билетов – разработка его функциональности не была нашей задачей.

Эти интеграции сами по себе – удобство для пользователей, но помимо их подключения мы реализовали доступ к ним «в одно касание» – single sign on. То есть пользователю достаточно залогиниться только на портале Crystal Palace, чтобы автоматически получить доступ ко всем интегрированным в него сервисам. Даже несмотря на то, что каждый из них – отдельная система.

Персонализация

Single sign-on работает и на благо пользователям, и на пользу Crystal Palace. У клуба есть реклама (своя и спонсоров), которая показывается на страницах их платформы. Отображается она не рандомно для каждого пользователя, а исходя из его поведения на ресурсе. Механизм отображения рекламы работает согласно особой логике, основанной на том, что каждый зарегистрированный болельщик делал на платформе за последнее время.

Меню портала и окно логина/регистрации

Нашей задачей для реализации этих рекламных возможностей было встроить в этот механизм статическую генерацию контента. То есть, в целом платформа работает на гибриде из Static site generation (SSG) и Client side rendering (CSR) – на этой базе генерируются все страницы портала. А для персонализированной рекламы мы добавили дополнительный слой клиентского рендеринга, который работает отдельно и как бы поверх остального контента на странице, при этом подтягивая данные из CRM с данными пользователя.

Страница команд Crystal Palace и информационная страница одного из игроков

Кроме того, на платформе есть эксклюзивный контент, который доступен после регистрации и/или приобретении платного членства. Эти особенности, благодаря single sign-on также влияют на персонализацию.

Так получилось сделать единый источник всей возможной информации о деятельности клуба, который объединяет и фанбазу Crystal Palace, позволяя получать контент самым быстрым образом. Полноценное создание платформы заняло у нас около 9 месяцев, включая аналитику и фазу активной разработки.

0
3 комментария
Andrey Stepanov

Вау - круто! Мое почтение!

Ответить
Развернуть ветку
fuse8 IT-продукты для бизнеса
Автор

💪🏻

Ответить
Развернуть ветку
Anton Permyakov

Класс, спасибо за кейс! Интересный подход к размещению рекламы - можно подробнее объяснить как именно поведение пользователя влияет на то, что ему показывается? Управляют ли этим процессом в отделе маркетинга Crystal Palace или эта логика "вшита" раз и навсегда в разработанное решение?
И вообще, как отдел маркетинга CP работает с данными по фанатской базе - у них есть какой-то дашборд или что-то подобное?

Ответить
Развернуть ветку
0 комментариев
Раскрывать всегда