Our friend Jens from the Siemens MindSphere team recently approached us with an interesting proof-of-concept (POC) project.  This post chronicles the first step in our journey with Jens to implement a Pump System POC using Edge2Web Director and MindSphere.


In April, Jens was co-presenter of a Beer Plant demonstration at Hannover Messe 2018, one of the world’s largest industrial trade fairs. During the presentation, Jens and his colleague Ingo demonstrated the conception and deployment of an app that manages a liquid (beer!) pumping station.  It’s a very cool demo and definitely worth watching.

Jens suggested we create an extended version of their app, using Edge2Web Director, with the following functionality:

  • An enhanced dashboard that displays the Pump System data in a variety of visualizations.
  • A mini diagnostic guide to help plant engineers quickly identify what’s wrong, in real time, when the system fails.
  • A historical analysis of system failures including mean time between failures (MTBF), mean time to repair (MTTR), number of problem occurrences in defined time frames, and other interesting metrics.

This post discusses our POC implementation of the first two ideas on Jens’ wish list – enhanced dashboarding and mini diagnostic guide.  In total these two applications required 32 lines of code (Javascript) to implement, 25 of which were needed for one component – the Pump Plant Location map.

The Pump System Dashboard

Our Pump System dashboarding goal was to incorporate some nice elements of the Hannover Messe demo while offering a few other interesting visualizations. The screenshot in Figure 1 below shows a map with a pin at our plant location, along with a descriptive pop-up when the pin is pushed. Other visualizations show traditional timeseries graphs, liquid gauges with data driven color thresholds, and cards with mixed elements. The dashboard reports current data values by default, but can also be driven by date and time pickers that are available when Auto Refresh is switched off (see the page header element).

An important nuance of Edge2Web dashboards is the ability to configure different data refresh intervals for each display component. This powerful feature optimizes resources when data is updated in MindSphere at different velocities. For example, analytic services that run once per day (not shown in the Pump System dashboard) can be displayed on the same page alongside real-time data, with each display component querying MindSphere at intervals that are tuned to its respective data sources.

Figure 1.  Pump System Dashboard


The Mini Diagnostic Guide

Where dashboard pages give users information at a glance, Edge2Web guided applications add powerful navigation and interaction that bring industrial insight to the next level. Guides are particularly useful for multi-step applications that require live connectivity to industrial machines and processes.  Examples of guided apps include system start-up and shut-down procedures, machine diagnostics, fleet management, EHS compliance monitoring, process optimization, and mobile field service, to name a few.

Figure 2. Pump System Guide – Home Screen


Figure 2 shows the Home screen of our guide.  This simple screen displays an image of the Pump System and provides a bit of narrative text describing what the guide does. Figure 3 shows the System Metrics screen, which is displayed when the user hits the View System Metrics button above the guide.  Notice that the View System Metrics button changes to Refresh System Metrics when the user navigates to that screen.

It is also noteworthy that user navigation for this guide – the nav buttons that appear above the guide screens – was achieved with zero coding.  We as developers simply defined the nav buttons we wanted to present, styled them to our liking (shape, size, color, location), and then implemented the user functionality for each button.  For the Home screen, the functionality is simple – display a small table with a title, a static image, and some descriptive text.  For the System Metrics screen, we implemented a more interesting table showing pump metrics in a variety of renderings including plain text, liquid gauge, utilization gauge, timeseries area graph, and power gauge.  We included status icons in the last row of the table that change in context with the Pump System’s operating state.

Figure 3. Pump System Guide – System Metrics Screen


Jens also wanted the guide to model different operating states of the Pump System – normal operation, failure due to a problem upstream from the pump, and failure due to a problem downstream from the pump.  The Run Diagnostics button executes different branches of the guide’s flow logic based on the data values returned from MindSphere.  Figure 4 shows the Diagnostics screen when the Pump System is operating normally.

Figure 4. Pump System Guide – Diagnostics Screen Showing Normal Operating State


By manually triggering a problem (Jens has a clever way of doing this independent of Edge2Web), the Pump System can be put into one of the two failure states.  Figure 5 shows the Diagnostics screen when the system is failing due to a problem upstream from the pump.  It illustrates a variety of data-driven visual effects that allow users to quickly see what’s happening, and it provides specific guidance on what actions should be taken for this type of failure.  When Jens triggers a failure downstream from the pump, users are presented with a different screen that provides visibility and guidance specific to that use case.

Figure 5. Pump System Guide – Diagnostics Screen Showing Failure State


Journal Summary

The Pump System application illustrates some of the useful visualizations and functionality that can be created using Edge2Web Director on MindSphere.  It shows MindSphere asset and timeseries data rendered in a variety of ways; it demonstrates both a dashboard and an interactive guide; and it illustrates how data, rich content, and industrial domain expertise can be combined to deliver insights that optimize enterprise agility and action.

It bears restating that the dashboard and guide applications described in this post required 32 lines of Javascript code to implement, 25 of which were needed for one component – the Pump Plant Location map.  Both apps were developed by a non-programmer, with a little help from a Javascript developer.

Jens has other ideas for taking the Pump System demo app to the next level.  For example, our POC does not yet implement the suggested historical data analysis – that’s now on the roadmap along with several other interesting suggestions.  We are excited about the possibilities!