
przemekwojdylo.pl
Trener Personalny / Fitness / Marka osobista
Custom
Przemek Wojdyło
Dla Przemka Wojdyło zaprojektowałem i wdrożyłem rozbudowany serwis premium dla marki osobistej, która łączy kilka niezależnych filarów biznesu w jeden spójny, mocny wizualnie system. Strona nie działa jak zwykła wizytówka. To precyzyjnie zaprojektowany ekosystem prowadzący użytkownika od pierwszego wrażenia, przez wybór konkretnej usługi, aż do kontaktu, zakupu lub wejścia do panelu klienta. Punkt wyjścia stanowił bardzo charakterystyczny język wizualny: ciemne, filmowe tło, wyrazista typografia display, mocna hierarchia treści i modularne sekcje akcentowane różnymi kolorami w zależności od obszaru oferty. Dzięki temu cały serwis zachowuje jedną tożsamość, a jednocześnie pozwala mocno odróżnić trening personalny, Mental Energy, Paintball Tarnobrzeg, vouchery, dietetykę i suplementację FitLine. Od strony funkcjonalnej serwis został zbudowany jako realne narzędzie sprzedażowe i operacyjne. Użytkownik może przejść do rozbudowanych landing pages usługowych, skonfigurować i kupić voucher online, zamówić indywidualny plan żywieniowy, wejść do panelu klienta, skorzystać z asystenta AI oraz zostać poprowadzony do najlepszego kroku bez chaosu i bez zbędnych tarć. Po stronie właściciela wdrożyłem zaplecze administracyjne do obsługi voucherów i diet, procesy płatności, statusy zamówień, podgląd danych kupujących oraz logikę obsługi PDF i zamówień. Efekt końcowy to nowoczesna, szybka i bardzo charakterystyczna platforma marki osobistej, mocna wizualnie, technologicznie uporządkowana i gotowa do skalowania kolejnych produktów oraz usług.
Założenia i Rezultaty
0,8 s
Czas ładowania
+59%
Konwersja landing page
98/100
Performance Score
−85%
Czas obsługi voucherów
−42%
Bounce rate
+100%
Sprzedaż online 24/7
Ukończono: 20 czerwca 2026

01Opis realizacjiDane
Wybrane ekrany i mockupy
Galeria projektu
Przekrój najważniejszych ekranów projektu, od landingów filarów marki, przez widoki mobile i desktop, po sceny sprzedażowe. Całość pokazuje, jak system wizualny i komunikacja działają w praktyce.
01 / 09
Pierwsze wrażenie się liczy
Pierwsze wrażenie jest tu absolutnie kluczowe. Hero zostało zbudowane jako szerokie, kinowe wejście w markę osobistą, z mocnym split layoutem, dużym zdjęciem osadzonym po prawej stronie i bardzo odważną typografią po lewej. Hasło 'Siła ciała. Spokój głowy. Gotowość do działania.' od razu porządkuje pozycjonowanie całej marki i komunikuje trzy główne osie wartości: ciało, psychikę i sprawczość.
To hero nie tylko wygląda mocno, ale też pracuje sprzedażowo. Główne CTA prowadzą bezpośrednio do kontaktu, a dodatkowe wejście do logowania od razu sygnalizuje, że serwis jest czymś więcej niż wizytówką. To realne narzędzie do pracy z klientem. Ciemne tło, subtelne blendy i duża ilość powietrza sprawiają, że całość czyta się bardzo premium i bardzo pewnie.

02Hero sectionHero
Typografia i kolorystyka
Ciemny, editorialny system wizualny z akcentami przypisanymi do filarów marki
Projekt opiera się na filmowej, near-black bazie z mocno kontrastową typografią display i modularną pracą kolorem. Inter Tight odpowiada za ciężar, charakter i natychmiastową czytelność nagłówków, a Inter utrzymuje lekkość w opisach, formularzach i sekcjach sprzedażowych. Zamiast jednego akcentu wdrożyliśmy system barw zależnych od kontekstu: żółć dla Paintballu, magentę dla Mental Energy, pomarańcz dla FitLine i chłodny, stalowy akcent dla głównych obszarów marki. Dzięki temu strona pozostaje spójna, ale każda część oferty ma własną energię i łatwo zapada w pamięć.
Czcionki
Czcionka główna
Inter Tight
700800
Siła ciała.
Spokój głowy.
Gotowość do działania.
Czcionka akcentowa
Inter
400500600
Premium coaching dla ciała, głowy i działania.
Czytelna architektura treści i mocne CTA bez chaosu.
Paleta kolorów
Background
#101114
Near-black base (#101114): fundament całego projektu. Nadaje stronie ciężar, premium feel i pozwala wybrzmieć fotografii oraz typografii.
Text
#F4F5F7
Jasna typografia (#F4F5F7): wysoki kontrast na ciemnym tle, bardzo dobra czytelność i mocne pierwsze wrażenie.
Paintball primary
#FACC15
Paintball yellow (#FACC15): najmocniejszy, najbardziej agresywny akcent w systemie. Przyciąga uwagę w sekcjach o najwyższej energii i konwersji.
Mental Energy primary
#E44CC4
Mental magenta (#E44CC4): kolor części mentalnej. Buduje odrębność tej oferty i podkreśla pracę z emocjami, koncentracją i uważnością.
FitLine primary
#F97316
FitLine orange (#F97316): cieplejszy akcent sprzedażowy używany w module suplementacji i komunikatach produktowych.
03Typografia & KolorystykaJęzyk wizualny
Responsywność na każdym urządzeniu
Perfekcyjne doświadczenie na desktopie i mobile
Desktop
Wersja desktopowa

Mobile
Wersja mobilna
01 / 04
04Responsywność na każdym urządzeniuDesktop & Mobile
Co wyróżnia tę stronę?
To nie jest zwykła strona usługowa, to dobrze zaprojektowany system marki osobistej
Największą siłą tego projektu jest połączenie wyrazistego brandingu z bardzo praktyczną architekturą biznesową. Użytkownik trafia na mocny wizualnie serwis ale od razu widzi też że za estetyką stoi logika: osobne ścieżki dla treningu mentalu paintballa voucherów diet i suplementacji spójne CTA czytelna nawigacja oraz szybkie przejścia do działania. Dodatkowo wdrożony asystent AI działa jak inteligentna warstwa prowadząca, skraca drogę do konkretnej usługi porządkuje pytania i wzmacnia odbiór marki jako nowoczesnej uporządkowanej i dostępnej. Całość wspiera realne procesy sprzedaży i obsługi klienta zamiast kończyć się na samym wizerunku.
Ta realizacja wyróżnia się tym że łączy branding sprzedaż automatyzację i backend w jedną spójną platformę, gotową nie tylko robić wrażenie ale też realnie pracować na wynik.

Asystent AI jako przewodnik po ofercie
Widget rozmowy pomaga szybko przejść do odpowiedniego filaru działalności, treningu, mentalu, paintballa, FitLine lub voucherów, bez błądzenia po stronie.
Jedna marka, kilka mocnych ścieżek
Architektura serwisu została podzielona na osobne moduły ofertowe, ale zachowuje jedną, wyrazistą tożsamość wizualną i jedną logikę nawigacji.
Vouchery z personalizacją i checkoutem
Użytkownik może wybrać typ vouchera, okazję, kwotę, dane odbiorcy i formę dostawy, całość działa jak gotowy produkt cyfrowy, a nie formularz zapytania.
Sprzedaż planu żywieniowego online
Dedykowana podstrona dietetyczna prowadzi od wyceny i listy korzyści do zakupu oraz dalszego onboardingu klienta w uporządkowanym flow.
Landing page Paintball Tarnobrzeg
Sekcja paintballowa ma własny, agresywniejszy rytm komunikacji, własny akcent kolorystyczny i konkretne argumenty sprzedażowe dla grup, dzieci i eventów.
Mental Energy z własną tożsamością
Część mentalna została wizualnie i komunikacyjnie odróżniona od reszty, dzięki temu użytkownik od razu rozumie, że wchodzi w inny obszar pracy i inne korzyści.
Moduł FitLine i monetyzacja poleceń
Sekcja suplementacji nie jest dodatkiem, to pełnoprawna część ekosystemu z produktami, argumentacją jakościową i jasnym przejściem do partnera sprzedażowego.
Panel operacyjny po stronie właściciela
Poza warstwą frontendową serwis wspiera codzienną pracę: obsługę zamówień, statusów, plików PDF, diet i voucherów bez ręcznego chaosu.
05Co wyróżnia tę stronęFunkcje
Backend & Portal Klienta
Za frontendem stoi konkretne zaplecze operacyjne. W projekcie wdrożono panel administracyjny do obsługi voucherów i diet, logikę płatności, workflow statusów, generowanie i pobieranie dokumentów oraz kontrolę danych kupujących i odbiorców. Dzięki temu właściciel nie dostaje tylko estetycznej strony, ale narzędzie, które porządkuje codzienną obsługę zamówień i klientów. Po stronie użytkownika serwis komunikuje obecność logowania i dalszych kroków w relacji z marką, a po stronie właściciela daje centralne miejsce do zarządzania zgłoszeniami, voucherami, planami żywieniowymi i kolejnymi etapami realizacji usług.

Obsługa voucherów w panelu
Lista zamówień, kwoty, statusy, dane kupującego i odbiorcy oraz szybkie akcje operacyjne z jednego widoku.
Podgląd i pobieranie PDF
Panel umożliwia otwieranie i pobieranie gotowych plików voucherów bez ręcznego szukania dokumentów poza systemem.
Workflow statusów
Zamówienia mogą przechodzić przez kolejne etapy realizacji, zwrotu i wykorzystania, co porządkuje proces po stronie właściciela.
Osobna obsługa diet
Projekt obejmuje również zaplecze do planów żywieniowych, dzięki czemu różne typy produktów cyfrowych nie mieszają się w jednym chaotycznym widoku.
Płatności i checkout
Zakup vouchera i planu działa online, a system domyka przepływ od wyboru produktu do finalizacji transakcji.
Asystent AI w warstwie obsługi
Rozmowa z użytkownikiem wspiera sprzedaż i prowadzi do odpowiedniego miejsca w serwisie, skracając czas potrzebny na decyzję.
Gotowość pod panel klienta
Architektura komunikacji i logowania buduje fundament pod dłuższą relację z klientem, nie tylko jednorazowe wejście na landing page.
Uporządkowane dane operacyjne
Dane zamówień, statusów i plików są zebrane w jednym miejscu, co ogranicza ręczną pracę i minimalizuje ryzyko pomyłek.
Nowoczesny stack technologiczny
Nowoczesny stack, który gwarantuje szybkość, stabilność i perfekcyjne działanie strony
DS
DS: Dark Editorial System
Własny język wizualny oparty na near-black tle, mocnej typografii display i modularnych akcentach kolorystycznych zależnych od filaru oferty. Dzięki temu marka jest jednocześnie spójna i wielowarstwowa.
MX
MX: Modular Experience Architecture
Serwis został rozpisany na niezależne landing pages i ścieżki sprzedażowe, które działają jak osobne produkty, ale zachowują jedną logikę poruszania się po całości.
AI
AI: Guided Conversation Layer
Asystent AI nie jest dodatkiem dekoracyjnym, to narzędzie prowadzące użytkownika do właściwej usługi, porządkujące pytania i skracające ścieżkę do kontaktu lub zakupu.
CC
CC: Checkout & Commerce Flow
Zakup voucherów i planów działa w uporządkowanym procesie z konfiguracją produktu, walidacją danych, płatnościami i dalszą obsługą po stronie panelu administracyjnego.
AP
AP: Admin Operations Panel
Panel administracyjny zbiera operacje związane z voucherami i dietami: statusy, zwroty, pobieranie plików, podgląd danych i kontrolę procesu realizacji.
PE
PE: Performance & Responsiveness
Mimo rozbudowanej struktury serwis zachowuje lekkość odbioru dzięki czytelnej hierarchii treści, podziałowi na sekcje i dopracowaniu doświadczenia na desktopie i mobile.
BR
BR: Brand Routing Strategy
Każdy filar oferty dostał własny routing, własny akcent i własną dramaturgię sekcji, co zwiększa czytelność komunikatu i pozwala skalować projekt bez utraty porządku.
FT
FT: FitLine Product Layer
Moduł produktowy z osobnym hero, argumentacją jakościową i kartami produktów poszerza serwis o warstwę sprzedażową i contentową bez osłabiania marki głównej.
06TechnologieStack
Inne realizacje
Zobacz więcej naszych projektów
Porozmawiajmy.
Napisz w 30 sekund, wrócę z propozycją.
Kontakt
Godziny otwarcia
- Poniedziałek: Piątek8:00-20:00
- Sobota9:00-16:00
- NiedzielaZamknięte




















Polska
Wielka Brytania