Infocapture 2012

Role

UI Designer

Technology

HTML5
CSS
jQuery

This work involved exploring and prototyping a new method of creating custom data forms for Infocapture, one of the most popular modules of the Claromentis intranet platform.

For me this was an extremely interesting project to undertake. Going into this project, myself and the rest of the team assumed that having the ability to drag and drop fields to create a form would provide a much improved user experience. Developing a hi-fidelity prototype to test this theory, the conclusions weren't as expected.

The initial prototype used a single toolbar with a number of field type options at the top of the page. By dragging and dropping different field types from this toolbar Users were able to create a dynamic form quite quickly. However within a few moments of using this method it became apparent that dragging and dropping was quite a time consuming process. The major contributing factor for this was the time it took for the user to move their mouse to and from the toolbar each time a new field was added.

As a result of this research an alternative solution had to be implemented. In this case a context menu was used, rather than dragging to add new fields the user simply selected the field type from a contextual toolbar. The selected field type was then inserted into the related form section. Once inserted in this way, drag and drop could still be used to move fields around but only needed to be done in a more localised way.