Quality Control

Design system for dense forms

I had the opportunity to do a quick, and very interesting, UX/UI design project for a client who's primary offering is a very detailed quality control application. They were making a move from native Windows application to entirely web-based and wanted to take advantage of the rewrite of the app to improve the experience. They needed to start development in four weeks.

 

Control Library

Because of the short turnaround and the fact that they needed help with both visual and experience design, we took a conservative, but proven, design route focused on usability. We started with a control library and then opted for high-fidelity hero wireframes. We also provided detailed interaction states since there was a heavy focus on form customization.

 

Field Edit Options

Drag/Drop States

What we delivered at the end of the project was a complete set of control states, hero screens and interaction flows. The feedback was extremely positive, and the development team was comfortable interpolating from our hero screens the smaller states required to complete the development work.

full screen.PNG