Konfigurator produktów dla oficjalnego dystrybutora maszyn CAT w Polsce
Rodzaj projektu
Konfigurator produktów
Branża
Budowlana
Technologie
Drupal
Typescript
Vue.jsZakres prac
Projektowanie graficzne, UX, web development
Problemy przed naszą realizacją
- Skomplikowany proces konfiguracji produktów
- Brak kompatybilności wybranych elementów z danym typem maszyny
- Wydłużony czas wyboru maszyny
- Niezadowolenie (a niekiedy nawet rezygnacja) z zakupu produktów CAT
O kliencie
Bergerat Monnoyeur to autoryzowany dystrybutor maszyn Cat® w Polsce, oferujący kompleksową obsługę i wsparcie techniczne. BM-CAT zapewnia szeroki asortyment produktów - koparek, koparko-ładowarek czy spycharek. Maszyny sprawdzą się nawet do najbardziej wymagających projektów budowlanych czy przemysłowych.
Wyzwanie
Przed wdrożeniem konfiguratora, wybór maszyny na stronie CAT był wymagającym zadaniem. Wszystkie rodzaje maszyn oraz elementy dodatkowego wyposażenia były prezentowane osobno. Chcąc skonfigurować maszynę, Klient musiał zapisywać poszczególne wybory, a następnie wysyłać swoje zapytanie. Wiązało się to z ryzykiem, że wskazane przez Klienta elementy mogły być niekompatybilne z danym typem maszyny.
Cel projektu
Naszym celem było stworzenie konfiguratora produktów, który znacznie usprawni i skróci proces wyboru maszyn, a tym samym wpłynie na wzrost satysfakcji Klientów i przyspieszenie pracy działu sprzedaży.
Rozwiązanie
Oficjalna strona Bergerat Monnoyeur została zbudowana na Drupalu, stąd naturalnym wyborem przy tworzeniu konfiguratora była kontynuacja działań na tym systemie. Jakie rozwiązania wprowadziliśmy?
- Wyświetlenie strony głównej i panelu administracyjnego konfiguratora w oparciu o Drupal 9;
- dynamiczny konfigurator zbudowany we Vue.js działający na zasadzie SPA;
- konfigurator złożony z 4 kroków - wyboru typu maszyny, podstawowej konfiguracji (np. wyboru kabiny, silnika, oświetlenia), opcji dodatkowych (niestandardowego wyposażenia, rodzaju oleju czy typu gwarancji) oraz podsumowania;
- możliwość zobaczenia pełnej konfiguracji w ostatnim kroku, razem z wyliczeniem kosztów, a także opcja wysłania zapytania dotyczącego skonfigurowanego sprzętu.
Stworzony konfigurator umożliwia Klientowi szybko i wygodnie wybrać maszynę i dopasować do niej kompatybilne elementy; zobaczyć, ile będzie kosztował sprzęt w danej konfiguracji leasingu i automatycznie wysłać zapytanie. Ponadto, podczas procesu wyboru maszyny Klient może dowolnie zmieniać ustawienia i powracać do poprzednich kroków.
Szczegóły rozwiązania
User experience
Poza pracami developerskimi, nasz zespół był także odpowiedzialny za stworzenie szaty graficznej konfiguratora. Kluczem przy projektowaniu było zadbanie o maksymalny komfort obsługi rozwiązania zarówno na urządzeniach mobilnych, jak i desktopowych. W tym celu zastosowaliśmy m.in. jasno opisane etapy konfiguracji, możliwość zwijania/rozwijania każdej z sekcji oraz buttony „dalej”, dzięki którym użytkownik ma pewność, że nie pominie żadnego etapu tworzenia maszyny.
Single-Page Application
Jak wspomnieliśmy, konfigurator maszyn zbudowaliśmy na zasadzie SPA. Oznacza to, że kolejne działania podejmowane w ramach konfiguratora, np. przejście do następnego etapu tworzenia maszyny, nie wywołują przeładowania strony. Takie rozwiązanie znacznie przyspiesza działanie aplikacji, jednocześnie zapewniając użytkownikowi komfort podczas obsługi konfiguratora.
Wybór wyposażenia
W procesie konfiguracji dostępne są jedynie elementy i akcesoria kompatybilne z danym typem maszyny. Dzięki temu klient ma pewność, że stworzona przez niego wycena nie zawiera wyposażenia, które może nie odpowiadać wymaganiom konkretnego sprzętu.
Opcje leasingu
W trakcie konfiguracji maszyny Klient na bieżąco widzi, jak zmienia się cena sprzętu w zależności od wybranych opcji. W sekcji leasingowej użytkownik może ustawić i w dowolnym momencie zmienić m.in.:
- typ leasingu,
- czas trwania umowy,
- procent wpłaty wstępnej.
Na końcu oczywiście wyświetla się ostateczna cena skonfigurowanej maszyny.
Generowanie oferty
Po przejściu wszystkich etapów konfiguracji, Klient może nie tylko przesłać zapytanie do działu sprzedaży, ale także zobaczyć ofertę i pobrać ją w formacie PDF na własny użytek.
Import danych
Import danych w konfiguratorze można przeprowadzić na dwa sposoby:
- Klasyczną metodą – przeklikując dostępne opcje w panelu administracyjnym.
- Za pomocą pliku CSV przygotowanego według wzoru - opcja daje możliwość masowego zaciągnięcia danych np. o cenach czy wymaganiach technicznych maszyny do panelu, tym samym oszczędzając mnóstwo czasu.
Efekty pracy
Udało nam się zrealizować wszystkie założenia i maksymalnie usprawnić proces konfiguracji sprzętu CAT.
Po wdrożeniu naszego rozwiązania, Klienci Bergerat Monnoyeur nie muszą już przechodzić skomplikowanych kroków, by stworzyć maszynę dopasowaną do swoich potrzeb. Oto efekty naszej pracy:
Przejrzysty i intuicyjny konfigurator maszyn oraz parametrów leasingu ułatwiający Klientom dobranie elementów/akcesoriów do swoich potrzeb.
Uproszczony proces składania zapytań o maszyny.
Nieograniczone możliwości rozwoju konfiguratora o nowe opcje i etapy.
Nowoczesna szata graficzna, spójna z identyfikacją wizualną marki.
Proste zarządzanie konfiguratorem poprzez rozbudowany panel administracyjny Drupala.
Statystyki realizacji
750
7
4
Masz pomysł na konfigurator produktów?
Wdroż go z ekspertami Smartbees