Konfigurator DC Smart Home - Dedykowany konfigurator włączników oraz gniazdek połączony ze sklepem internetowym
Klient
DC Smart Home — producent i dystrybutor osprzętu elektrycznego klasy premium (szklane i metalowe ramki, dotykowe włączniki, gniazda, akcesoria).
Cel projektu
Stworzenie dedykowanego konfiguratora gniazdek i włączników z pełną integracją z platformą sklepową PrestaShop, umożliwiającego klientom samodzielne projektowanie zestawów, natychmiastową wycenę oraz szybki zakup skonfigurowanego produktu.
Funkcje kluczowe
- Konfiguracja zestawów: wybór kolorów, materiałów, liczby puszek oraz wkładów dla każdej puszki.
- Podgląd projektu w czasie rzeczywistym z dwóch perspektyw oraz zmiana koloru tła/ściany.
- Automatyczna wycena konfiguracji z rozbiciem na ceny elementów składowych.
- Generowanie karty PDF z rysunkiem, listą produktów, linkiem i kodem QR do zakupu.
- Dodawanie skonfigurowanego zestawu do koszyka i finalizacja zakupu w PrestaShop.
- Zapisywanie i udostępnianie konfiguracji (link/QR) do późniejszego wznowienia lub konsultacji.
- Panel administratora do zarządzania katalogiem elementów dostępnych w konfiguratorze.
Wyzwania związane z projektem
Modelowanie złożonych zależności produktowych
Powiązania między ramkami, wkładami i puszkami wymagają walidacji zgodności (formaty, kolory, materiały) oraz dynamicznego doboru kompatybilnych opcji przy zachowaniu czytelnego UX.
Wydajny rendering i wycena w czasie rzeczywistym
Równoczesna aktualizacja wizualizacji z dwóch widoków, zmiana koloru ściany i natychmiastowe przeliczanie cen wymagały optymalizacji frontendu i sprawnego cache’owania danych cenowych.
Integracja z PrestaShop i koszykiem
Mapowanie konfiguracji na produkty/składniki sklepu oraz generowanie SKU/kompletów musiały być zgodne z logiką magazynową i promocjami, przy zachowaniu prostoty dodawania do koszyka.
Generowanie dokumentów z odwzorowaniem konfiguracji
Automatyczne tworzenie PDF z rysunkiem, tabelą komponentów, kosztorysem oraz linkiem i kodem QR wymagało spójnego szablonu oraz niezawodnego renderingu serwerowego.
Proces współpracy
Przeprowadziliśmy warsztaty z klientem, by zdefiniować warianty produktów i reguły kompatybilności. Następnie przygotowaliśmy makiety UX i prototyp wizualizacji. Konfigurator został przygotowany jako moduł do Prestashop korzystający z informacji zawartych w bazie danych. Wdrożyliśmy panel administracyjny do zarządzania katalogiem elementów oraz szablon generowania PDF. Po etapie testów end-to-end (walidacja konfiguracji, koszyk, płatności) uruchomiliśmy rozwiązanie produkcyjnie i przeszkoliliśmy zespół klienta.
Korzyści dla klienta
- Wyższa konwersja dzięki wizualnemu konfiguratorowi i natychmiastowej wycenie.
- Mniej błędów zamówień dzięki regułom kompatybilności i czytelnej liście komponentów.
- Skrócony proces sprzedaży — konfiguracja → koszyk → zakup w jednym przepływie.
- Elastyczność asortymentu — samodzielne zarządzanie elementami w panelu administratora.
- Lepsze doświadczenie użytkownika poprzez podgląd z dwóch stron i zmianę koloru ściany.
- Wsparcie posprzedażowe — karta PDF z QR/linkiem do łatwego odtworzenia konfiguracji.
