Balansik

Klient

Balansik to polska marka napojów funkcjonalnych z adaptogenami – „smart drink” z charakterem, który mruga okiem do odbiorcy zamiast robić śmiertelnie poważny wellness. Marka sprzedaje w Polsce i buduje dystrybucję w Niemczech, dlatego od początku projektowaliśmy system dwóch witryn w dwóch językach: balansik.pl i balansik.de.

Strona główna balansik.pl na laptopie – hero Trzymaj Balansik

Wyzwanie

Marka lifestyle’owa żyje z pierwszego wrażenia. Strona musi wyglądać odważnie, płynnie się animować i mimo to ładować błyskawicznie na telefonie – bo tam ogląda ją większość odbiorców. Do tego dochodzi drugi rynek: witryna niemiecka ma mówić własnym głosem do swoich klientów, korzystać z tych samych komponentów i nie podwajać kosztów utrzymania.

Jest jeszcze pytanie, które kupujący zadaje najczęściej: „gdzie to dostanę?”. Odpowiedź musiała znaleźć się na stronie – konkretna, na mapie, z możliwością samodzielnej aktualizacji przez klienta.

Rozwiązanie

Autorski motyw komponentowy. Architektura oparta na komponentach (Twig + Vite): każda sekcja to element wielokrotnego użytku, wspólny dla obu rynków. Nowa podstrona to składanie z gotowych klocków.
Dwa języki, dwie domeny, jeden standard. balansik.pl i balansik.de działają jako osobne witryny na wspólnym systemie – treści niezależne, komponenty i jakość identyczne.
Interaktywna mapa punktów sprzedaży. Zbudowana na Leaflet, więc bez kluczy API i comiesięcznych opłat za mapy. Klient dodaje punkty z panelu; obok działa sekcja sklepów online.
Animacje bez podatku od wydajności. Przewijane animacje (GSAP/ScrollTrigger) i efekty pojawiania się sekcji – a mimo to Total Blocking Time wynosi 0 ms na obu witrynach.
Obrazy z automatycznego pipeline’u. WebP/AVIF generowane przy buildzie, bez ręcznego kompresowania.
Dostępność jako standard. Semantyczne komponenty, kontrast, obsługa klawiatury – Lighthouse ocenia obie witryny na 96/100.