Interface Design for HTML Form Builder (SaaS)

Designed in collaboration with a leading Indian SaaS provider, this tool lets industrial users create detailed forms by utilizing HTML based elements, database bindings and inter-dependencies.

As the team's UI/UX designer, I performed technical research, content mapping, wireframing, visual design, icon design, and preparation of interactive mockups/prototypes. In doing so, I helped take the project from a conceptual stage to finished designs, for handover into development.

I worked primarily with the Project Manager, who ensured that the design process meets all objectives, and secondarily with a developer who offered technical support.

The project went through the following stages:

• Discussion of Requirements, and Technical Research: I spent considerable time discussing and establishing design objectives with the Project Manager, and understanding the capabilities and limitations of the product.
• Content Mapping: I created an exhaustive list of the functionalities, then organized and structured the same using semi-visual content maps.
• Wireframing: I created wireframes to map all functionalities on the screen, giving visual structure to the tool. I also created interactive low-fidelity micro-prototypes, to refine individual features in isolation.
• ‍Visual Design / High Fidelity Mockups: I developed the wireframes into high fidelity mockups with refined layouts and well-crafted components and controls. Typography and colour schemes were also developed and standardized.
• ‍Icon Design: I crafted large icons for the various HTML components, and a variety of smaller icons for the interface controls.
• ‍Interactive Prototypes: Finally, I put together some longer, end-to-end interactive prototypes showcasing a user’s entire journey through the tool.
• ‍Asset Export and Handover: After incorporating the team’s feedback, I exported all assets and shared them with the development team.