Internet-of-Things Diagnostics Dashboard
An industrial technology company makes an Internet-of-Things product for monitoring the activity and status of gas station pumps. They wanted their existing enterprise software to offer a dashboard of real-time diagnostics data for each monitoring station in their network.
I began by working with business analysts to write twelve user stories, drawing on the analysts' interviews with customers. Each story documented a need for a specific piece of information in the dashboard.
Concerned that too much information can be hard to navigate, I designed a grid of cards which sorted the data into topics. Four distinct card formats let us display each card's information in a manner best suited to its content.
Great dashboards strike a balance between communicating a lot of data at a glance and remaining easy to read and understand. Too much information can overwhelm the user and slow cognition. I have found that displaying the data in the main layout while explaining the data in tooltips can minimize the visual clutter.
When I hand off a finished design to developers, I try to provide the layout's specific measurements to make their job easy and the final product polished. Here, I documented the heights, widths, gutters, and margins in pixels for each type of card.
