Огляд проєкту
Hagemann Eventer — це норвезький організатор подій із Svelvik у регіоні Buskerud. Бізнес здебільшого фокусується на забігах, марафонах і лижних гонках, але бренд також має сильний роковий і металевий вплив, який відчутно позначається на способі просування подій.
До появи цього сайту організатор переважно покладався на Facebook і Instagram для презентації забігів та посилань на реєстрацію. Новий сайт мав набагато більше нагадувати повноцінну платформу для подій: зі своєю впізнаваністю, власною структурою подій та кращим способом показувати забіги з плином часу.
З точки зору дизайну напрямок навмисно був більш виразним, ніж типовий спортивний сайт. Бриф тяжів до рокової та металевої візуальної мови, ближчої до сайту гурту, ніж до звичайного шаблону для легкої атлетики. Я розробив початкову структуру сторінок і стилістичний напрям, а пізніше до проєкту долучився окремий дизайнер, який допрацював картки подій, типографіку та низку дрібніших деталей у секціях.
Виклик
У проєкту було два справжні виклики. Перший — візуальний: створити сайт про забіги, який усе ще виглядає енергійно, брендовo й трохи важче за тоном, ніж типовий дизайн для спорту на витривалість.
Другий виклик був набагато технічнішим: інтегрувати RACE RESULT у WordPress так, щоб не доводилося вручну збирати сторінки подій щоразу, коли створюється новий забіг.
RACE RESULT — це насамперед платформа для керування подіями й таймінгу забігів. Її використовують для реєстрації, списків учасників, результатів, live timing і всього робочого процесу навколо змагань. Їхній стандартний підхід до інтеграції із сайтом значною мірою спирається на JavaScript-вставки, що зручно для розміщення окремих модулів на сторінці, але неідеально, якщо потрібно, щоб саме WordPress працював як структурований каталог подій з архівами, фільтрами та окремими індексованими сторінками.
Проблема інтеграції
На перший погляд очевидний шлях виглядав так: використовувати код вставки буквально за призначенням, створювати подію у RACE RESULT, копіювати JavaScript-фрагмент і вставляти його у сторінку WordPress. Але це створює багато ручної роботи й не дає сайту повноцінної власної системи подій.
Я витратив час на спілкування з підтримкою RACE RESULT і перегляд їхньої документації. Мій висновок на той момент був таким: їхній офіційний REST API не проєктувався для синхронізації списку подій на стороні сайту. Він більше орієнтований на комунікацію з інфраструктурою RACE RESULT, як-от декодерами та суміжними системами таймінгу, а не на роль простого API контенту для публікації подій.
Отже, мені було потрібне розумніше рішення всередині WordPress.
Плагін Raceresult Integration
Найбільша частина цього проєкту — власний плагін Raceresult Integration, який я створив. Його завданням було перетворити зовнішні дані про забіги у структурований контент WordPress.
Замість того щоб сприймати кожен забіг як окрему вручну зібрану сторінку, плагін формує повноцінну систему подій усередині WordPress:
- окремий тип записів для подій
- таксономії для типу події, місяця, року й дистанції
- додаткові поля для дати, місця, ліміту часу та іншої інформації про забіг
- налаштування для ручної синхронізації та автоматичної частоти оновлення
- шорткоди для реєстрації, списків учасників, результатів, live timing і вкладок на сторінці події
Найважливіша частина — автоматизація. Плагін читає вебендпоінт RACE RESULT і витягує список ідентифікаторів подій із конкретного акаунта або групи подій. Згідно з налаштованим розкладом він перевіряє зміни й тримає WordPress синхронізованим із цим джерелом. Якщо в RACE RESULT з’являється нова подія, вона може автоматично створитися у WordPress. Якщо подія зникає з джерела, її можна перевести в чернетку або видалити залежно від обраної поведінки.
Це означало, що ми й далі використовували JavaScript-модулі RACE RESULT там, де це доречно, але в значно масштабованішій формі. Нові забіги більше не вимагали вручну створювати окремі сторінки, вставляти код і знову організовувати архіви та фільтри.
Сторінки подій і фронтенд-структура
Після того як дані про події опинилися всередині WordPress, решта сайту змогла працювати як справжня платформа для подій, а не як набір розрізнених сторінок.
Я створив шаблони для карток подій, які одразу показують найважливішу інформацію: назву, головне зображення, дату і деталі забігу. Кожна картка має кнопку Learn more і Register. Якщо подія вже завершилася, кнопка реєстрації автоматично приховується.
Сторінка архіву наповнюється динамічно з типу записів подій і має фільтри за роком, категорією та пов’язаними метаданими забігу. Це зробило сайт значно зручнішим у користуванні, ніж вручну підтримуваний список сторінок, а також дало сильнішу SEO-основу, бо кожна подія могла існувати як окрема індексована сторінка з власними метаданими через The SEO Framework.
Результат
Фінальний сайт дав Hagemann Eventer щось значно сильніше за промосторінку. Тепер це брендована платформа для подій із власними архівами, фільтрами та сторінками забігів, яка при цьому залишається підключеною до системи RACE RESULT для реєстрації й таймінгу.
Для мене цей проєкт особливий тим, що головна цінність була не лише в дизайні чи складанні сторінок. Вона полягала в тому, щоб закрити розрив між зовнішньою платформою керування забігами й WordPress-сайтом так, щоб зменшити ручну роботу, покращити структуру і зробити сайт схожим на справжній продукт, а не на набір вставок усередині сторінок.
