Za kulisami · projekt demo
Jak powstaje strona.
Krok po kroku, bez ściemy.
Nie mam jeszcze realizacji dla klientów, więc nie będę udawał, że mam. Zamiast tego pokazuję, jak buduję stronę od zera, na przykładzie projektu demo: strony dla trenera personalnego.
Firma, osoby i zdjęcia w demo są fikcyjne. Sposób pracy jest prawdziwy.
Przewiń w bok →
01
Brief
Zaczynam od trzech pytań: co firma oferuje, kto ma napisać lub kupić i co ma się stać po wejściu na stronę. Dla trenera odpowiedź brzmiała: trzy formy współpracy, jedna ścieżka do kontaktu.
Brief · projekt demo
Strona trenera personalnego
1. Co firma oferuje?
trening 1:1 na miejscu · trening online · plan treningowy do pobrania (PDF)
2. Kto ma napisać lub kupić?
osoby po 30., które chcą zacząć ćwiczyć, ale nie wiedzą od czego · zapracowani, potrzebują prostego planu · obawa: „czy to dla mnie, czy dam radę”
3. Co ma się stać po wejściu na stronę?
jedna ścieżka: przycisk „Umów konsultację” → formularz kontaktowy · plany do pobrania: osobna podstrona ze sklepem
Od klienta potrzebuję: logo, zdjęć, cen, regulaminu.
Przewiń w bok →
02
Mapa strony
Zanim cokolwiek zaprojektuję, ustalam podstrony. Tu są trzy: oferta, sklep z plikami do pobrania i regulamin z polityką prywatności.
Strona trenera
03
Układ w Elementorze
Buduję w darmowej wersji Elementora, wyłącznie na standardowych widgetach, bez wklejonego kodu HTML. Dzięki temu po odbiorze sam zmienisz tekst, cenę i zdjęcie, bez dopłat za dodatki.
Przewiń w bok →
04
Teksty
Piszę krótko i konkretnie: co dostajesz, ile kosztuje, jak zaczyna się współpraca. Wycinam zdania, które nic nie mówią.
Przewiń w bok →
05
Co robi AI, a co robię ręcznie
Pracuję z AI (Claude) i nie ukrywam tego. Claude pomaga mi przy pierwszych wersjach tekstów, a ja je poprawiam i zatwierdzam. Zmiany na stronie wprowadzamy razem, krok po kroku. Przed każdą publikacją sprawdzam podgląd, bo AI ma swoje ograniczenia i potrafi coś pominąć.
Układ strony, ceny i to, co trafia na stronę, ustalam sam. Za stronę odpowiadam ja, nie narzędzie.
Zdjęcia w demo trenera wygenerowałem w darmowej wersji Gemini, dlatego są przykładowe. Grafiki marki DreamDesigners robię w Midjourney, gdy są potrzebne, a banery i posty w Canvie.
06
Telefon
Sprawdzam każdą podstronę na telefonie i zmniejszam obrazki.
Przewiń w bok →
07
Test przed oddaniem
Przechodzę przez linki, przyciski i strony prawne. W demo formularz niczego nie wysyła, a płatności nie są podpięte.
Czego tu nie ma
Klienta, opinii i wyników
Pojawią się, gdy będą prawdziwe.
Podpiętego formularza i płatności
Przy prawdziwym zleceniu dochodzą one oraz materiały klienta.
Chcesz zobaczyć, jak to wygląda w praktyce?
Opisz w jednym zdaniu, czego potrzebujesz. Odpowiem w ciągu 48 godzin.