Improving the user experience of a market leading control & monitoring app

Business challenge

We worked with a global leader in building control, remote monitoring and energy management solutions to improve the user experience of one of their flagship products.

DMTouch is a web app that can be configured to monitor clients metered consumables such as water, gas and electricity. The product provides consumption statistics and predicts budgets to improve operating efficiencies and reduce energy costs.

We were tasked with improving the user experience and overhauling the apps look and feel. A key goal was to bring the user interface in line with market expectations and the cutting-edge engineering that underpins the product.

Understanding user needs

We kicked off our discovery by understanding the various users of the DM Touch and the key tasks that were being performed.

Being both a responsive web app and a physical onsite device we were interested to learn how users interacted with the UI in different environments.

It became apparent during discovery that user needs where dependant on the consumable being monitored, the type of user and the size of client site. Any revised UX would need to take into account the diversity of the products usage and the needs of very different users.

Rapid prototyping

Once we had gathered enough insight we started wireframing and prototyping key tasks and journeys through the app, making design improvements where value could be added. We simplified the navigation to make the product easier to use and with less clicks and proposed a customisable dashboard of widgets that could easily be configured based on user type.

During prototyping we also addressed the importance of motion design to help improve the user experience alongside a set of messaging for when data could not be loaded. We also discussed the pros and cons of a range of front-end chart and graph libraries to determine the scope of changes the RDM product team were open to making during development.

The value of a design system

One of the issues with the existing product was that it didn’t have a consistent design language, largely because the app had grown organically over many years.

We created a design system to act as the single source of truth for the user interface to help RDM's product and development teams as they undertook the re-skin of the app. The system also provides a reference guide to help bring new features and functionality to market faster and more consistently in the future.

Results 

Following our design phase RDM began development of the solution internally. On release the product received positive feedback from both customers and partners with the sleek UI and new demand-driven functions and features. 

By working closely and effectively with RDM during our engagement we were able to provide an improved user experience and complete visual overhaul of the product in just a few months. A new design system allows product teams to work faster to bring new features to market over the coming years.

 Services provided

• Project management
• Discovery 
• Wireframing & prototyping
• Interaction design
• Design system