Marcin Szczepański prowadzi MSZ Zarządzanie Nieruchomościami, jednoosobową firmę zarządzającą wspólnotami mieszkaniowymi w Poznaniu i okolicy. Konkuruje z firmami, które mają działy i infolinie, a jego główną przewagą jest to, że klient dzwoni pod jeden numer i trafia na konkretną osobę. Strona miała tę przewagę pokazać, a nie ją rozmyć.
Efekt działa pod adresem msz-zarzadzanie.pl. Poniżej opisuję, jak powstawał i dlaczego podjąłem takie, a nie inne decyzje.
Z czym przyszedł klient
Z prezentacją firmową w PowerPoincie, logo i konkretną potrzebą: strona ma budować wiarygodność u zarządów wspólnot, które rozważają zmianę zarządcy. To nie jest sklep ani kampania reklamowa. Decyzja o zmianie zarządcy zapada na zebraniu, po przeczytaniu oferty i sprawdzeniu, czy ktoś w ogóle wie, o czym mówi.
Doszło do tego ograniczenie, które lubię, bo porządkuje myślenie. Po oddaniu projektu nie miało zostać nic, za co trzeba płacić co miesiąc i nic, przy czym trzeba mnie wołać. Żadnego abonamentu na wtyczki, żadnej licencji na page buildera.
Skąd wzięła się treść
Z prezentacji i z rozmowy z Marcinem. To jest moim zdaniem najbardziej niedoceniany etap takiego projektu.
Nie wymyślałem za klienta, czym się zajmuje. Przepisałem jego własne sformułowania z języka wewnętrznego na język strony i nie dopisałem ani jednej usługi, której sam nie wymienił. Tam, gdzie materiały czegoś nie mówiły, na przykład od kiedy działa na rynku albo jaka jest suma polisy OC, zrobiłem listę pytań zamiast listy założeń. Lista pytań jest dla klienta niewygodna, ale wychodzi taniej niż strona pełna ogólników, których nikt nie czyta.
Zamiast Figmy, klikalne makiety
Makiety zrobiłem od razu jako HTML, po jednym pliku na podstronę. Marcin dostawał link, otwierał go w telefonie i mówił, co mu nie pasuje.
To skraca akceptację o kilka dni. Przy statycznym obrazku klient ogląda obrazek, przy klikalnej makiecie ocenia stronę. Przy okazji z gotowych makiet wyciągnąłem paletę kolorów, typografię i skalę odstępów prosto do konfiguracji motywu, więc projekt i kod nie rozjechały się ani o piksel bo nie było pikseli.
Własny motyw blokowy, bez page buildera
Zbudowałem motyw blokowy WordPressa, czyli taki, w którym nagłówek, stopka i szablony podstron są plikami motywu, a jednocześnie Marcin może je edytować w panelu, bez FTP i bez dodatkowej wtyczki.
Cała warstwa wizualna siedzi w jednym pliku konfiguracyjnym: kolory, dwa kroje pisma, skala odstępów, promienie, cienie, wygląd przycisków. Własny arkusz stylów odwołuje się wyłącznie do tych wartości, nigdy do kolorów wpisanych na sztywno. Dzięki temu zmiana koloru akcentu w jednym miejscu przechodzi przez cały serwis, łącznie z komponentami pisanymi ręcznie.
Koszt tego podejścia to kilka godzin więcej na starcie. Zysk to strona bez kilkuset kilobajtów kodu, którego nikt nie używa, i niezależność od wtyczki, która za dwa lata może przestać być rozwijana.
Ofertę podzieliłem po tym, co klient posiada
To jest decyzja, która wygląda na kosmetyczną, a przesądza o tym, czy ktokolwiek znajdzie na stronie to, po co przyszedł.
Firma dzieli swoją pracę na obsługę administracyjną, techniczną i księgową. Klient nie myśli w tych kategoriach. Klient myśli „mam kamienicę” albo „wynajmuję mieszkanie i nie mam czasu”. Dlatego oferta dzieli się na rodzaje nieruchomości, a zakres obsługi siedzi w środku każdej z tych podstron, bo dla wspólnoty mieszkaniowej wygląda inaczej niż dla lokalu na wynajem.
Technicznie to jeden typ treści i jeden szablon. Marcin dodaje piątą pozycję oferty bez mojego udziału i bez ryzyka, że układ się rozjedzie.
Treść wkleja sam, jednym ruchem
Zakres obsługi to kilkanaście punktów pogrupowanych w sekcje. Standardowo robi się to polem powtarzalnym, które jest w płatnej wersji wtyczki do pól dodatkowych, a w darmowej po prostu się nie wyświetla.
Zamiast kupować licencję, napisałem w motywie parser prostego formatu tekstowego. Linia zaczynająca się od dwóch krzyżyków to tytuł sekcji, każda następna to punkt. Marcin kopiuje całą sekcję jednym ruchem z pliku tekstowego, zamiast dwadzieścia razy klikać „dodaj wiersz”. Sto linii kodu, zero zależności i, co się okazało ważniejsze, klient faktycznie z tego korzysta.
Wszystkie treści dostarczyłem jako pliki tekstowe do wklejenia, a nie wpisane wprost do bazy. Baza deweloperska i produkcyjna zawsze się w końcu rozjadą, plik tekstowy przeżyje każdą migrację.
Analityka i zgody bez ciężkich wtyczek
Statystyki wstawia motyw. Jedno pole w ustawieniach, wklejasz identyfikator Google Analytics i gotowe.
Baner zgody na cookies też napisałem sam, po tym jak gotowa wtyczka okazała się konfliktować z zabezpieczeniami serwera i nie dało się jej przeklikać do końca. Przy jednym narzędziu analitycznym gotowiec rozwiązuje problem, którego ta strona nie ma, a wnosi własny panel, zależność od API i kolejne miejsce, w którym coś może przestać działać.
Własny moduł robi dokładnie to, czego wymaga art. 399 Prawa komunikacji elektronicznej: dopóki ktoś nie kliknie zgody, strona nie pobiera nawet skryptu Google. Odmowa jest równie widoczna jak akceptacja, decyzję można zmienić linkiem w stopce, a jej wycofanie kasuje zapisane ciasteczka. Przetestowałem to automatycznie w przeglądarce, dwadzieścia jeden scenariuszy, od pierwszego wejścia po wycofanie zgody.
Co z tego ma klient
Stronę, która nie generuje stałych kosztów. Zero abonamentów, zero licencji, hosting i domena to jedyne, co płaci co roku.
Możliwość prowadzenia jej samemu. Marcin dopisuje pozycje oferty, publikuje wpisy na blogu, podmienia zdjęcia i poprawia dane w stopce. Dostał do tego plan treści z dziesięcioma tematami i listę kontrolną, jak pisać wpis, żeby miał szansę w wyszukiwarce.
Blog, który ma sens biznesowy, a nie jest ozdobą. Pierwszy wpis odpowiada na pytanie, które pada na każdym zebraniu rocznym wspólnoty, czyli jak rozliczać fundusz remontowy. Ludzie, którzy tego szukają, to dokładnie ci sami ludzie, którzy za chwilę będą głosować nad zmianą zarządcy.
Technologie: WordPress (motyw blokowy, Full Site Editing), PHP, theme.json, Advanced Custom Fields w wersji darmowej, wzorce bloków Gutenberga, Google Analytics 4 z trybem uzyskiwania zgody, Google Search Console.