KonceptProjekt koncepcyjny · festiwal muzyczny
ZGIEŁK: strona festiwalu z literami, które reagują na ruch.
To projekt pokazowy ALUK, nie zlecenie. Festiwal „ZGIEŁK” nie istnieje. Wymyśliłem go, żeby sprawdzić, ile ruchu zmieści strona wydarzenia, zanim zacznie przeszkadzać. Strona działa na zgielk.madebyaluk.pl. Taką stronę dla prawdziwego festiwalu wyceniam indywidualnie, po rozmowie i darmowym szkicu. Jak wyceniam.
01Założenia
Co zobaczysz na stronie.
Trzy dni muzyki i światła w starej cegielni. Tu decyduje emocja: artyści, data i bilet. Strona ma być głośna jak plakat. Mimo to w trzech krokach prowadzi do kupna.
Założenie: czerń, jeden kwaśny kolor i jedna magenta. Litery jako grafika. Własne zdjęcia tłumu i artystów, wideo na starcie. Program, miejsce i bilety czytelne bez JavaScriptu.
01Litery, które się ruszają.
Tytuł zajmuje całą szerokość ekranu. Każda litera pochyla się w stronę kursora. Gdy przewijasz, litery rozjeżdżają się i obracają.
02Pas, który przyspiesza.
Pas z hasłami przyspiesza i pochyla się, gdy szybko przewijasz. Potem wraca do spokojnego tempa. Ten sam pas jest w stopce.
03Artyści z obrazem za kursorem.
Wielkie nazwy artystów wjeżdżają od dołu. Po najechaniu wiersz się przesuwa, a za kursorem idzie zdjęcie z nazwą sceny. Na telefonie to zwykła lista.
04Cięcia, odliczanie, bilety.
Sześć zdjęć i słów zmienia się twardym cięciem, z krótkim błyskiem i licznikiem 01/06. Odliczanie do daty festiwalu działa na żywo. Trzy pule biletów, jedna z pieczątką rabatu.
02Prawdziwa strona
Jak zrobię to u Ciebie.
Prezentacja to zwykły HTML. Biblioteka animacji ładuje się z zewnętrznego serwera. Twoją stronę buduję tak, żeby łatwo było ją zmieniać i utrzymać.

Bilety u operatora
Strona wydarzenia bez logowania nie potrzebuje bazy danych. Buduję ją w Astro. Bilety sprzedaje operator, strona tylko do niego prowadzi. Animacje ruszają, gdy wczytają się fonty.
Fonty i ziarno u siebie
Fonty z polskimi znakami leżą na serwerze strony. Odstęp między wierszami nie ucina ogonków ą i ę. Efekt ziarna jak na kliszy to lekki plik, na telefonie jeszcze lżejszy.
Ruch z wyłącznikiem
Gdy ktoś wyłączył animacje w systemie, tytuł, artyści i cięcia stoją w gotowym stanie. Odliczanie działa dalej, bo to treść, nie ozdoba.
Telefon z połową efektów
Litery rozjeżdżają się mniej, sekcje są krótsze, pas się nie pochyla. Zdjęcie za kursorem jest wyłączone. Sprawdzam na ekranie 390 px.
03Zastosowanie
Dla kogo jest ten styl?
To najgłośniejszy z sześciu projektów i tak ma zostać. Wydarzenia, kluby i kultura sprzedają nastrój. Poza tym światem te same efekty odradzam.
Ten styl pasuje
- festiwale, kluby, koncerty, premiery kulturalne
- marki odzieżowe i krótkie premiery z limitowaną pulą
- kampanie z datą: odliczanie i pule biletów pomagają sprzedawać
Tu radzę inaczej
- prawnicy, kliniki, księgowość: żadnego z tych efektów
- sprzedaż firmom i programy w abonamencie: skaczące litery odbierają wiarygodność
- strony, na których czyta się dłuższe teksty
Fakty: tylko to, co zmierzyłem
Marka jest wymyślona. Nie ma sprzedaży ani zapytań, więc ich nie podaję.- Waga przy pierwszym wejściu (1600×1000, po ekranie ładowania)
- 1,5 MB
- Biblioteki animacji
- GSAP + Lenis
04Kontakt
Taka strona dla Twojej marki?
Napisz, co organizujesz i kiedy. Powiem wprost, ile tego ruchu ma sens u Ciebie. Potem dostaniesz zakres, termin i cenę.
- Szkic jest bezpłatny i do niczego nie zobowiązuje
- Raty 30%, 40% i 30%, pierwsza dopiero po akceptacji szkicu
- Domena i hosting na Ciebie, 30 dni poprawek po starcie
Zacznij od darmowego szkicu
Kilka zdań o firmie wystarczy, resztę dopytam. Odpisuję osobiście, tego samego dnia.
Zamów darmowy szkic Umów rozmowę online