IoT Monitoring Dashboard Development for IoT Devices

IoT systems combine tens, hundreds, or even thousands of devices, sensors, and other data sources. Monitoring and ensuring effective interaction between IoT devices are a must. 

An IoT control panel is the solution for keeping track of all IoT devices and getting maximum insights out of them. 

IoT monitoring dashboard is more than just an interface — it’s the command center for your connected devices. 

Whether the end-user of your IoT system is a homeowner monitoring smart lights or a facility manager overseeing a complex network of industrial sensors, a well-designed, convenient, and informative panel is essential to ensure customer satisfaction.

WebbyLab experts have been developing IoT solutions for over five years. During that time, we’ve delivered 10+ projects and created 3 of our own products, including 2Smart Standalone, 2Smart Cloud, and Propuskator. 

Here’s our insight:

Every successful IoT project requires a control panel in one form or another.

Kostiantyn Oliynyk, Head of IoT at WebbyLab

In this article, 

• We’re sharing our experience and practical insights on building a control panel for monitoring IoT devices. 
• We’ll tell you how to create an IoT control panel that becomes an indispensable tool for users — the core interface for managing, monitoring, and analyzing all their IoT devices.

 An IoT control panel of the 2Smart Standalone automation platform developed by WebbyLab

Why Do You Need an IoT Dashboard?

The development of a control panel for IoT devices, or an IoT monitoring dashboard, is integral to any IoT system. It goes beyond simply displaying data. It lets users organize, process, and analyze the info collected from devices. Here are just a few reasons to incorporate this smart technology into your IoT solution:

Real-Time Data Collection

Picture having a live flow of information from all your connected devices. An IoT monitoring dashboard offers just that. It lets you collect, transmit, and interpret data in real time. Ultimately, you identify issues quickly, make well-informed decisions, and improve operational efficiency.

Remote Monitoring

Want to monitor your IoT devices from anywhere? Consider implementing an IoT dashboard. It allows you to access and monitor your devices remotely through an internet connection.

Remote IoT device monitoring through 2Smart Standalone

Versatile Solution

An IoT dashboard is equally useful across various industries. That’s another reason to incorporate it. Look how different sectors benefit from such a tool:

• Home automation. Monitor light, temperature, and other sensors, adjust lights and appliances, automate watering systems, check security cameras, and so on.
• Manufacturing. Monitor production lines in real time, identify bottlenecks, optimize resource allocation, and ensure product quality.
• Healthcare. Monitor patients remotely through wearables and sensors, provide timely treatment, supervise medical equipment, etc.
• Military. Use IoT dashboards to monitor equipment in the field, manage logistics, and even gain insight into the real-time battlefield situation.
• Smart buildings. Track temperature, humidity, and air quality in real time, monitor critical building equipment like HVAC systems and elevators and reap the benefits of centralized access control systems.

Using the IoT control panel of WebbyLab’s 2Smart Standalone for home automation

Important Criteria When Choosing or Building an IoT Control Panel

Developing a custom-made IoT monitoring dashboard requires a well-thought-out approach. In particular, pay attention to the following aspects:

Determining User Profiles

When choosing or developing an IoT control panel, the end user’s profile is a crucial factor to consider. 

In WebbyLab’s experience, it significantly influences both the final design and functionality of the panel.

Typically, we distinguish the following two user profiles:

• Individual consumers. If you build a panel for regular consumers, the control interface usually becomes a mobile application. It features structured elements for easy management and monitoring, with less frequently used parameters hidden deeper in the app.
• System administrators. Panels designed for administrators of complex systems like an automated grain elevator with IoT require a convenient and informative interface. Such dashboards keep a lot of information in one place, including filters, sorting options, and search functionalities to enable quick access to the necessary parameters.

Defining Usage Scenarios

Besides user profiles, it’s also necessary to outline usage scenarios for the control panel in IoT. Examples of possible scenarios are:

• Standardized interfaces. For setups with a clear device lineup and minimal expected changes in sensor and parameter configurations, targeting end consumers, it’s practical to develop standardized interfaces. Customization, if needed, should be minimal, primarily focusing on user convenience.
• Configurable dashboards. For systems catering to administrators, configurable interfaces are a must. Customized dashboards with a library of widgets let users tailor interfaces to their specific needs and display relevant data, enhancing overall usability.
• Universal interfaces. For systems that accommodate dynamically added or modified devices and actuators in IoT, a universal, preferably self-declarative interface is recommended. This approach streamlines interface development, ensuring all devices, new or old, are displayed in a standardized format familiar to users.

In my experience, it has never been possible to build a static interface for an IoT device at the project’s outset. I’m a fan of dynamic interfaces that can be changed and reformed. Ideally, they should be self-declarative and universal for all devices.

Kostiantyn Oliynyk, Head of IoT at WebbyLab

The 2Smart Standalone platform’s on-site control panel on the touch screen – built by Webbylab

Outlining Control Panel Goals and Functions

Depending on the goals set for the dashboard, you need to create a list of functionalities and tasks it should fulfill. This may include such IoT control panel features as:

• Real-time remote sensor monitoring
• Individual or group sensor management
• Analysis of historical data through graphs or tables
• Access to aggregated statistics

It’s also essential to establish user permissions and roles. Distinguish between:

• Those who can only view data
• Those with control and viewing rights
• Those assigned to customize and create devices

Additionally, ensure simultaneous panel usage by multiple users to avoid conflicts in device commands. You can achieve this by developing real-time interfaces. 

WebbyLab experts appreciate this approach as it improves the overall user experience and facilitates seamless IoT device management.

Key Features of IoT Control Panels

Let’s now go through the main features of an IoT monitoring dashboard that make managing and interacting with data a breeze:

Visual Data Presentation

Raw data collected from sensors and devices may be challenging to interpret. Another control panel’s feature, visual data presentation, transforms this data into easily digestible formats. These include:

• Charts and graphs
• Interactive dashboards
• Alerts and notifications

Real-Time Data Processing

The ability to process data right away is the IoT control panel’s edge. This allows for immediate analysis and reaction to events as they unfold. For example, a sudden spike in temperature might trigger an alert for maintenance.

Types of Architectures for User Interaction with IoT Panels & Devices

There are various approaches to creating IoT dashboards for IoT services. Yet, based on the interaction between the panel and the device, we can generally divide them into three main types.

Different types of IoT control panel architectures – designed by Webbylab

1. Cloud or Standalone IoT Panel

In this case, IoT devices connect through an IoT gateway or the cloud. The IoT control panel communicates with the server rather than directly with the device.

Examples include systems built around MQTT brokers. In these systems, devices are connected to the broker. The panel acts as a subscriber to receive real-time events about state changes. It can also send commands to the broker to change device states.

2. Embedded IoT Panel

In this architecture type, the IoT device has its own control panel, or, as we often call it — an embedded admin panel. This panel is usually accessible when directly connected to the device via Wi-Fi or through the device’s local IP address on the network.

Alternatively, on-site control screens with interfaces can be installed, providing a physical tool for device interaction. This approach is especially useful for offline device usage scenarios when the server is unavailable.

3. Directly-Connected IoT Panel

In this scenario, the IoT device features an interface that allows direct connection to an IoT panel. Examples may include:

• A Bluetooth-enabled application that receives data from the device
• A web or mobile app that establishes a WebSocket or HTTPS digital connection directly with the device to display data

Custom vs. Off-the-Shelf IoT Monitoring Dashboards

Businesses often face a dilemma when working on IoT projects. What’s best: build a custom control panel for IoT or choose an off-the-shelf solution. Each approach has its pros and cons:

Use Cases of IoT Dashboards: WebbyLab Experience

As mentioned earlier, an IoT control panel is a must for any IoT solution. The WebbyLab team has implemented such tools for data collection, visualization, and processing in numerous projects. Here are several of them:

2Smart Standalone IoT Control Panel

Our proprietary product, the 2Smart Standalone automation platform, best reflects the core of an IoT dashboard. It can be divided into three distinct panels for various tasks:

1. Admin Panel

This interface lets administrators monitor the entire ecosystem of the connected IoT devices. Designed to be self-declarative, it displays all devices evenly, regardless of their type or size.

The admin panel of 2Smart Standalone – developed by Webbylab

When creating the 2Smart Standalone interface, we thought in abstractions, namely, how to display a unified device card without binding to its type. It doesn’t matter to us what manufacturer or device type it is — we display a card with all the data available. Functionality is key in the admin section, while aesthetic appeal is for the client dashboards.

Yehor Fedorov, IoT Project Team Lead at WebbyLab

The admin panel includes the following features:

• Sorting
• Search
• Customizable eventing of sensors and devices
• Customization of the main screen by adding or hiding sensors

The interface’s purpose is to allow the admins of the 2Smart Standalone-based solutions to monitor all connected devices in real-time from one place.

For complex IoT control panels like 2Smart Standalone, it’s important to develop a library of components. The components must be standard and operate logically. Only in this way will it be convenient for administrators to manage devices. In our experience, 5-7 standard controls for any sensor type are enough for an IoT device. We use digital and time input, toggle, select, and color picker. This is the foundation.

Kostiantyn Oliynyk, Head of IoT at WebbyLab

2. Client Panel

This panel is a versatile dashboard builder. It lets users of 2Smart Standalone-based solutions create personalized dashboards with a tailored set of widgets for displaying or controlling connected device sensors.

The client panel of 2Smart Standalone – designed by Webbylab

The client panel operates on a grid layout concept. Users can select from a library of widgets, each with its own functionality, and arrange them on their dashboard with customizable sizes and positions. They can also create specific layouts for different screen sizes, ensuring accessibility across desktop, tablet, and mobile devices.

Customizable widgets on the 2Smart Standalone’s client panel – built by Webbylab

3. Grafana

Grafana is an independent additional service. It can be used as an IoT control panel to handle historical sensor data from all connected devices.

The Grafana dashboard for viewing historical data

While similar in concept to the client panel, using Grafana for IoT involves retrieving data from the historical InfluxDB database rather than directly from MQTT to the broker, as in the client panel.

Consumer-Oriented 2Smart Cloud and Propuskator Mobile Apps

Our 2Smart Cloud mobile app is, in fact, an interface builder. Each IoT device vendor tailors the application interface for their devices, providing end users with pre-designed layouts. These interfaces comprise widgets and tabs, allowing vendors to structure them in the desired order and composition following their device features.

The interfaces of the Propuskator mobile app

On top of that, users can add their favorite widgets to a designated list and create separate IoT dashboards to monitor multiple devices within a single application.

Devices tab in 2Smart Cloud

The Propuskator mobile app is specifically designed for access control systems, offering users a focused set of functionalities. The interface of this IoT panel is standardized to suit the capabilities of ACS systems, including features such as door control, surveillance camera monitoring, and opening sensor management.

The mobile application of the Propuskator access control system – developed by Webbylab

Propuskator Admin Panel

Our access control system, Propuskator, offers a separate tool for monitoring the connected IoT controllers within the admin panel. The administrator can view the entire list of access points, configure them, and observe their status.

Access point settings in the Propuskator admin

Device Management in 2Smart Cloud for B2B

An additional facet of our 2Smart Cloud platform caters specifically to the B2B segment. In this mode, the system offers a powerful tool — device management. It lets administrators create, configure firmware, connect, monitor, and control IoT devices.

Device management in 2Smart Cloud for B2B – developed by Webbylab

The IoT control panel comes in the form of a table with extensive information, customizable filters, and sorting options. It also provides a dedicated screen for real-time monitoring and analysis of individual IoT devices as well as their historical data in one place.

Notably, the 2Smart Cloud mobile app doesn’t have a traditional Favorites screen in the B2B mode. Instead, it offers a dynamic dashboard. Here, widgets curated and added by the vendor automatically display as primary elements for each device.

Offline Device Management in MyBox

An illustrative case of a custom IoT dashboard from scratch is our solution for MyBox. The panel lets users manage devices offline through the MyBox mobile app.

What’s the trick? The mobile app connects with the device directly, retrieving a self-declarative description of available control parameters. Leveraging this description, the application autonomously builds an intuitive interface for device management, allowing users to control and monitor device performance.

Monitoring and managing devices through the MyBox mobile app’s IoT control panel developed by Webbylab

Built-In Admin Panels

An alternative option for managing devices offline is a built-in admin panel. Such an interface is an integral component of the device’s firmware.

Typically, users can access these admin panels via the device’s IP address when connected to the network. Or they may connect to the device’s hotspot and access the admin panel through the default IP address.

Built-in admin panels are a convenient and sometimes indispensable method for directly controlling and monitoring computer devices, particularly when access to the control system is limited or unavailable.

We’ve developed a framework for building these admin panels, optimizing their size for compatibility with low-power devices. As a result, many of our products feature embedded admin interfaces within their firmware.

The MyBox charging station admin panel with control elements

Admin and Consumer-Oriented Panels for a Commercial Project

In a commercial project, we designed an IoT control panel catering to administrators. It features all devices and individual pages for each device.

An administrative IoT control panel in WebbyLab’s commercial project

Additionally, we developed a mobile and web application for consumers or installers, equipped with a centralized dashboard for monitoring all devices from one place.

A control panel for consumers of our commercial project

Want to explore more of our IoT projects? Jump to our case studies right away!

Unlock the Power of Your IoT Data with WebbyLab

An IoT control panel is your way to transform raw data into actionable insights and get complete control over your connected devices. Consider implementing it into your IoT system to achieve the next level of operational efficiency.

Need help in the IoT dashboard development process?

WebbyLab is here to offer a helping hand. With over five years in the niche, we can build a custom panel or select an existing one for your IoT project. Just give us a call today.