Od dyscypliny do treningu.
Kame Gym · Next.js + WordPress
- podstron
- 46
- grafik i karnety
- WodGuru
- ścieżki zapisu
- Pomiar
Schemat zakresu realizacji · nie jest nagraniem strony
Realizacja · Kame Gym Wrocław
Kame Gym Wrocław - strona klubu sportów walki, która zapisuje na trening
Zbudowaliśmy dla wrocławskiego klubu Kame Gym nową stronę od zera: 46 podstron w Next.js, osobna strona dla każdej dyscypliny i grupy treningowej, grafik zajęć i zakup karnetów podpięte na żywo do systemu WodGuru, komplet danych strukturalnych i analityka mierząca każdy zapis. Zamiast ciężkiej instalacji WordPressa z builderem - lekki front na Vercelu i WordPress zostawiony wyłącznie do prowadzenia bloga przez klub.
Film
Strona Kame Gym w 40 sekund
Przejście przez stronę tak, jak widzi ją nowy klient klubu: od pierwszego ekranu, przez ofertę i zajęcia dla dzieci, po zapis na darmowy trening. Na telefonie zobaczysz wersję mobilną.
46
wygenerowanych podstron
Statyczny front na Vercelu, budowany z jednego źródła treści.
19
stron ofertowych
Osobna strona dla każdej dyscypliny i grupy treningowej.
19
przekierowań 301
Stare adresy prowadzą do nowych - bez utraty widoczności.
12
typów danych strukturalnych
Od ExerciseGym i FAQPage po Event i BlogPosting.
Klient
Klub sportów walki z Wrocławia
KAME GYM sp. z o.o., ul. Nyska 61A we Wrocławiu - MMA, boks, kickboxing, BJJ, zapasy, judo i taekwondo, od zajęć dla dzieci po trening zawodniczy. Zakres współpracy: projekt i budowa strony od zera, SEO techniczne i lokalne, GEO, integracja systemu rezerwacji oraz analityka. Od umowy do przekazania projektu: 23.07.2026 - 10.08.2026.
Wyzwanie
Strona działała, ale nie sprzedawała
Klub miał witrynę na WordPressie z Elementorem i motywem OceanWP. Audyt, który wykonaliśmy przed startem współpracy, pokazał konkretne braki.
| Obszar | Stan zastany |
|---|---|
| Szybkość | TTFB 2,12 s, ~187 KB samego HTML, 40 plików CSS, 58 skryptów JS |
| SEO | brak meta description, brak Open Graph, brak danych strukturalnych, H1 na stronie głównej brzmiał „Najnowsze wpisy z bloga” |
| Bezpieczeństwo | brak HSTS, CSP, X-Frame-Options, X-Content-Type-Options, Referrer-Policy, Permissions-Policy |
| Treść | podstrona /kontakt zwracała 404, brak godzin otwarcia, brak cennika, pusta sekcja opinii |
| Konwersja | brak jednej czytelnej ścieżki do darmowego treningu, brak sekcji Zawodnicy i Nasze historie |
| Obrazy | puste atrybuty alt, brak WebP/AVIF |
Do tego dochodził realny problem biznesowy: klub prowadzi zapisy i sprzedaje karnety w WodGuru, a strona żyła obok tego systemu zamiast do niego prowadzić.
Co zrobiliśmy
Siedem obszarów prac
Od architektury treści pod frazy lokalne, przez integrację z systemem klubu, po analitykę, która pokazuje koszt jednego zapisu.
Makieta ścieżki zapisu. Dyscypliny i godziny służą demonstracji, nie są aktualnym grafikiem zajęć.
Animacja: wybór dyscypliny filtruje grafik zajęć, wybrany termin otwiera kartę zapisu, a zapis zostaje potwierdzony. Grafik i karnety działają przez WodGuru.Architektura treści pod SEO lokalne
Zamiast jednej zbiorczej strony „Oferta” zbudowaliśmy 19 osobnych stron ofertowych - po jednej na dyscyplinę i grupę: MMA, boks, kickboxing, BJJ, zapasy, judo dla dzieci, taekwondo, Kame Fight Women, gimnastyka korekcyjna, trening personalny, urodziny dla dzieci i pozostałe. Każda ma własną frazę lokalną, własny title, meta description i H1, zgodnie z przygotowaną wcześniej architekturą SEO - tabela fraza, URL i nagłówki była jednym źródłem prawdy. Analiza konkurencji w SERP Wrocław (Puncher, Klub Samuraj, Wrox, Champion) pokazała, że nikt z nich nie ma na stronie głównej ani FAQ, ani opinii - wdrożyliśmy FAQ z danymi strukturalnymi FAQPage jako przewagę pod rich results. Ze starej strony poprowadziliśmy 19 przekierowań 301, żeby nie stracić wypracowanej widoczności.
Strona, która prowadzi do zapisu
Strona główna zbudowana wg lejka: hero wideo, pas liczb klubu (350 m², 2 sale, mata, ring i klatka), oferta pogrupowana wg odbiorcy, sekcja 8 dyscyplin, „Pierwszy trening krok po kroku”, FAQ, mapa i CTA. Mocne, powtarzalne wezwanie „Pierwszy trening jest na nas”, pływający przycisk telefonu i popup zapisu na darmowy trening (po 10% scrolla, raz na sesję). Zaufanie budują sekcje Kadra (10 trenerów), Zawodnicy (9 sylwetek), Nasze historie (3 historie założycieli), Galeria (39 zdjęć od dwóch fotografów, z podpisami i potwierdzoną licencją) oraz Wydarzenia z terminami startów i walk.
Integracja z WodGuru
Strona nie duplikuje systemu klubu, tylko do niego prowadzi. Grafik na /grafik jest osadzony na żywo - zmiana godzin w WodGuru zmienia stronę od razu. Przyciski „Zapisz się” prowadzą do rejestracji, a każdy karnet w cenniku ma własny odnośnik prosto do finalizacji tego konkretnego karnetu, a nie do ogólnej listy. To skraca ścieżkę zakupu o kilka kliknięć.
SEO techniczne, GEO i dane strukturalne
Wdrożone typy JSON-LD: ExerciseGym, Organization, WebSite, BreadcrumbList, FAQPage, Event (zawody i obozy), BlogPosting, Person, Offer, OpeningHoursSpecification, PostalAddress i Place. Do tego nagłówki bezpieczeństwa w konfiguracji Next.js, sitemap, poprawna struktura nagłówków, kompresja mediów (wideo hero 80 MB do 5 MB, rolki 123 i 451 MB do 18 i 13,5 MB), optymalizacja obrazów, X-Robots-Tag noindex na środowiskach testowych oraz warstwa GEO - treści przygotowane pod cytowanie przez wyszukiwarki AI, z dopuszczeniem botów AI.
Analityka mierząca konwersje, nie tylko wejścia
Google Tag Manager, GA4, Google Search Console i Microsoft Clarity. Strona sama wysyła zdarzenia: kliknięcie w telefon, kliknięcie „Zapisz się” i „Darmowy trening”, kliknięcie „Kup karnet”, wejście w grafik, wysłanie formularza, kliknięcie w e-mail i wyświetlenie popupu. Dzięki temu klub i jego specjalista od reklam widzą koszt pozyskania jednego zapisu, a nie tylko liczbę odsłon. Formularz kontaktowy obsługuje Resend z własnej domeny - SPF i DKIM skonfigurowane przy przepięciu DNS.
Zgodność z RODO
System zgód w standardzie Consent Mode v2. Do momentu wyrażenia zgody żadne narzędzie analityczne nie zapisuje danych, a użytkownik może zmienić decyzję w każdej chwili. Efekt uboczny, który lubimy: brak cookies Google przed zgodą zdejmuje też koszt z LCP.
Warstwa wizualna i animacje
Design system klubu (Barlow Condensed i Manrope, gradient marki) wpięty jako tokeny CSS. Animacje na GSAP i ScrollTrigger z Lenis: kaskadowe wejścia sekcji, animowane countery, marquee partnerów, rewelacja nagłówków słowo po słowie, masonry galerii - wszystko z fallbackiem dla prefers-reduced-motion, blurem wyłączonym na mobile i pełną treścią w HTML z serwera. Osobno rozwiązaliśmy problem zdjęć zawodników: przyszły z telefonów, hal i klatki, w różnych proporcjach i ekspozycjach. Zamiast wymuszać jeden kadr, wdrożyliśmy dwa układy karty (pionowy 3:4 i panoramiczny 16:9) z przeplotem w siatce oraz jednolity filtr obrazu - żadne zdjęcie nie jest obcięte, a sekcja wygląda spójnie.
Efekt
Co klub dostał do ręki
- Nowa strona pod kamegym.pl - 46 wygenerowanych podstron, front na Vercelu
- Kompletna ścieżka: wejście z Google, strona dyscypliny, darmowy trening lub zakup karnetu w WodGuru - mierzona od pierwszego dnia
- Klub prowadzi bloga samodzielnie, reszta strony pozostaje po naszej stronie
- Zero przewijania poziomego i zero błędów w konsoli na wszystkich sprawdzonych stronach (weryfikacja na buildzie produkcyjnym, desktop 1440 px i iPhone 390 px)
- Przekazany plan publikacji 8 artykułów na wrzesień-grudzień 2026 - każdy pod konkretną frazę lokalną i z linkowaniem do stron oferty
- Pełna dokumentacja przekazania: instrukcja bloga, opis analityki, lista kont do przejęcia, 30 dni gwarancji
Stack
Na czym to działa
Front i hosting
Next.js 16React 19TypeScriptTailwind CSS v4Vercel
Treść i integracje
headless WordPressWPGraphQLWodGuruResend
Animacje
GSAPScrollTriggerLenis
Analityka
Google Tag ManagerGA4Search ConsoleMicrosoft Clarity
