— ABOUT

Project at Neogrid

Technologies

— DATE

May 2023

Problem

A map page in the web tool for monitoring and controlling heat energy in buildings wasn’t utilized as intended. The features available did a minimum of providing a drill-down location view of buildings and informing the status of heat control boxes on locations. Internal- and customer feedback suggested that the map page had very little or no use for solving their tasks.

Stakeholders sought to elevate the map page's usefulness as they already had data capabilities that could be supportive in many monitoring tasks. However, they lacked a front-end UI that could convey them into useful features.

Approach

Developing the new map design with a user-centered design approach involved a multi-step process. The first step was conducting research to gain an understanding of user requirements and needs. Additionally, requirements from stakeholders were also gathered to align the new map design with business objectives. This was achieved by doing interviews, examining prior internal user research, and exploring related web tool solutions.

Next was using the gathered data to define user- and technical requirements, as well as defining use cases outlining how users will interact with the map page. These steps were important to ensure that the design met the needs and goals of the users, such as; flexible search and navigation for locations as they were of a complex parent-child structure, and showing informative data more clearly and actionable. In addition, these steps also framed the design exploration.

Ideation of new map features led to the creation of user flows to visually represent the paths that users take to achieve specific goals, like identifying locations with triggered alarms and acting on them. Wireframing was then done to create a low-fidelity prototype that shows the structure of the map page design based on the user flows and use cases.

A high-fidelity design stage followed, which involved creating detailed mockups of the map page and was used to present the design solution in critique sessions with stakeholders and different subject-matter experts. Next was creating handoff documentation for software implementation, which was done in collaboration with the software team to ensure clear descriptions and guides.

Results

The new map tool ensures that the users have easier navigation for searching and viewing different location types at different drill-down levels, as well as easily identifiable statuses of the heat control boxes. The user is also supported in actions to take when dealing with a location and the box status in question. Furthermore, the new map tool has also been future-proofed for features in development that will make this tool more comprehensible for users working on monitoring and controlling heat energy in buildings.