Versions Compared

Old Version 7

changes.mady.by.user admin

Saved on

compared with

New Version 8

changes.mady.by.user admin

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.


Displays Module Overview

The Displays Module allows you to user interfaces for Operators and clients interacting with the solution. 

Powered by WebAssembly bring high performance and simplify the development

Design Once, Deploy Evevywhere.

WIth Only One Designer and One Configuration, Run the same displays on Desktop, Web and Mobile devices.

Unified Designer for high-performance Canvas Displays (run natively in Windows native) and Web Dashboards (run in any browser)module creates operator interfaces that run identically across desktop, web, and mobile platforms using a unified designer and WebAssembly technology for high-performance visualization.

On this Page:

Table of Contents
maxLevel2
minLevel2
excludeOverview

Key Concepts

  • *Display/Screen*:
page
  • Page or dialog
create to use in the Operator
  • for operator user interfaces
.
  • *Layout
: Organize various displays in a frame, like SIdeBar, TopBar
  • *: Frame organization with sidebars, top bars, and main content
. 
  • areas
  • *Client*: Each
Operator connected with the server,
  • operator connection interacting with
the
  • displays
. 

Client Types

Distinct devices and display activation the Operator can use.

Rich Client (Desktop)

Web Client

Smart Client (Desktop)

Mobile Client

Unified Designer

Combine the creation of Web Responsive Dashboards & Process Synoptics ( Canvas) in one tool.

Canvas Displays (Process Synoptics): represents a process diagram. When resized, the elements keep their relative position on each other, or to the window borders.

Dashboard Displays are for data presentation where the UI components are placed on a responsive grid, organizing the blocks according to the size of the window.

Image Removed

Image Removed

Themes

Image Removed

  • *Canvas Displays*: Process synoptics with fixed element relationships
  • *Dashboard Displays*: Responsive grid-based data presentation
  • *RESS*: Responsive Design + Server-Side Components for device optimization

*Canvas Displays*: Process synoptics with fixed element relationships
Maintain element relationships during resize, ideal for process diagrams and P&IDs.

*Dashboard Displays*: Responsive grid-based data presentation
Reorganize blocks based on window size, perfect for KPIs and data visualization.

Image Added

Image Added

RESS Technology for Mobile Client

Mobile & RESS Layouts

  • The feature: Both Canvas and Dashboards displays, can be responsive, adapting automatically to user screen size and devices. 
  • The problem that remains: responsive UI does not solve the issues that a display designed originally to large desktop will never be practical for mobile users.
  • The solution: RESS = Responsive Design + Server-Side Components

In a nutshell 

RESS Technology: Server detects device class (phone, tablet, desktop) and delivers optimized content while maintaining responsive behavior within each class. This provides fast loading with flexible layouts.

RESS meansRESS = fast + flexible: we detect your device on the server, send only the right page for it, and the layout still responds smoothly to in-between screen sizes.

How RESS works: the server recognizes your device class (phone, tablet, desktop) and delivers a light, tailored page—images, code, and content sized for that device. The page is still responsive, so it adapts fluidly between breakpoints. You get the speed of adaptive delivery with the flexibility of responsive design. See it in action:

Desktop User

Tablet User

Mobile User

Runtime Behavior

Client Types

  • *Rich Client*: Native Windows desktop application
  • *Smart Client*: Lightweight desktop client
  • *Web Client*: Browser-based access
  • *Mobile Client*: Touch-optimized mobile interface

Features Highlights

Features Highlights

Some of the Displays Module's features:

Allows the creation of
  • *Design Once, Deploy Everywhere* - Single configuration for all platforms
  • *WebAssembly Performance* - Near-native speed in browsers
  • *Unified Designer* - One tool for both HMI graphics and web dashboards
  • *
  • .NET WPF and HTML5
applications from a unified drawing tool.
  • The same configuration can execute in both WPF and web clients.
  • Create responsive dashboards as well as HMI process screens.
  • Allows user-defined layouts, creating displays composed of multiple frames.
    • * - Dual technology support from single design
    • *Smart Symbol Library* - Extensive collection of industrial graphics
    • *Data Template Integration* - Automatic symbol-to-tag connections
    • *Multi-Language Support* - Runtime language switching
    • *Units Conversion* - Automatic metric/imperial conversion
    • *Self-Aware SCADA* - Dynamic display generation from asset models
    • *Multi-Frame Layouts* - Complex display compositions
    • *Touch Optimization* - Gesture support for mobile devices
    • *Theme Skins* - Switch visual styles without redesign

    Image Added

  • A large set of smart symbols, high-performance graphical symbols, and extensible components are included.
  • Support for theme skins, language localization, and units metric system conversion.
  • Automatically connects data templates with symbols.
  • Displays are dynamically created from the asset model for self-aware SCADA applications.

    • This documentation section explains the tools available on the Displays Module. The drawing of displays is on the next documentation section: Drawing the User Interface.