Case study
DEKI to doświadczony producent plandek i nowoczesnych systemów osłonowych: plandek na pojazdy ciężarowe i przyczepy, osłon do wywrotek, kotar przemysłowych, zadaszeń, pokrowców i banerów.
Firma realizuje zarówno projekty standardowe, jak i w pełni niestandardowe. Jedną z najczęściej zamawianych grup produktów są płachty osłonowe na altany, tarasy i konstrukcje ogrodowe, szyte na wymiar pod konkretną konstrukcję klienta.
W skrócie
DEKI, producent plandek i systemów osłonowych (deki.pl). Firma realizuje rozwiązania dopasowane do indywidualnych potrzeb Klientów.
Produkcja na wymiar dla Klientów B2B i B2C. Oferta obejmuje rozwiązania wymagające indywidualnego dopasowania.
Projekt UX/UI, autorska wtyczka WordPress i kreator produktu. Wycena online, generowanie PDF oraz automatyzacja obsługi zapytań.
WordPress, PHP, JavaScript i HTML5 Canvas. Generator PDF oraz własny system aktualizacji wtyczki.
Klient samodzielnie konfiguruje i wycenia płachtę, a następnie otrzymuje PDF z rysunkiem. DEKI otrzymuje kompletny zestaw danych potrzebnych do realizacji produkcji.
Wspólnie przełożyliśmy potrzeby DEKI na funkcjonalne rozwiązanie dopasowane do specyfiki produkcji. Projekt połączył wygodę Klienta końcowego z usprawnieniem obsługi zapytań po stronie firmy.
Wyzwanie
Każde zamówienie to inny kształt, wymiary, kolor, okno z folii przezroczystej, drzwi, wykończenie krawędzi i dodatkowe wycięcia. Przed wdrożeniem konfiguratora proces wyglądał tak:
Cel: dać klientowi narzędzie, w którym sam zaprojektuje płachtę, od razu zobaczy rysunek i cenę, a do DEKI trafi komplet danych gotowy do potwierdzenia i przekazania na produkcję.
Rozwiązanie
Zaprojektowaliśmy i wdrożyliśmy autorski konfigurator jako dedykowaną wtyczkę WordPress, osadzoną bezpośrednio na stronie deki.pl. Narzędzie prowadzi użytkownika przez 11 etapów konfiguracji, jednocześnie prezentując aktualny wygląd płachty w formie technicznego rysunku.
Konfigurator pozwala określić m.in. kształt i dokładne wymiary płachty, kolor według palety RAL, rodzaj wykończenia, obecność drzwi, folii przezroczystej, rękawa, oczek czy fartucha. Użytkownik może również dodać wycięcia oraz określić ich rozmiar i położenie.
Każdy etap został zaprojektowany tak, aby ułatwić samodzielną konfigurację. Opcje są opisane i ilustrowane zdjęciami realizacji DEKI, a wszystkie treści i materiały można później edytować z poziomu panelu administracyjnego.
Jak to działa
Każdy krok ma tytuł, opis i podpowiedź, a opcje wyboru są ilustrowane zdjęciami realizacji DEKI. Wszystkie treści i zdjęcia są edytowalne z panelu administracyjnego.
Wybór odpowiedniego kształtu płachty oraz określenie jej dokładnych wymiarów w centymetrach.
Wybór koloru płachty z palety RAL wraz z podglądem wybranego wariantu.
Określenie, czy płachta ma zostać wyposażona w listwę kedrową na górnej krawędzi.
Ustalenie szerokości, wysokości oraz dokładnego położenia drzwi na płachcie.
Określenie wymiarów oraz położenia przezroczystego okna względem krawędzi płachty.
Wybór sposobu wykończenia dolnej krawędzi – rękaw lub oczka, zależnie od potrzeb.
Możliwość wydłużenia płachty o dodatkowy fartuch o wysokości 5 cm.
Możliwość dodania profilu usztywniającego, dostępnego przy wyborze odpowiedniego rękawa.
Wybór odpowiedniej grubości folii przezroczystej spośród trzech dostępnych wariantów.
Dodawanie dowolnej liczby wycięć wraz z określeniem ich wymiarów oraz dokładnego położenia.
Wybór koloru haczyków obrotowych, dopasowanego do wybranego rozwiązania.
Na końcu klient dołącza zdjęcia konstrukcji lub własne szkice (przeciągnij i upuść), podaje email, telefon oraz adres wysyłki i wysyła zapytanie. Bez kompletu danych kontaktowych i adresu formularz nie przejdzie.
Rysunek techniczny na żywo
Nie jest to poglądowa grafika, tylko zwymiarowany szkic w skali, który trafia potem na produkcję:
Walidacje, które myślą za klienta
Wysokość całkowita płachty jest nadrzędna: jeśli klient wpisze okno z folii, które nie mieści się w płachcie, narzędzie przytnie folię lub jej odległość od góry i pokaże krótki komunikat przy polu, zamiast po cichu powiększać całą płachtę. Drzwi nie mogą wyjść poza obrys, a wycięcia poza płachtę. Dzięki temu do DEKI nie trafiają konfiguracje, których nie da się wykonać.
Typowe zamówienie to kilka płacht na jedną altanę. Konfigurator obsługuje dowolną liczbę płacht w jednym zapytaniu: każda ma własną zakładkę z miniaturą kształtu, można ją w każdej chwili wrócić i poprawić, a nowa płachta dziedziczy ustawienia poprzedniej (kolor, grubość folii, wykończenie, folia), więc klient zmienia tylko wymiary.
Wycena w czasie rzeczywistym
Klient widzi kwotę netto i brutto z VAT 23%.
Cena bazowa z macierzy współczynników zależnych od wysokości i szerokości płachty (inny współczynnik dla każdego przedziału wymiarów).
Rabaty progowe zależne od łącznej powierzchni wszystkich płacht w zapytaniu.
Dopłaty za oczka (liczone od obwodu), grubość folii przezroczystej, profil usztywniający, wydłużenie o fartuch i drzwi.
PDF i automatyczna komunikacja
Klient końcowy dostaje mail z podziękowaniem i PDF w załączniku: logo DEKI, wycena w ramce w prawym górnym rogu (pozycje za każdą płachtę, uwzględniony rabat, netto, VAT, brutto), dane kontaktowe z adresem wysyłki oraz mini-podsumowanie każdej płachty (kolor, grubość folii, profile) ze szkicem.
Dział sprzedaży DEKI dostaje pełne podsumowanie z wszystkimi parametrami i kosztami, rysunki płacht jako PNG, zdjęcia załączone przez klienta oraz ten sam PDF.
Układ PDF został zaprojektowany pod realny obieg dokumentu w firmie: pod ramką wyceny biegnie pozioma linia odcięcia. Po wydrukowaniu wystarczy odciąć górną część, a reszta kartki (dane klienta, konfiguracja, szkice) nie zawiera żadnych kwot i może iść bezpośrednio na halę produkcyjną. Szkice są ułożone po dwa obok siebie, więc typowe zamówienie z dwóch płacht mieści się na jednej stronie A4.
Panel administracyjny
Wtyczka posiada również własny mechanizm aktualizacji, dzięki któremu kolejne wersje rozwiązania mogą być wdrażane bezpośrednio z poziomu panelu WordPress.
Jak pracowaliśmy
Zaczęliśmy od makiet graficznych iterowanych z klientem (układ ekranu, sposób prezentacji płachty, widok mobilny), przeszliśmy przez wdrożenie i uruchomienie na stronie, a następnie przez kilka rund dopracowania na podstawie realnych uwag z testów po stronie klienta: od nazewnictwa elementów na rysunku, przez logikę walidacji wymiarów, po układ dokumentu PDF pod potrzeby produkcji. Każdą zmianę weryfikowaliśmy zautomatyzowanymi testami wizualnymi rysunku i generowanego PDF, zanim trafiła do klienta.
Efekty
Samodzielna konfiguracja i wycena w kilka minut, bez czekania na odpowiedź handlowca.
Rysunek techniczny na żywo eliminuje nieporozumienia co do wymiarów i wykończeń.
PDF z wyceną i szkicami w skrzynce od razu po wysłaniu zapytania.
Efekty
Każde zapytanie zawiera komplet danych: wymiary, opcje, adres wysyłki, zdjęcia konstrukcji i gotowe rysunki.
Koniec ręcznego przeliczania wycen: cennik żyje w panelu, a algorytm liczy zawsze tak samo.
Dokument produkcyjny bez cen powstaje automatycznie, jedno cięcie nożyczkami.
Pełna kontrola nad treściami, zdjęciami i cennikiem bez angażowania programisty.
Technologie
Konfiguratory produktów na wymiar to jedna z naszych specjalności
Aby zapewnić jak najlepsze wrażenia, korzystamy z technologii, takich jak pliki cookie, do przechowywania i/lub uzyskiwania dostępu do informacji o urządzeniu. Zgoda na te technologie pozwoli nam przetwarzać dane, takie jak zachowanie podczas przeglądania lub unikalne identyfikatory na tej stronie. Brak wyrażenia zgody lub wycofanie zgody może niekorzystnie wpłynąć na niektóre cechy i funkcje.
Przechowywanie lub dostęp do danych technicznych jest ściśle konieczny do uzasadnionego celu umożliwienia korzystania z konkretnej usługi wyraźnie żądanej przez subskrybenta lub użytkownika, lub wyłącznie w celu przeprowadzenia transmisji komunikatu przez sieć łączności elektronicznej.
Zapamiętują Twoje wybory (np. region, język interfejsu, dark mode) — żebyś nie musiał ustawiać ich za każdym razem.
Pomagają nam zrozumieć jak korzystasz ze strony (Google Analytics, Hotjar) — anonimowe dane służą do poprawy UX.
Personalizują reklamy które widzisz na innych stronach (Meta Pixel, Google Ads). Pomagają nam docierać do osób zainteresowanych ofertą.
