Przejdź do treści

Katalog wanien marki Promocja SPA

Strona marki, która sprzedaje wanny SPA przez koszyk zapytań, a nie przez płatność online. Zbudowaliśmy katalog 7 modeli w 4 liniach po polsku i chińsku oraz salon wystawowy, w którym wanna i balia rozkładają się w 3D na części — a woda, którą widzisz w tle, to własne shadery WebGL liczone na żywo w Twojej przeglądarce.

Wersja robocza · 43 strony po polsku i chińsku · stan na 11.10.2026

Wizualizacja z kodu strony: wanna z cząstek, w której jasne punkty to dysze z kart produktów — od 27 w linii Signature do 172 w linii Royal.

Co klient znajdzie na stronie

Strona prowadzi do jednej rzeczy: zapytania o konkretny model. Wszystko inne — salon, katalog, woda w tle, bony — ma budować zaufanie przed tą decyzją.

Salon wystawowy

Wszystkie 7 modeli pod reflektorami, w jednej skali z wymiarów kart, z tabliczką: wymiary, dysze i cena. Obok detale z bliska i wieczorny rytuał, w którym przewijanie zamienia dzień w noc.

Wanna i balia od środka

Rozbiór 3D w rytm przewijania: prześwietlenie, szkielet i części osobno. Liczby przy częściach pochodzą z karty technicznej, a każdy model ma własny rozbiór na swojej karcie.

Katalog w 4 liniach

7 modeli w liniach Signature, Premium, Executive i Royal. Karta modelu: wizualizacja 3D, rzut z dyszami i rysunek wymiarów, parametry i porównanie z sąsiednim modelem.

Woda z własnego kodu

4 sceny WebGL bez bibliotek: światło na dnie basenu, bąbelki, wanna i napisy z cząstek. Grają tylko wtedy, gdy są na ekranie.

Polski i chiński

Ten sam salon, katalog, blog i formularze także po chińsku — z przełącznikiem języka w nagłówku.

Dla obiektów noclegowych

Kalkulator liczy dodatkowy przychód z dopłaty za SPA wyłącznie z liczb właściciela. Do tego bony sprawdzane skanerem QR w przeglądarce i strona zakończonego konkursu z bonem 10 000 zł dla obiektu.

Zobacz, jak działa wersja robocza

Pełna kopia bieżącej wersji roboczej — z salonem, rozbiorem 3D, wodą WebGL i katalogiem. Budujemy ją wprost z plików projektu przy każdym wdrożeniu xtn.pl. Formularze w podglądzie niczego nie wysyłają.

Od linii do zapytania

Bez kasy i bez zakładania konta. Klient porównuje, zbiera modele i pisze jedno zapytanie — zespół odpowiada z konkretną ofertą.

  1. Wybór linii

    Wanna z cząstek dorasta o dysze: 27 → 60 → 88 → 172 — tyle, ile mają karty produktów w kolejnych liniach. W katalogu każda linia ma własną strefę.

  2. Karta modelu

    Wizualizacja 3D, rzut z dyszami, rysunek wymiarów i cena z linią Omnibus. Niżej rozbiór modelu i porównanie z sąsiadem wiersz w wiersz.

  3. Koszyk zapytań

    Kilka modeli w jednym zapytaniu. Licznik w nagłówku pokazuje, ile ich jest — bez płatności i bez konta. O jeden model można zapytać od razu z jego karty.

  4. Formularz w 4 krokach

    Sprawa, szczegóły, kontakt i podsumowanie przed wysłaniem. Szkic pamięta sprawę i treść, ale nie zapisuje danych osobowych.

Chcesz sprzedawać przez zapytania?

Zbudujemy katalog, w którym klient sam zbiera modele i pisze jedno konkretne zapytanie. Pierwsza konsultacja 0 zł.

Dwanaście widoków wersji roboczej

Prawdziwe zrzuty z kopii, którą budujemy wprost z plików projektu — zrzuty z 11.10.2026. Kopia pod „Zobacz na żywo” odświeża się przy każdym wdrożeniu, więc na żywo zobaczysz bieżącą wersję. Kliknij — otworzysz to miejsce w nowej karcie.

Panel klienta w budowie

Zbudowany i przetestowany lokalnie, jeszcze niewdrożony — dlatego w kopii roboczej przycisk „Zaloguj się” prowadzi tutaj. Wzorowaliśmy go na panelu klienta XTN.

  • Bony

    Bon z beneficjentem, wydruk A5 z logo i kodem QR, realizacja w panelu i na stronie z jednej bazy.

  • Gwarancje

    Pozycje z okresami wpisanymi przez zespół, dokumenty i zgłoszenia serwisowe ze zdjęciami.

  • Zamówienia

    Pięć etapów: przyjęcie, przygotowanie, transport, dostawa z montażem i odbiór.

Maile do klientów są domyślnie wyłączone — włącza się je ręcznie w ustawieniach panelu. Testy: rdzeń 36/36, moduły 16, 15 i 14, API bonów 124/124, pełny scenariusz 22/22.

Jak to zbudowaliśmy

Od landingu z jacuzzi do salonu z rozbiorem 3D, wodą WebGL, konkursem i bonami — w etapach, z testami przy każdym z nich. Liczby policzone w plikach projektu, stan na 11.10.2026.

32 186
linii kodu strony: komponenty Astro, style, skrypty i silnik rozbioru 3D — bez kodu bibliotek
22 + 21
strony po polsku i po chińsku w wersji roboczej
4
sceny WebGL z własnych shaderów — grają tylko w kadrze
120/120
testów serwera bonów — z 10–14 równoczesnych prób realizacji tego samego bonu udaje się dokładnie jedna

Etapy

  1. Pierwsza wersja

    Landing z jacuzzi, katalog i blog po polsku i chińsku — jeszcze pod nazwą „Promocja Wellness”.

  2. Woda i miedź

    Przebudowa: ciepła paleta, własne sceny WebGL, karta modelu z rysunkiem technicznym. Na promocjaspa.pl od 9 października 2026.

  3. Nowa nazwa, bony i panel

    Marka „Promocja SPA”, konkurs, bony z QR, formularz w 4 krokach i panel klienta. Trzy przeglądy konkursu, bonów i formularza dały 51 uwag; wszystkie poprawione.

  4. Salon wystawowy

    Ekspozycja modeli, detale z bliska, wieczorny rytuał i rozbiór 3D wanny i balii. Wersja robocza z tym wszystkim czeka na wgranie.

Technologie

Strona
Astro 5 — gotowe strony HTML w dwóch językach, budowane z plików projektu
Woda
WebGL z własnymi shaderami, bez bibliotek: kaustyka, bąbelki, wanna i napisy z cząstek
Rozbiór 3D
Biblioteka three.js 0.170.0 (licencja MIT) i nasz silnik na niej: wanna i balia rozkładane w rytm przewijania. Bez WebGL i przy ograniczonym ruchu — cztery nieruchome klatki z podpisami
Wizualizacje
Rendery modeli i pętle wideo z tego samego silnika 3D; klipy ze stocku są na stronie podpisane jako ujęcia poglądowe
Ruch
GSAP z ScrollTrigger i Lenis — trzymane na serwerze strony, bez zewnętrznych CDN
Formularze
PHP: zapytania i kontakt idą mailem, bony sprawdza własne API
Panel
PHP 8.4 i SQLite, wzorowany na panelu klienta XTN

Stan projektu

Na promocjaspa.pl od 9 października 2026 działa wersja „woda i miedź” — jeszcze pod nazwą „Promocja Wellness”. Wersja robocza z nową nazwą, salonem 3D, konkursem, bonami i formularzem czeka na wgranie, dlatego tutaj pokazujemy ją jako kopię zbudowaną wprost z plików projektu i odświeżaną przy każdym wdrożeniu xtn.pl. Ceny w katalogu są przykładowe.

Chcesz taką stronę dla swojej marki?

Zaprojektujemy i zbudujemy ją z animacjami, katalogiem i formularzami — klikalny prototyp zobaczysz, zanim zapłacisz.

Rozmowa

Porozmawiajmy o Twojej stronie

Napisz, co sprzedajesz i komu — odpowiadamy w ciągu 24 godzin.

Pora dnia
Podaj imię (min. 2 znaki).
Podaj poprawny adres e-mail.

Administratorem danych jest Sellz Prosta Spółka Akcyjna z siedzibą w Warszawie (KRS 0001087452), kontakt: office@xtn.pl. Dane z formularza przetwarzamy wyłącznie po to, żeby umówić rozmowę i odpowiedzieć na zapytanie (art. 6 ust. 1 lit. b i f RODO) — przez czas rozmów, a przy współpracy przez czas umowy i okres przedawnienia roszczeń. Masz prawo dostępu do danych, ich sprostowania, usunięcia, ograniczenia przetwarzania, sprzeciwu oraz skargi do Prezesa UODO.

Formularz chroniony przed botami — bez cookies i zewnętrznych usług.

Nie udało się wysłać. Spróbuj ponownie albo napisz na office@xtn.pl.

Zobacz pozostałe realizacje XTN

Wśród nich agent AI do ofertowania, platforma B2B, Kokpit SEO, strona produktu SEOLDIER i asystent głosowy Meduza Copilot — każda pokazana od kuchni.