From 2013 to 2017, I was the primary Interaction Designer/UX Specialist on Capevo XForm, later KMD XForm, a standard platform toolset for creating and operating advanced government-grade web form solutions.
Challenge
How could we offer clients responsive form solution tools with a short time-to-market? The previous version of the KMD XForm editor wasn't built for the age of responsive web design, where form layout automatically adapts to various screen sizes from smartphones to big desktop displays. To meet market and client demands, that is – in essence to ensure company relevance going forward – it was imperative to quickly develop a tool for creating responsive forms.
Process
In the course of a few months, I wireframed and prototyped designs for a completely new advanced code editor. During the entire process including implementation I worked closely with one of our a talented full-stack developers, with both of us contributing valuable ideas.
Outcome
A powerful in-browser code editor with a visual live preview helping our consultants quickly and easily deliver responsive form solutions to clients.
One of the very first Balsamiq sketches with multiple full-height panels.
Further explorations of a design split into panes.
A rough HTML prototype of a three pane design.
The final KMD XForm Responsive Editor design with the ability to edit source code HTML, CSS and JavaScript while live previewing the resulting form on the right.
