0
1
2
3
4
5
6
7
8
9
Contact Us
1 / 1
slide-image
Formbuilder customization
1 / 1
slide-image

Project Details

Our project aimed to develop a customizable form builder tailored to specific business requirements. Key features included real-time customization of form styles using intuitive controls like sliders, inputs, checkboxes, and color pickers. Additionally, the system needed to support dynamic loading of components from the backend to accommodate diverse marketing campaign needs and allow for easy addition of new options in a modular manner.

To expedite development, we opted to integrate an existing, free form builder library into our solution. However, adapting this library to meet the client's unique requirements proved challenging due to its complex architecture and limited internal documentation. We had to rely heavily on code exploration and trial-and-error methods to implement custom style adjustments and ensure consistency across different states of the form.

While the library offered extensive options for standard modifications via a modal interface, our client needed more tailored solutions. They specifically requested a streamlined interface, with only essential options accessible from a sidebar, along with some non-standard features. This necessitated the development of a flexible mechanism for updating form fields, enabling efficient addition of new options while supporting conditional logic.

Moreover, we encountered differences in how the library handled single-page versus multi-page forms, adding another layer of complexity to the project. To seamlessly integrate the generated form into the client's website without affecting existing styles, we utilized web components technology, ensuring complete isolation of the form.

This project showcased our ability to adapt and extend existing solutions to meet specific business needs, highlighting our innovative approach to design and implementation while overcoming challenges associated with modifying third-party libraries.

 

Technologies
Vue.js
Details
Time iconTime Spent
100h

Project Crew

contribution-logo
Frontend Development
Enhanceв Formio with client-specific features without rewriting its base code