High-fidelity wireframing
High fidelity wireframes were created for the registers, transforming them from an Excel document into a feature rich web tool. Digital Garden carefully structured the register to follow best-practice UX patterns and reflect common spreadsheet functionality that users were familiar with.
The main challenge for designing the registers was accommodating the large amount of data. Some registers in the scheme have over 30 columns and hundreds of rows of data. The new registers were created in a scrollable, tabulated format that has multiple pages. A hide/arrange column functionality was created to allow users to reduce the amount of data and focus only on what they need. A robust filtering function is also available, allowing easy drill-down to relevant data.
Icon usage and UX microcopy were closely considered to ensure the different functions of the registers would be intuitive. For example, do users understand how to arrange fields in a list using a grab handle icon? These choices were to be validated in usability testing after the UI concept was designed.