wróć do listy projektów

Pharmaverum

Kompleksowe projektowanie i wdrożenie sklepu WooCommerce dla pharmaverum

Sklep www

UI/UX Design

E-commerce / WooCommerce

Growth / Tech Support

Kompleksowy projekt sklepu internetowego WooCommerce dla marki Pharmaverum - mix różnych widoków

O projekcie

Pharmaverum to łódzki producent wysokiej jakości suplementów diety, z którym współpracujemy od momentu debiutu marki w 2020 roku. Po pięciu latach od wdrożenia pierwszego, startowego sklepu, nadszedł czas na kolejny krok milowy.

Z okazji jubileuszu marki zaprojektowaliśmy i wdrożyliśmy całkowicie nową platformę WooCommerce. Nowy serwis to efekt analizy danych zebranych przez lata działalności – został w pełni zoptymalizowany pod kątem konwersji (CRO), UX, SEO oraz wydajności. Zgodnie z zasadą Mobile-First, każdy detal zaprojektowaliśmy z myślą o urządzeniach przenośnych, które odpowiadają za ponad 90% ruchu w sklepie.”

projekt live

Zespół i zakres prac

Mateusz Konieczny

prowadzenie projektu
wsparcie programistów
code review

Kuba Konieczny

analiza i research
makiety funkcjonalne
projekt sklepu www
design review

Hubert Sobczak

backend development
code review

Mikołaj Bieliński

frontend development

Sebastian Staniszewski

frontend development

Makiety funkcjonalne (UX) sklepu internetowego Pharmaverum po warsztatach strategicznych

Warsztaty strategiczne

Fundamentem prac nad nową platformą Pharmaverum były kompleksowe warsztaty strategiczne. Podczas sesji warsztatowych ustrukturyzowaliśmy ofertę produktową oraz przeanalizowaliśmy wyniki badań z użytkownikami, dostarczone przez zewnętrznego badacza.

Wspólnie zdefiniowaliśmy logikę kluczowych mechanizmów sklepu oraz opracowaliśmy założenia dla niestandardowych funkcjonalności, takich jak zaawansowany program lojalnościowy i model subskrypcji produktów. Wypracowana strategia pozwoliła nam stworzyć makiety funkcjonalne (wireframes), które stały się solidnym szkieletem dla finalnej warstwy wizualnej.

Projekt strony głównej sklepu internetowego WooCommerce dla marki Pharmaverum

Projekt sklepu internetowego w wersji mobilnej - widok sekcji hero na stronie głównej oraz menu mobilnego i wyszukiwarki

Program lojalnościowy pharmaclub w sklepie WooCommerce

Kluczowym elementem strategii utrzymania klienta (retencji) było wdrożenie autorskiego programu lojalnościowego PharmaClub. Mechanizm ten stymuluje częstotliwość zakupów, nagradzając użytkowników punktami, które mogą być wymieniane na zniżki przy kolejnych zamówieniach.

Sercem programu jest dedykowany moduł w panelu klienta – zaprojektowaliśmy go z naciskiem na maksymalną przejrzystość. Użytkownik ma natychmiastowy dostęp do salda punktów, historii aktywności oraz intuicyjnego systemu wymiany punktów na rabaty. Takie podejście sprawia, że uczestnictwo w programie jest dla klienta angażujące, a dla marki – skutecznym narzędziem budowania długofalowych relacji.

Widok customowej funkcjonalności w sklepie WooCommerce - Program lojalnościowy PharmaClub

Projekt customowej funkcjonalności w sklepie WooCommerce - Subskrypcja produktów Pharmaverum

Subskrypcja produktów w sklepie internetowym woocommerce

W celu budowy stabilnych, powtarzalnych przychodów, wdrożyliśmy w sklepie zaawansowany mechanizm subskrypcji produktów. Rozwiązanie to pozwala klientom na automatyzację cyklicznych zakupów suplementów.

Podczas składania zamówienia użytkownik decyduje, które produkty chce subskrybować, wybierając preferowaną częstotliwość dostaw (co 1, 2 lub 3 miesiące). Cały proces został zaprojektowany z myślą o pełnej kontroli użytkownika – z poziomu panelu klienta może on w dowolnym momencie zarządzać aktywnymi subskrypcjami lub je anulować. Dodatkowo system automatycznie wysyła powiadomienia e-mail na 3 dni przed planowanym odnowieniem, co zapewnia transparentność i buduje zaufanie do marki.

Karta produktu zoptymalizowana pod konwersję

Karta produktu w nowym sklepie Pharmaverum została zaprojektowana jako zaawansowane narzędzie sprzedażowe, łączące maksymalną przejrzystość z silnymi dowodami słuszności (Social Proof). Naszym priorytetem było udzielenie odpowiedzi na kluczowe pytania klienta w ciągu pierwszych kilku sekund kontaktu z witryną.

Kluczowe informacje, takie jak zawartość opakowania oraz wydajność suplementu (czas trwania kuracji), umieściliśmy w sekcji powyżej linii zgięcia (Above the Fold). Dzięki temu użytkownik otrzymuje najważniejsze dane bez konieczności przewijania strony. W tej samej sekcji klient może błyskawicznie wybrać wariant produktu oraz zdecydować o modelu zakupu – jednorazowym lub w atrakcyjnej subskrypcji.

Aby maksymalnie ułatwić proces zakupowy na urządzeniach mobilnych (które generują 90% ruchu), zastosowaliśmy funkcję Sticky Add to Cart. Główny przycisk „Dodaj do koszyka” jest na stałe przypięty do dolnej krawędzi ekranu, dzięki czemu wezwanie do działania (CTA) jest zawsze pod kciukiem użytkownika. Tuż pod przyciskiem zakupowym umieściliśmy sekcję benefitów: dostępne metody płatności, informację o darmowej dostawie oraz liczbę punktów do zdobycia w programie PharmaClub.

Wiarygodność marki buduje pełna integracja z systemem niezależnych opinii Zaufane.pl, które są aktualizowane w czasie rzeczywistym. Dalsza część karty produktu pełni rolę kompendium wiedzy – użytkownik znajdzie tam szczegółowe opisy, wyniki badań, pełny skład oraz instrukcje dotyczące stosowania i przechowywania. Tak zaprojektowana hierarchia informacji skutecznie eliminuje bariery zakupowe i domyka proces sprzedaży.

Projekt karty produktu zoptymalizowanej pod konwersję w sklepie WooCommerce dla marki Pharmaverum - widoki w wersji na telefon

Rozbudowana karta produktu w ecommerce w wersji mobilnej

Projekt dodatkowych sekcji na karcie produktu w sklepie internetowym WooCommerce - badania, integracja z opiniami Zaufane, metody płatności, jak działa subskrypcja

Koszyk wspierający sprzedaż

Koszyk w sklepie Pharmaverum został zaprojektowany jako aktywne narzędzie wspierające sprzedaż. Zastosowaliśmy w nim dynamiczny pasek postępu, który w czasie rzeczywistym informuje użytkownika o kwocie brakującej do uzyskania darmowej dostawy (od 170 zł) oraz kolejnego progu gratyfikacji – produktu gratisowego. Takie rozwiązanie nie tylko poprawia doświadczenie zakupowe poprzez jasną komunikację benefitów, ale również skutecznie stymuluje wzrost średniej wartości zamówienia (AOV). Dodatkowo, już na etapie koszyka, użytkownik widzi precyzyjną liczbę punktów, jakie otrzyma w programie PharmaClub, co dodatkowo motywuje do sfinalizowania transakcji.

Projekt koszyka zakupowego wspierającego sprzedaż w sklepie internetowym WooCommerce

Funkcje wspierające sprzedaż (CRO): licznik w koszyku i system gratisowy

W celu zwiększenia rentowności sprzedaży wdrożyliśmy w koszyku interaktywny pasek postępu. Mechanizm ten w czasie rzeczywistym informuje klienta o kwocie brakującej do uzyskania darmowej dostawy oraz automatycznie odblokowuje produkt gratisowy po przekroczeniu określonego progu wartości zamówienia.

Z perspektywy UX rozwiązanie zapewnia pełną przejrzystość benefitów, natomiast z punktu widzenia biznesu – poprzez mechanizm gratyfikacji – skutecznie stymuluje wzrost średniej wartości koszyka (AOV).

Projekt dedykowanej funkcjonalności w koszyku WooCommerce, która wspiera sprzedaż - licznik do darmowej dostawy i gratisu

Zoptymalizowany proces zamówienia (One-Step Checkout)

Proces finalizacji zamówienia został maksymalnie uproszczony i sprowadzony do niezbędnego minimum, aby zminimalizować ryzyko porzucenia koszyka. Wdrożyliśmy czytelny podział na sekcje, który pozwala użytkownikowi błyskawicznie wybrać metodę dostawy (m.in. InPost, DHL, DPD) oraz preferowaną formę płatności (BLIK, Apple Pay, Google Pay, PayPo). System automatycznie przelicza koszty wysyłki i przewidywany czas doręczenia, budując poczucie bezpieczeństwa. W przypadku produktów subskrypcyjnych, proces jest w pełni zautomatyzowany dzięki integracji z systemem płatności kartowych, co pozwala na bezobsługowe odnawianie zamówień. Całość została zoptymalizowana pod kątem urządzeń mobilnych, umożliwiając domknięcie zakupu zaledwie kilkoma kliknięciami.