MayaLav
Opis projektu
Premium landing page dla generalnego wykonawcy. Glassmorphism nawigacja, integracja modelu 3D WebGL, animowany marquee i animacje scroll-reveal — zbudowane bez żadnych frameworków.
Wyzwanie
MayaLav — generalny wykonawca — potrzebował strony, która natychmiast komunikuje jakość i profesjonalizm. Branża budowlana słynie z przestarzałej, niedbałej obecności w sieci. Celem było wyraźne wyróżnienie się: marka wyglądająca tak samo premium jak realizowane przez nią prace.
Ograniczenie: bez CMS-a, bez ciężkiego frameworka, bez kosztów utrzymania. Strona musiała być szybka, samodzielna i wizualnie efektowna — z zerowymi zależnościami runtime poza jednym tagiem skryptu.
Rozwiązanie
Zaprojektowałem i zbudowałem całą stronę jako ręcznie pisany plik HTML/CSS/JS. Nawigacja używa glassmorphism — backdrop-filter: blur() — dla efektu matowego szkła, który pozostaje czytelny na każdym tle. Animowany ticker marquee przewija listę usług w sposób ciągły, komunikując zakres działalności bez zaśmiecania hero.
Hero integruje komponent WebGL <model-viewer> z interaktywnym modelem 3D — dające natychmiastowe wrażenie "to jest coś innego" już przy załadowaniu. Wszystkie sekcje treści używają rozłożonych w czasie animacji CSS scroll-reveal z dokładnie dobranymi krzywymi cubic-bezier.
System kolorów: wyraźny czerwony akcent (#c0392b) na tle ciepłych szarości kamiennych. Pewny siebie, premium i niepodobny do żadnej innej strony wykonawcy na rynku.