Asset Explorer
Map industrial assets, contextualize them,
and compose whatever data model is needed.
Equipment Management
This design and implementation were for an entire section of an industrial software that has the commitment to digitize and clean all the data that comes from different data sources in an industrial company unlocking years of static and overlapping of data to prepare the data for analytics and to achieve new levels of operational performance.
Asset Explorer allows engineers from
industrial businesses in the ecosystem of
upstream oil, gas, power, and manufacturing plants
to locate and track equipment and their
metadata around the world.
Problem-Solution Statement
Provide a very flexible way to build an asset data structure called hierarchy to allow different data consumers to view information about the relationships between its equipment in a way that makes sense for each one of them. For example, what is valuable for a process engineer who wants a hierarchy to target the good and effective functioning of the plant processes as for a site engineer who needs to track the maintenance of equipment.
In this environment is important to understand and define industrial terms. Equipment is referred to as physical pieces as compressors, pumps, valves and types, turbines, furnaces, etc that are performing a process over time. This equipment collects data from sensors and transmitters that are stored in large spreadsheets and databases.
Understanding Requirements
The organization and division of content started with the definition of main requirements using a sorting system as virtual sticky notes to move around sections and understanding content and functionalities making the connection between different pieces of information using product tags categories.
Everyone involved in this product development applied information architecture methodologies during the design process and started from the product manager requirements list filled with users feedback and product needs.
I started thinking carefully about how to present to the user, for example, 3M tags of metadata interconnected per user view and utilize the real state of the viewport meaning vertical and horizontal space. Defining information architecture helps to define a foundation for the UX.
Research
Challenges
Facilitate data mapping
Display large views as granular
Provide a flexible model that scales
User Research & Personas
Industrial companies have different engineering roles across the organization for this particular section of the company's operation are two types of personas that are responsible for the proper functioning of the plant at the process level and at a maintenance level of physical equipment.
Each one has to build a nested view to map and monitor all the equipment also to easily locate it, in some cases when the company is very big, engineers can replicate this view and mapped to a larger plant and in multiple regions in the world.
These personas are a process engineer that makes sure that the processes are running correctly and efficiently and a site engineer who is responsible for maintenance. Both are running under safety protocols.
Data Models & Inspiration
Once the investigation has progressed, I carried out a study of data behavior. I understood its own grouping and expansion as a big container containing inside more related pieces that conform an instrumentation process.
Data Model Expansion
In other words, this data model needed grouping, categorization, and infinite expansion always keeping relationships of parent-child something that the engineers call ancestral tree mapping.
Sankey Diagram Reference
You might typically see this diagram used to show the flow of money, materials, information, or energy.
From Sketching to User Interface
I envisioned the use of the entire real state of the canvas to fit large data but in a restructured manner.
Understanding the information architecture of this product section was a very important key to come up with a very flexible data model solution.
D3 libraries used for the flow connections I used the Bézier curves to offer some guidance to developers D3 Library
Reviewing wireframing to polish final features
IA was essential for helping users to understand the new section in the software to speed up the asset frame building meanwhile enjoying doing it.
Using data visualization can help with the understanding of complex data resulting in a new model keeping the main principles, in this case, flows builds the connections of data.
UX Solution
With this design solution was possible to resolve many use cases in the market, especially in the transmission and distribution industry, the hierarchies demand of an entire company that reflects a large and complex distributed infrastructure. With this implementation, the software managed to support millions of data flows and hundreds of levels of depth.
Cards were used to contain and organize in a powerful index card multiples views of customers' facilities at an enterprise level. Cards provide highlighted information about the structure, deep, timestamps, ownership, and permissions.
Hierarchy Builder
Our customer's data is organized by large data tables that contain the typical use of headers, columns, and rows, commonly they used Excel to map and filter the information which is presented without any structure and presented at once. This data have relationships between parent and child but this table does not present a clear map to that.
Incremental Features
Using data visualization can help with the understanding of complex data resulting in a new model keeping the main principles, in this case, flows builds the connections of data.
Key Learnings
The principle of disclosure was highly used in this solution, which deals with the fact that people can only process new information in a certain way. Meaning by this is that people can’t consume large data at once because can cause cognitive load or don't want to deal with unwanted information.
Recognition rather than recall. Keeping consistency on the use of information maintaining main titles on headers and flyouts to always guide so the user knows exactly where he is and where to find the desired information.
User interaction to allow discoverability. The disclosure happens when the user clicks on the expansion of nodes to discover more information contained.
Conclusion