Neon-nights
Односторінковий промо-лендинг NEON NIGHTS 2026 — триденного електронного фестивалю в берлінському Темпельгофі (14–16 серпня 2026, 5 сцен, 50 артистів, 36 000 глядачів). Розробка з нуля: концепція, UX/UI-дизайн та
фронтенд-реалізація.
Сайт побудовано як React SPA з важкими GSAP-анімаціями (ScrollSmoother + ScrollTrigger), відеофонами та плавним інерційним скролом. Темна неонова естетика, лазерні відблиски, кінематографічна типографіка та лаконічний
англомовний копірайт у стилі чуттєвого маніфесту («Three nights. Five stages. One frequency.») формують образ великого європейського техно-фестивалю рівня Awakenings / Time Warp.
Скрол-сторітелінг, анімовані переходи між сценами вечора та інтерактивний leveling форми — все працює на емоцію «занурення в ніч».
Реалізовано:
- Hero-секція з пульсуючим логотипом NEON NIGHTS, датами Aug 14–16, локацією Tempelhof, Berlin та маніфестом «The city goes dark so the lights can speak — and you'll feel every hertz»
- Двоканальний CTA (Get tickets / See the lineup) з мікроанімаціями ховера
- Блок Headliners — три дні, троє хедлайнерів на день: BICEP / OVERMONO (Fri), JAMIE XX / PEGGY GOU (Sat), BONOBO / FOUR TET / ODESZA (Sun)
- Сюжетна секція «A night, mapped / How it unfolds» — чотири фази одного вечора з атмосферними описами: Arrival & sundown → Melodic warm-up → Headliner → Deep techno till dawn
- Блок квитків Pick your pass з трьома тарифами (1-Day €69 / 3-Day €159 / VIP €349), бейджами «Most popular» та «Tier 1 almost gone», переліком переваг (Re-entry, Fast-lane entry, Elevated viewing decks, Free locker +
cup deposit)
- FAQ-секція Questions, answered (локація і шатли від Alexanderplatz, re-entry, ресейл до 48 год, age limit, accessibility, getting there)
- Фінальний емоційний блок «36,000 people. Three sunrises. One ticket between you and the best weekend of the year» з кікером «Don't watch the clips. Be in them.»
- Інтерактивна форма бронювання з кастомною валідацією (full name, email, phone 10–15 digits, Pick 1–6 quantity), станами помилок та success-екраном «You're in!»
- Футер із соцмережами (Instagram, TikTok, Spotify) та сабблоком «Demo · Obliko»
- Повністю адаптивна верстка з оптимізацією анімацій під prefers-reduced-motion та touch-пристрої
Стек: React, GSAP (ScrollSmoother, ScrollTrigger, Observer), Vite-білд, кастомні motion-композиції, адаптивний CSS.
фронтенд-реалізація.
Сайт побудовано як React SPA з важкими GSAP-анімаціями (ScrollSmoother + ScrollTrigger), відеофонами та плавним інерційним скролом. Темна неонова естетика, лазерні відблиски, кінематографічна типографіка та лаконічний
англомовний копірайт у стилі чуттєвого маніфесту («Three nights. Five stages. One frequency.») формують образ великого європейського техно-фестивалю рівня Awakenings / Time Warp.
Скрол-сторітелінг, анімовані переходи між сценами вечора та інтерактивний leveling форми — все працює на емоцію «занурення в ніч».
Реалізовано:
- Hero-секція з пульсуючим логотипом NEON NIGHTS, датами Aug 14–16, локацією Tempelhof, Berlin та маніфестом «The city goes dark so the lights can speak — and you'll feel every hertz»
- Двоканальний CTA (Get tickets / See the lineup) з мікроанімаціями ховера
- Блок Headliners — три дні, троє хедлайнерів на день: BICEP / OVERMONO (Fri), JAMIE XX / PEGGY GOU (Sat), BONOBO / FOUR TET / ODESZA (Sun)
- Сюжетна секція «A night, mapped / How it unfolds» — чотири фази одного вечора з атмосферними описами: Arrival & sundown → Melodic warm-up → Headliner → Deep techno till dawn
- Блок квитків Pick your pass з трьома тарифами (1-Day €69 / 3-Day €159 / VIP €349), бейджами «Most popular» та «Tier 1 almost gone», переліком переваг (Re-entry, Fast-lane entry, Elevated viewing decks, Free locker +
cup deposit)
- FAQ-секція Questions, answered (локація і шатли від Alexanderplatz, re-entry, ресейл до 48 год, age limit, accessibility, getting there)
- Фінальний емоційний блок «36,000 people. Three sunrises. One ticket between you and the best weekend of the year» з кікером «Don't watch the clips. Be in them.»
- Інтерактивна форма бронювання з кастомною валідацією (full name, email, phone 10–15 digits, Pick 1–6 quantity), станами помилок та success-екраном «You're in!»
- Футер із соцмережами (Instagram, TikTok, Spotify) та сабблоком «Demo · Obliko»
- Повністю адаптивна верстка з оптимізацією анімацій під prefers-reduced-motion та touch-пристрої
Стек: React, GSAP (ScrollSmoother, ScrollTrigger, Observer), Vite-білд, кастомні motion-композиції, адаптивний CSS.