Dynamic Forms UI: Flexible and Portable Tool for easy UI Design

UI design is one of the key tasks to be done by developers. The design of front-end entities like forms and controls involves tedious coding and knowledge of styling. Furthermore, one has to consider ergonomics and user experience and feasibility aspects as well. The aim of the project is to design dynamic forms and rendering based on metadata of various fields. A large number of widgets (text boxes, drop-down, command buttons, radio buttons, checkboxes, lists and other hybrid controls) would be available. The fields in the form are customizable, and can be added or removed by drag and drop functionality. Furthermore, they can be validated as well. In addition, the look and feel of the widgets can be easily customized using a UI in a code-free manner. The data entered will be stored in a JSON format. A key aspect of this project is performance and portability. The form should be able to integrate itself with different products and APIs. Rendering of forms should be immediate with minimum downtime. Using this tool, one can design forms in Angular4 without having to code in Angular. This paper describes our preliminary work with respect to the stated goals.