The most important task within the project was to work out the combinatorics properly. In order to be sure that the door designed using the web app tool can be manufactured, it was necessary to analyse thoroughly the process tree and elaborate on that basis a file that would describe the combinations possible.
Company
Multi-Form
Relationship
Since 2017
Line of business
Interior finishing, distribution
Project type:
Web application
Configuration tool
Technologies:
PHP, HTML, Node.js, React, Flux, Redux, Bootstrap, REST API, PostgreSQL
Multi-Form has been supporting its clients – owners of a door and flooring showrooms – in development of sales by providing them with high-quality interior finishing materials (doors, floorings, and building materials). A broad range of door configuration options and a wide array of additional components led to the need to create a tool that would allow faultless, quick and intuitive cost estimation and product visualization. Additionally, the company wanted to provide the individual clients with access to the application in order to help them decide how the perfect door to their home should look like. We created for it a functional door configuration tool that leads the user through the cost estimation process and generates a document that includes visualization and specification of Persecto brand door.
> 10 000 000
number of possible configurations in the tool
200
number of Multi-Form showrooms taking advantage of the configuration tool
2
the configuration tool is available in a version for individual clients and in a version for showroom employees
How to design an easy to handle and permanently up-to-date configuration tool that will allow designing perfectly fitting doors and support their sales?
5 minutes before the project starts
01 Work out the combinatorics
The most important task within the project was to work out the combinatorics properly. In order to be sure that the door designed using the tool can be manufactured, it was necessary to analyze thoroughly the process tree and elaborate on that basis a file that would describe the combinations possible.
02 Enable the client to make changes
One of the collaboration assumptions was designing the configuration tool in such a manner that the updates to the information contained within it does not generate any additional costs and are easy to introduce. Our task was to enable Multi-Form to make changes without our involvement.
03 Care for visualizations
Preparation of graphics for the configuration tool was the responsibility of Multi-Form. We were supposed to make sure that the finished visualizations look well within the configuration tool in various screen resolutions.
An interactive door configuration tool for store employees and individual clients
How does it work? - the most interesting elements of our solution
01 Defined steps
The door configuration process was designed to feature a few simple steps. First, the user chooses the door type - external or internal. Next, they choose one of the models, which, in turn, are assigned to collections. Another step consists of a visual configuration of the door - after choosing a model, a default configuration is loaded that can be freely changed and overwritten. After finishing the configuration it is possible to generate a .pdf file with a complete product specification.
02 Module for vendors
The employees of authorized points of sale sign in to their dedicated account in the configuration tool. From there they can create any number of door configurations, together with price estimates with discounts applied. Each price estimate is recorded in the configuration tool, thanks to which the vendor always has access to the complete price estimation history. After creating a configuration, the vendor can save it in a .pdf file and send it via e-mail to the client.
03 Module for individual clients
Individual clients can design their perfect door through the configuration tool available on the Multi-Form website. Next, to the possibility of signing in and receiving detailed information on pricing, the scope of functions of the online tool is the same as that of the configuration tool available at the showroom. The client may also save their configuration in a .pdf file, which provides a starting point for further talks with the vendor.
04 Product updating
In order for the process of updating the products available in the configuration tool - i.e. by uploading new visualisations, replacing them or changing the product descriptions - to take place in as simple and effortless a manner as possible, we designed and provided a .csv file containing combinatorics, which can be freely changed and uploaded to the server by employees of Multi-Form on their own.
05 Importing the .csv file
In order to update the information included in the configuration tool, the employees of Multi-Form make changes to the .csv file with combinatorics and upload it to the system. If any fundamental errors appear in that file, the system stops importing it automatically and indicates the incorrectly filled cells. Importing the file again is possible only after the errors are resolved.
06 Visualisation of models
To each model, there is assigned a single default image of an example wing, which has to be clicked on to be selected. If a given collection includes plenty of potential models, then a slider is activated that enables horizontal scrolling of models if the collection does not fit a single screen.
Recommendations
Programa™ handled perfectly the complexity of our project – elaboration of combinatorics, door generation correctness and adequate door visualization. They were a partner to us at every stage of collaboration, supporting us with their knowledge and experience...
Justyna Skrzypnik
Online marketing specialist in Multi-Form
The process in a nutshell
How did we work on this project?
01 We elaborated a configuration map in collaboration with the client
Elaborating the logic of configuration and combinatorics is a complex process. The knowledge on how to configure the doorstep by step is present in the minds of the experience vendors working in Multi-Form showrooms. In order to collect and arrange this data, the client prepared an extensive process tree, on the basis of which we elaborated the combinatorics. The result - a .csv file with over 30 tabs filled.
02 We have supported the process of creation of visualization and graphics
Preparation of the graphic design of the configuration tool and the visualizations used within it was the responsibility of Multi-Form. However, in order to be sure that the visual part of the project is going to go well with the previously designed functional mock-ups, Adam Czarny - our creative director, collaborated closely with the client, performing the function of a front-end consultant.
03 We ran the project remotely in 100%
We value face-to-face meetings with clients, but projects can be run efficiently also in remote mode. That is how it was in the case of Multi-Form, where in view of the distance and the time savings we were organizing Skype meetings and communicated via telephone and e-mail. We focused on bilateral responsiveness, thanks to which the tasks planned were completed on time.
-> Do you need a similar solution? Write a short email to hello@programa.pl or call +48 577 196 681 - get to know us and let us know you!