metrics_main@3x

Simulink Model Metrics

Insights into Systems Modeling and Engineering

Simulink Model Metrics is a dashboard application that allows system engineers to gather holistic insights by aggregating their project’s design modeling data into one unified interface.

Year

2015

Role

UI Designer, Data Visualization

Team

UX Researcher, Developer

Problem Definition

When developing large scale engineering projects where multiple teams need to collaborate it becomes extremely useful to understand the overall system balance, standards compliance, size and complexity so team leads can make better informed decisions. Up to this point the data was either unavailable or scattered across different tools in different formats making the process of monitoring projects quality and compliance extremely hard.

My Role

I got involved in this project after Development and UX Research had gone through a series of interviews with customers and subject matter experts in order to assess the user roles and goals and the product requirements. They needed my support to help them design the application User Interface and Data Visualizations.

Ideation and Wireframes

I conducted a series of brainstorm sessions with the team in order to understand the user flow as well as the types of data that the application would be able to provide.

The core application would be composed of two main screens – The Dashboard and Metrics Detail. An additional dialog would provide configuration regarding the files and data that the user wants to see aggregated.

Finding the Right Visualizations

The project required me to explore several forms of data visualization, in order to get the right insight into each data type. Some data was best expressed using numericals, other such as ranges and percentages, are best expressed using gauges. To understand density on a scale we used distribution graphs.

Different layouts and visualizations

Experimented with various ways of organizing and visualizing the data

Qualitative Visualizations

After the first reviews and gathering feedback from users and stakeholders we learned that the user wanted not only quantitative metrics but also the ability to understand at a glance the quality of the overall performance and distribution of the project or models.

For that, we substancially changed our visualization design. I introduced color coding to define quality as well as gauges and scales to allow comparisons.

Gauges

Gauges provide a quick view of a set of metrics without looking at absolute values

Horizontal Stack

Optimal for displaying size and percentage to a referenced whole unit.

Distribution Graphs

Allows a three dimensional view of the metrics, occurrence, density and quality.

The Application

Model Metrics is a typical modular Dashboard where different types of data are aggregated in blocks. These container blocks have a clear header and one of the the requirements was that it should be responsive. I worked with the team to prioritize the order in which the blocks should be displayed in smaller breakpoints. 

Visual Specs

Once we settled on a design I created a set of visual design specs to accurately communicate the design.

Challenges

  • Development team was located in Germany which made the design process more challenging. We had to find ways and tools to still enable a rich collaborative and participatory environment. We used video conferencing and online white boarding tools to work around our distance constraints for real-time collaboration as well as asynchronous documentation to keep the team on the same page.

  • Not being able to access real users testing and feedback sooner impacted our release deliverables.

Results

Despite the challenges we were able to deliver value to our customers from version 1 and their feedback was overwhelmingly positive:

  • Project Managers were waiting for a tool with this type of capabilities for years

  • Model Metrics has become an important source of revenue for the Simulink organization.