Bergerat Monnoyeur

The product configurator for an exclusive CAT machines distributor in Poland

Check out how our team designed and deployed the solution allowing a complex CAT machine configuration.

Product configurator Bergerat Monnoyeur
1
The issue
See
2
Our solution
See
3
Solution in details
See
4
Realization in numbers
See
5
The results
See
6
Technologies
See

The issue

why did we establish cooperation?

Before the configurator development, the machine choice on the Bergerat Monnoyeur website was a challenging task. All of the machine types and additional equipment were presented as individual products. Thus, when a customer wanted to configure the machine, he had to write down all the elements and then sent an inquiry via email. Although it was a time-consuming process, there was a high risk that chosen parts were not compatible with the machine. The product configurator development was a big step ahead. It could vastly improve and shorten the configuration process. As a result, it might increase customer satisfaction and speed up the sales department's work.

Products listing Bergerat Monnoyeur configurator

Our solution

which strategy did we apply?

The official Bergerat Monnoyeur website is based on Drupal. Thus, the technology choice for this project was not surprising. The configurator’s administration panel was made using this CMS. Moreover, Drupal 9 is responsible for displaying the home page. Our team used Drupal’s API to build a dynamic product configurator in Vue 3, which works as a Single-Page Application.

The configurator consists of four steps – machine choice, basic configuration (e.g., cabin, doors, engine choice), additional equipment (e.g., customized parts, warranty type), and the summary. In the last step, the customers can see all information about the configuration, including estimated costs. Then, he can send an inquiry in one click. The customer can conveniently choose and customize the machine using the configurator. He can see how much the product will cost and send an inquiry within a few clicks. Furthermore, during the configuration process, the customer can freely change settings and go back to the previous steps.

Solution in details

which areas were crucial?
Mobile version of Bergerat Monnoyeur configurator

Data import

There are two ways to import data to the admin panel – by clicking available options in the admin panel or via a prepared CSV file. Thanks to the second option, one can import multiple product price or technical requirements data. Such a solution is a real-time-saver for the configurator’s managers.

Single-Page Application

As mentioned, the configurator was built as a SPA. It means that any action, e.g., moving to the next configuration step, doesn’t induce the page reload. Such a solution vastly fastens the application, simultaneously ensuring convenience to the users.

Equipment choice

During the configuration process, the customer can only choose elements and accessories compatible with the particular machine type. As a result, there is 100% assurance that the estimate includes solely the equipment compliant with the machine specification.

Leasing options

When configuring the machine, the customer can see live the machine cost changes, depending on the chosen options. In the leasing section, the user can set and change, e.g., the leasing type, the contract duration, the percentage of the initial payment, or check the final cost of the configured machine.

Offer generation

In the final step of the configuration, the customer can not only send an inquiry to the sales department but also see and download the offer in the PDF for his use.

User experience

Our team was responsible not only for the development works but also for the graphic layout design. The biggest priority was adjusting all views to the mobile and desktop devices to ensure maximum convenience for all users. Thus, the project includes, e.g., configuration steps, drop-down sections, and a „next” button on each configuration stage.

Realization in numbers

project’s statistics
0

The graphic design and development works took us around 750 hours.

0

We designed and deployed 7 mobile and desktop views.

0

The team consisted of 1 Back-End Developer, 1 Vue Developer, 1 Tech Lead, and 1 Project Manager.

CAT machine configuration process

The results

benefits for our Client
  1. An intuitive machines configurator that greatly eases elements/accessories choice.
  2. Simplified inquiry process.
  3. Nearly unlimited development possibilities in the future.
  4. An up-to-date graphic layout compliant with the brand’s visual identification.
  5. Simplified configurator management thanks to Drupal’s extended administration panel.

Do you have an idea for a product configurator?

Let’s make it real with Smartbees experts!