Merge pull request #1972 from rusikv/develop/4.0

Drilling and energy SCADA use cases

Author: ashvayka

_data/carousel-collection/advantages-carousel.yml

@@ -0,0 +1,81 @@
+0:
+  id: "security"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/security.svg"
+  title: "Security"
+  description: "ThingsBoard protects your data with industry-standard encryption algorithms like RSA and ECDSA. Secure communication is ensured via TLS (TCP) and DTLS (UDP). Role-based access control and audit logs further enhance platform security."
+  linkLabel: "Learn more"
+  href: "/docs/pe/user-guide/ssl/http-over-ssl/"
+1:
+  id: "data-visualization"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/data-visualization.svg"
+  title: "Data visualization"
+  description: "Visualize data with interactive, multi-state dashboards—no coding needed. Use built-in charts, gauges, maps, tables, and control widgets. Customize every detail via advanced settings or custom widget bundles. Real-time, low-latency updates supported via embedded web-sockets."
+  linkLabel: "Learn more"
+  href: "/docs/user-guide/dashboards/"
+2:
+  id: "connectivity"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/connectivity.svg"
+  title: "Connectivity"
+  description: "Connect devices directly to the platform via the following built-in protocols: HTTP, CoAP, MQTT, LwM2M, and SNMP. Connect devices in your local network to the cloud using ThingsBoard Gateway via Modbus, BLE, BACnet, OPC-UA, and other protocols."
+  linkLabel: "Learn more"
+  href: "/docs/getting-started-guides/connectivity/"
+3:
+  id: "data-processing"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/data-processing.svg"
+  title: "Data processing"
+  description: "ThingsBoard allows you to define app logic using a drag-and-drop rule chain designer. Its scalable Rule Engine uses message queues like Kafka or AWS SQS for durable, reliable data processing. You can handle data within the engine or forward it to external systems."
+  linkLabel: "Learn more"
+  href: "/docs/pe/user-guide/rule-engine-2-0/overview/"
+4:
+  id: "scalability"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/scalability.svg"
+  title: "Scalability and high availability"
+  description: "ThingsBoard supports high-availability cloud and on-prem deployments via Kubernetes or bare-metal. Its components scale horizontally and handle 18K+ vehicles and 5K+ devices in prod."
+  linkLabel: "Learn more"
+  href: "/docs/reference/msa/"
+
+5:
+  id: "multi-tenancy"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/multi-tenancy.svg"
+  title: "Multi-tenancy"
+  description: "ThingsBoard provides UI and API to manage tenants, customers, users, devices, and assets. Single tenant may have multiple tenant administrators and millions of devices and customers. It also offers out-of-the-box support of OTA updates for your smart meters."
+  linkLabel: "Learn more"
+  href: "/docs/user-guide/entities-and-relations"
+6:
+  id: "lorawan"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/lorawan-sigfox.svg"
+  title: "LoRaWAN & SigFox support"
+  description: "Connect LoRaWAN devices via integrations with standard network servers like TTN, LORIOT, ChirpStack, Actility, etc. Connect SigFox devices via integrations with the SigFox backend."
+  linkLabel: "Learn more"
+  href: "/docs/user-guide/integrations/"
+7:
+  id: "mobile0application"
+  height: "460px"
+  crisp:
+    0:
+      src: "/images/usecases/scada/mobile.svg"
+  title: "Mobile application"
+  description: "Build your own IoT mobile application with minimum coding efforts using ThingsBoard Mobile Application, an open-source project based on Flutter. Leverage a built-in set of mobile actions to take a photo, scan QR code, update location, and more directly within the dashboard."
+  linkLabel: "Learn more"
+  href: "/docs/mobile/"

_data/carousel-collection/use-cases.yml

@@ -182,11 +182,33 @@ waste-management:
 
 health-care:
   0:
-    src: "/images/solutions/health-care/health-care-1.png"
+    src: "/images/solutions/health-care/health-care-1.webp"
     alt: "Assisted living dashboard with opened floor plan and residents alarms"
   1:
-    src: "/images/solutions/health-care/health-care-2.png"
+    src: "/images/solutions/health-care/health-care-2.webp"
     alt: "Assisted living dashboard with opened resident details"
   2:
-    src: "/images/solutions/health-care/health-care-3.png"
-    alt: "Assisted living dashboard with opened zone sensors configuration"
+    src: "/images/solutions/health-care/health-care-3.webp"
+    alt: "Assisted living dashboard with opened zone sensors configuration"
+
+scada-oil-and-gas-drilling-system:
+  0:
+    src: "/images/solutions/scada-oil-gas-drilling/scada-drilling-system-1.webp"
+    alt: "Main state of SCADA drilling system dashboard"
+  1:
+    src: "/images/solutions/scada-oil-gas-drilling/scada-drilling-system-2.webp"
+    alt: "SCADA drilling system dashboard small screen responsiveness"
+  2:
+    src: "/images/solutions/scada-oil-gas-drilling/scada-drilling-system-3.webp"
+    alt: "Data state of SCADA drilling system dashboard"
+
+scada-energy-management:
+  0:
+    src: "/images/solutions/scada-energy-management/scada-energy-management-1.webp"
+    alt: "Main state of SCADA energy management dashboard"
+  1:
+    src: "/images/solutions/scada-energy-management/scada-energy-management-2.webp"
+    alt: "SCADA energy management dashboard consumption state"
+  2:
+    src: "/images/solutions/scada-energy-management/scada-energy-management-3.webp"
+    alt: "SCADA energy management dashboard small screen responsiveness"

_data/iot-use-cases.yml

@@ -13,10 +13,28 @@
   description: "SCADA systems are generally divided into two types: Traditional and High-Performance. Monitor and control your industrial processes in real time with SCADA. Use SCADA symbols on dashboards to create and manage any workflow, offering full flexibility to design and oversee operations according to your requirements."
   media:
     image: "https://img.thingsboard.io/usecases/scada/video/scada.png"
-    alt: "See more about SCADA use case"
+    alt: "See more about SCADA Swimming pool"
     video: ["https://video.thingsboard.io/usecases/scada.mp4", "https://video.thingsboard.io/usecases/scada.webm"]
   href: "/use-cases/scada/"
 2:
+  type: "SCADA"
+  name: "SCADA Oil & Gas drilling system"
+  description: "Automate drilling operations with SCADA and ThingsBoard. Control rigs, pumps, and blowout preventers in real time, visualize key parameters, and enhance operational safety. Flexible SCADA symbol templates allow you to tailor the system to any production scenario."
+  media:
+    image: "https://img.thingsboard.io/solutions/scada_drilling_system/hp-scada-systems-in-drilling-1.png"
+    alt: "See more about SCADA Oil & gas drilling system"
+    video: ["https://video.thingsboard.io/usecases/hp-drilling-scada-system.mp4", "https://video.thingsboard.io/usecases/hp-drilling-scada-system.webm"]
+  href: "/use-cases/scada-oil-and-gas-drilling-system/"
+3:
+  type: "SCADA"
+  name: "SCADA Energy management"
+  description: "Gain a complete real-time view of energy consumption and generation. Use SCADA powered by ThingsBoard to monitor, analyze, and optimize energy flows — from generation to end use. Track efficiency, forecast demand peaks, and reduce costs with intuitive dashboards and seamless integration with industrial equipment."
+  media:
+    image: "https://img.thingsboard.io/solutions/scada_energy_management/scada-energy-management-1.png"
+    alt: "See more about SCADA Energy management"
+    video: ["https://video.thingsboard.io/usecases/scada-energy-management.mp4", "https://video.thingsboard.io/usecases/scada-energy-management.webm"]
+  href: "/use-cases/scada-energy-management/"
+4:
   type: "General"
   name: "Environment Monitoring"
   description: "Monitor and analyze indoor and outdoor environments using a wide range of sensors. ThingsBoard supports data acquisition using modern connectivity technologies and protocols: NB IoT, LoRaWAN, SigFox, MQTT, CoAP, HTTP, LwM2M, and others."
@@ -25,7 +43,7 @@
     alt: "Environment monitoring dashboard"
     video: ["https://video.thingsboard.io/usecases/environment-monitoring.mp4", "https://video.thingsboard.io/usecases/environment-monitoring.webm"]
   href: "/use-cases/environment-monitoring/"
-3:
+5:
   type: "General"
   name: "Smart Office"
   description: "Ensure employee health and safety to boost organization productivity. Optimize resource consumption by monitoring and control of the office indoor climate. ThingsBoard provides rich data visualization, powerful processing engine, remote control and OTA updates capabilities."
@@ -34,7 +52,7 @@
     alt: "See more about Smart Office"
     video: ["https://video.thingsboard.io/usecases/smart-office.mp4", "https://video.thingsboard.io/usecases/smart-office.webm"]
   href: "/use-cases/smart-office/"
-4:
+6:
   type: "General"
   name: "Water Metering"
   description: "Enable water consumption data collection, analysis and fraud detection using ThingsBoard. Use interactive dashboards that allow administrators and end-users to browse the state of the water meters and aggregated water consumption statistics. Enable alarms over SMS and email and integrate with external billing systems."
@@ -43,7 +61,7 @@
     alt: "Water metering dashboard"
     video: ["https://video.thingsboard.io/usecases/water-metering.mp4", "https://video.thingsboard.io/usecases/water-metering.webm"]
   href: "/use-cases/water-metering/"
-5:
+7:
   type: "General"
   name: "Smart Retail"
   description: "Control quality of food storage by monitoring chillers and freezers. Ensure availability of the goods using smart shelves. Ensure safety using motion detection and fire alarms. ThingsBoard provides a solution template to monitor supermarket assets, browse historical data and generate alarms based on user-defined thresholds."
@@ -52,7 +70,7 @@
     alt: "Smart retail dashboard"
     video: ["https://video.thingsboard.io/usecases/smart-retail.mp4", "https://video.thingsboard.io/usecases/smart-retail.webm"]
   href: "/use-cases/smart-retail/"
-6:
+8:
   type: "General"
   name: "Smart Farming"
   description: "Collect important indicators for your agricultural production such as soil conditions or facilities state via IoT sensors and visualize them using end-user customizable dashboards provided by ThingsBoard platform."
@@ -61,7 +79,7 @@
     alt: "Smart farming dashboard"
     video: ["https://video.thingsboard.io/usecases/smart-farming.mp4", "https://video.thingsboard.io/usecases/smart-farming.webm"]
   href: "/use-cases/smart-farming/"
-7:
+9:
   type: "General"
   name: "Fleet Tracking"
   description: "ThingsBoard platform allows to track vehicles state and alerts via various sensors, plot vehicle routes in real-time and browse their sensors reading history at the same time using customizable high quality widgets and dashboards."
@@ -70,7 +88,7 @@
     alt: "Fleet tracking dashboard"
     video: ["https://video.thingsboard.io/usecases/fleet-tracking.mp4", "https://video.thingsboard.io/usecases/fleet-tracking.webm"]
   href: "/use-cases/fleet-tracking/"
-8:
+10:
   type: "General"
   name: "Smart Metering"
   description: "Collect, store and aggregate data from smart meters in reliable and fault-tolerant way. Analyze resource consumption and raise alerts on leakage, anomaly or fraud. Present results of the analysis to end users."
@@ -79,7 +97,7 @@
     alt: "Fleet tracking dashboard"
     video: ["https://video.thingsboard.io/usecases/smart-metering.mp4", "https://video.thingsboard.io/usecases/smart-metering.webm"]
   href: "/use-cases/smart-metering/"
-9:
+11:
   type: "General"
   name: "Health Care: Smart Assisted Living Solution"
   description: "Track patient health metrics in real time and immediately notify medical professionals of critical changes. This solution integrates connected devices, data analytics, and automated alerts to create a seamless experience for caregivers and administrators, ensuring timely responses and a higher quality of care."
@@ -88,7 +106,7 @@
     alt: "Health Care dashboard"
     video: ["https://video.thingsboard.io/usecases/health-care.mp4", "https://video.thingsboard.io/usecases/health-care.webm"]
   href: "/use-cases/health-care/"
-10:
+12:
   type: "General"
   name: "Air Quality Monitoring"
   description: "Deliver and store data from smart meters in reliable and fault-tolerant way, visualize real-time and historical energy consumption data on customizable end-user dashboards, integrate with third-party analytics frameworks and solutions."
@@ -97,7 +115,7 @@
     alt: "Air quality dashboard"
     video: ["https://video.thingsboard.io/usecases/air-quality.mp4", "https://video.thingsboard.io/usecases/air-quality.webm"]
   href: "/use-cases/air-quality-monitoring/"
-11:
+13:
   type: "General"
   name: "Smart Irrigation"
   description: "Monitor the irrigation system and respond in time to changes in field conditions. List the fields and monitor their soil moisture, location, statistics, etc."
@@ -106,15 +124,15 @@
     alt: "Smart irrigation dashboard"
     video: ["https://video.thingsboard.io/usecases/smart-irrigation.mp4", "https://video.thingsboard.io/usecases/smart-irrigation.webm"]
   href: "/use-cases/smart-irrigation/"
-12:
+14:
   type: "General"
   name: "Waste Management"
   description: "Optimize waste management operations with our solution. Streamline processes, monitor waste levels, and track data for efficient and sustainable practices."
   media:
     image: "https://img.thingsboard.io/solutions/waste_monitoring/waste-monitoring-1.png"
     alt: "Waste monitoring dashboard"
   href: "/use-cases/waste-management/"
-13:
+15:
   type: "General"
   name: "Tank Level Monitoring"
   description: "Deliver and store data from smart meters in reliable and fault-tolerant way, visualize real-time and historical energy consumption data on customizable end-user dashboards, integrate with third-party analytics frameworks and solutions."

_data/use-cases.yml

@@ -3,9 +3,17 @@
   link: /use-cases/smart-energy/
   icon: /images/case-eng-icon.svg
 - id: scada
-  title: SCADA
+  title: SCADA Swimming pool
   link: /use-cases/scada/
   icon: /images/case-scada-icon.svg
+- id: scada-oil-and-gas-drilling-system
+  title: SCADA Oil and gas drilling system
+  link: /use-cases/scada-oil-and-gas-drilling-system/
+  icon: /images/case-scada-drilling-system-icon.svg
+- id: scada-energy-management
+  title: SCADA Energy management
+  link: /use-cases/scada-energy-management/
+  icon: /images/case-scada-energy-management.svg
 - id: environment-monitoring
   title: Environment monitoring
   link: /use-cases/environment-monitoring/

_includes/carousel.liquid

@@ -40,6 +40,7 @@
 {% assign linkColor = include.linkColor | default: "#2a7dec" %}
 {% assign linkWeight = include.linkWeight | default: "500" %}
 {% assign imageBorderRadius = include.imageBorderRadius | default: "6px" %}
+{% assign enableLinkArrow = include.enableLinkArrow %}
 
 {% assign nonActiveItemsVisibilityClass = "nonActiveItemsVisibilityTrue" %}
 
@@ -149,7 +150,9 @@
             <p style="font-size:{{ descriptionSize }}; color: {{ descriptionColor }}; line-height: {{descriptionLineHeight}}; font-weight: {{ descriptionWeight }}">{{ carouselItem[1].description }}</p>
             <div id="{{ carouselItem[1].linkId }}" class="card-link">
                 <a href="{{ carouselItem[1].href }}" style="color: {{linkColor}}; line-height: {{linkLineHeight}}; font-weight: {{ linkWeight }}">{{ carouselItem[1].linkLabel }}</a>
-                <i class="fas fa-arrow-down" style="color: {{linkColor}}"></i>
+                {% if enableLinkArrow %}
+                    <i class="fas fa-arrow-down" style="color: {{linkColor}}"></i>
+                {% endif %}
             </div>
         </div>
     {% endfor %}
@@ -160,7 +163,6 @@
 {% assign collectionKey = include.collectionKey %}
 {% assign darkenedImage = include.darkenedImage | default: false %}
 {% assign overlay = include.overlay | default: false %}
-{% assign enableLinkArrow = include.enableLinkArrow %}
 {% assign contentDirection = include.contentDirection %}
 
 {% if collectionKey %}

_includes/head-header.html

@@ -587,6 +587,7 @@
             var body = $('body');
             body.css('overflow', '');
             let targetSubMenus = $('nav.head-menu > ul > li > div');
+            targetSubMenus.css('display', '');
             let submenuContainer = $('nav.head-menu > div.sub-menu-container');
             submenuContainer.removeClass('active');
             submenuContainer.css('display', 'block');
@@ -892,6 +893,26 @@
                                     </div>
                                 </a>
                             </div>
+                            <div class="column">
+                                <p class="group-name">&nbsp;</p>
+                                <a href="/use-cases/scada-oil-and-gas-drilling-system/">
+                                    <img src="/images/case-scada-drilling-system-icon.svg" alt="SCADA icon" width="24" height="24" loading="lazy">
+                                    <div class="sub-text">
+                                        <span class="item-heading">Oil and gas drilling system</span>
+                                        <p>Control drilling operations</p>
+                                    </div>
+                                </a>
+                            </div>
+                            <div class="column">
+                                <p class="group-name">&nbsp;</p>
+                                <a href="/use-cases/scada-energy-management/">
+                                    <img src="/images/case-scada-energy-management.svg" alt="SCADA icon" width="24" height="24" loading="lazy">
+                                    <div class="sub-text">
+                                        <span class="item-heading">Energy management</span>
+                                        <p>Monitor & control energy systems</p>
+                                    </div>
+                                </a>
+                            </div>
                         </div>
                     </li>
                 </ul>

_includes/tb-advantages.html

@@ -0,0 +1,4 @@
+<section class="advantages">
+    <h2>ThingsBoard advantages</h2>
+    {% include carousel.liquid items = 3 itemsHigher960 = 1 itemsHigher600 = 1 itemsHigher0 = 1 dotButtonMode = "circle" collectionMap = "advantages-carousel" cardMode = true carouselMargin = 0 stagePadding = 0 navMode = "smallArrow" titleSize = "28px" titleSizeLower600 = "24px" titleColor = "#000000DE" titleWeight = "500" titleLineHeight = "44px" descriptionSize = "14px" descriptionColor = "#000000C2" descriptionLineHeight = "24px" enableLinkArrow = false linkSize = "16px" linkLineHeight = "22px" linkWeight = "400" %}
+</section>

_layouts/use-case.html

@@ -1,4 +1,5 @@
 {% if page.notitle == "true" %}{% assign notitle = "true" %}{% endif %}
+{% if page.includeAdvantages == "true" %}{% assign includeAdvantages = "true" %}{% endif %}
 {% assign cssTag="use-case" %}
 
 <!Doctype html>
@@ -14,6 +15,7 @@
         {% if notitle != "true" %}<h1>{{ title }}</h1>{% endif %}
         <div id="content">
             {{ content }}
+            {% if includeAdvantages == "true" %}{% include tb-advantages.html %}{% endif %}
         </div>
     </div>
 </section>