Versions Compared

Key

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

This guide walks you through using the Designer interface to configure your solution. Learn to navigate between modules, use productivity features, and understand the workspace layout for efficient solution development.

Prerequisites:

  • Solution created in Solution Center
  • Understanding of the Four Pillars concept
  • Basic familiarity with IDE environments


TO DO REVIEW DELETE LEGAY CONTENT



Opening Designer

Launching from Solution Center

  1. Select your solution in Solution Center
  2. Click Edit to open with full access
  3. Or click View for read-only mode
  4. Designer loads with solution

Designer Startup

First time opening:

  • Solution Explorer shows on left
  • Welcome/Home tab displays
  • Output window minimized at bottom
  • Properties panel on right

Workspace Layout

Main Areas

No Format
???????????????????????????????????????????????????????????
?  Menu Bar            [File][Edit][View][Tools][Help]    ?
???????????????????????????????????????????????????????????
?              ?                        ?                 ?
?  Navigation  ?     Design Canvas      ?   Properties    ?
?     Tree     ?                        ?     Panel       ?
?              ?   (Context-Sensitive)  ?                 ?
? ? Solution   ?                        ?  Tag: Temp      ?
?   ? UNS      ?                        ?  Type: Float    ?
?     • Tags   ?                        ?  Value: 75.5    ?
?   ? Devices  ?                        ?                 ?
???????????????????????????????????????????????????????????
?  Output Window      [Build][Errors][Search Results]     ?
???????????????????????????????????????????????????????????


Quick Access Toolbar

Top toolbar shortcuts:

  • Home - Return to welcome page
  • UNS - Jump to tags/namespace
  • Draw - Open display designer
  • Runtime - Access runtime settings
  • Switch - Change to Solution Center

Navigating Modules

Using Solution Explorer

The tree organizes modules by the Four Pillars:

1. Define Your Data

  • Unified Namespace → Tags, Templates, Assets
  • Datasets → Database connections
  • DataExplorer → Browse external data

2. Connect & Collect

  • Devices → Channels, Nodes, Points
  • Connections → External systems

3. Monitor & Act

  • Alarms → Items, Groups, Areas
  • Historian → Storage configuration
  • Security → Users, permissions

4. Visualize & Share

  • Displays → Pages, layouts
  • Reports → Document generation
  • Scripts → Business logic

Opening Module Editors

Method 1: Double-click

  • Double-click any item in tree
  • Opens in main canvas area
  • Previous tab remains available

Method 2: Right-click menu

  • Right-click for context menu
  • Select Edit, Delete, Copy, etc.
  • Module-specific actions

Method 3: Drag and drop

  • Drag items between panels
  • Drop tags onto displays
  • Move items in hierarchy

Working with Editors

Common Editor Features

All module editors share:

FeatureFunctionShortcut
SaveSave current changesCtrl+S
Undo/RedoReverse actionsCtrl+Z/Y
FindSearch in editorCtrl+F
IntelliSenseAuto-completionType "."
ValidationRed border on errorsAutomatic

Table Editors

Most configurations use tables:

Adding rows:

  • Click empty row at bottom
  • Or right-click → Insert Row
  • Or press Insert key

Editing cells:

  • Click cell to select
  • Type to replace
  • Tab to next cell

Selecting multiple:

  • Click and drag
  • Ctrl+click for specific
  • Shift+click for range

Property Grid

Right panel shows properties:

  • Updates based on selection
  • Groups related settings
  • Shows tooltips on hover
  • Red border = invalid value

Productivity Features

IntelliSense

Auto-completion everywhere:

  1. Start typing tag name
  2. Dropdown appears
  3. Arrow keys to select
  4. Tab or Enter to accept

Works for:

  • Tag names
  • Object properties
  • Script methods
  • Display elements

Cross-References

Find where objects are used:

  1. Right-click any object
  2. Select Find References
  3. Results in Output window
  4. Double-click to navigate

Validation

Real-time error checking:

  • Red border - Invalid entry
  • Yellow warning - Potential issue
  • Tooltip - Hover for details
  • Output window - Full error list

Refactoring

Rename with automatic updates:

  1. Right-click object
  2. Select Rename
  3. Enter new name
  4. All references update

Using Output Window

Output Tabs

Bottom panel with tabs:

TabShowsUse For
BuildCompilation resultsAfter save/build
ErrorsValidation issuesFinding problems
SearchFind resultsCross-references
OutputSystem messagesGeneral info

Working with Results

  • Double-click error to navigate
  • Right-click for options
  • Clear to remove old results
  • Filter by severity level

Test Mode

Running in Designer

Test without deploying:

  1. Click Run Test (F5)
  2. Select modules to run
  3. Solution starts in Designer
  4. Test functionality
  5. Click Stop when done

Test Mode Features

Available during test:

  • View tag values live
  • Test displays
  • Trigger alarms
  • Run scripts
  • Check communications

Not available:

  • Historian recording
  • Production security
  • Some client features

Saving and Building

Save Options

Save current item:

  • Ctrl+S or Save button
  • Saves active editor only

Save all:

  • Ctrl+Shift+S
  • Saves all open editors

Auto-save:

  • Enable in Tools → Options
  • Set interval (default 5 min)

Building Solution

Quick build:

  • F6 or Build button
  • Validates configuration
  • Shows errors in Output

Full build:

  • Build → Rebuild All
  • Complete validation
  • Prepares for deployment

Customizing Workspace

Panel Management

Docking panels:

  • Drag panel title bar
  • Drop on docking guides
  • Or float as window

Auto-hide:

  • Click pin icon
  • Panel slides to edge
  • Hover to show

Reset layout:

  • View → Reset Layout
  • Returns to default

Editor Options

Configure in Tools → Options:

  • Font size and family
  • Color themes
  • Auto-save settings
  • Validation options
  • IntelliSense behavior

Common Workflows

Creating New Items

  1. Navigate to module
  2. Right-click folder
  3. Select New → [Item Type]
  4. Enter name
  5. Configure properties

Copy and Paste

Between items:

  1. Select source rows
  2. Ctrl+C to copy
  3. Select destination
  4. Ctrl+V to paste

Import/Export

For bulk operations:

  1. Right-click table
  2. Select Export to Excel
  3. Edit in Excel
  4. Import from Excel

Keyboard Shortcuts

Essential Shortcuts

ActionShortcutContext
SaveCtrl+SAny editor
FindCtrl+FAny editor
ReplaceCtrl+HText editors
UndoCtrl+ZAnywhere
RedoCtrl+YAnywhere
BuildF6Anywhere
TestF5Anywhere
HelpF1Context help

Navigation

ActionShortcut
Next tabCtrl+Tab
Previous tabCtrl+Shift+Tab
Close tabCtrl+F4
Go to lineCtrl+G

Troubleshooting

IntelliSense not working

  • Check if enabled in Options
  • Rebuild solution (F6)
  • Restart Designer

Cannot save changes

  • Check file permissions
  • Verify not read-only mode
  • Close other instances

Validation errors persist

  • Clear output window
  • Rebuild solution
  • Check error details

Panels disappeared

  • View → Reset Layout
  • Or Window → Show [Panel]
  • Check auto-hide status

This guide covered navigating and using the Designer workspace, from basic layout understanding to productivity features, providing the foundation for efficient solution configuration.













The Designer provides a unified configuration workspace for all FrameworX solution development. It delivers an integrated environment for design, development, testing, validation, and deployment across all functional modules, organized through the Four Pillars architecture that structures data flow from field connectivity to user visualization.

On this Page:

  • Designer Overview
  • Key Concepts
  • What It Does
  • Configuration Workflow
  • Runtime Behavior
  • Feature Highlights

Key Concepts

  • Solution File (.dbsln): Encrypted SQL database containing all module configurations and engineering logic
  • Modular Architecture: Compartmentalized design with independent modules ensuring isolated changes
  • Four Pillars Organization: Logical grouping of modules by function (Foundation, Industrial, Business, Visualization)
  • Object Model: .NET-based classes providing inherited properties and methods for all configured objects
  • IntelliSense: Context-aware auto-completion for tags, objects, and properties
  • Test Mode: In-Designer runtime execution for validation without deployment

What It Does

  • Provides unified interface for configuring all solution modules and components
  • Enables offline and online configuration with multi-user collaboration support
  • Offers integrated testing and validation without leaving the design environment
  • Manages cross-references, version control, and change tracking automatically
  • Supports refactoring with automatic reference updates throughout solution
  • Delivers context-sensitive editing with real-time validation and tooltips

Solution Development Workflow

Specification to Solution Flow 

Configuration Workflow

(1) Define Your Data

(2) Setup Industrial Process Modules

Unified Namespace (Local UNS)

SQL Database Connections and Queries

DataExplorer

Scripts and Business Logic

Extended UNS using Direct Binding

Reports, data pub (PDF, CSV, HTML, XML & JSON



(3)  Setup Application Modules (4) User Interface Design

Devices, Field Connections

Symbol Library extensions

Alarms, Events, and Audit-trail

Unified Designer (Canvas & Responsive Dashboard)

Historian, time-series data

Layouts, Desktop (.NET), Web &r Mobile (WebAssembly)






Configuration Workflow

Designer Configuration Workflow

StepActionDescription
1. Foundation LayerConfigure UNSDefine tags, templates, enumerations, asset tree
2. Industrial IntegrationSetup Process ModulesConfigure Devices, Alarms, Historians
3. Business LogicAdd Application ModulesCreate Scripts, Datasets, Reports
4. VisualizationDesign User InterfaceBuild Displays, dashboards, client settings
5. SecurityDefine Access ControlSetup users, permissions, runtime security
6. Test & DeployValidate SolutionTest mode execution, build, and publish

Runtime Behavior

Module Organization by Four Pillars

Pillar 1: Unified Namespace (Foundation)

  • Tags: Real-time data points with .NET-based types and properties
  • Templates (UDTs): Reusable data structures for complex objects
  • Asset Tree: Hierarchical organization matching physical equipment
  • TagProviders: Dynamic connections to external data sources

Pillar 2: Process Modules (Industrial Integration)

  • Devices: 70+ native drivers, OPC UA/DA, MQTT SparkPlug B support
  • Alarms: Condition monitoring, notifications, audit trail
  • Historians: Time-series storage with SQL engine, Canary, PI, InfluxDB

Pillar 3: Application Modules (Business Logic)

  • Scripts: C#, VB.NET, Python, JavaScript with multi-threading
  • Datasets: SQL connections, queries, real-time data tables
  • Reports: Text, PDF, HTML5 generation with web services

Pillar 4: User Interface (Visualization)

  • Displays: HMI/SCADA screens with responsive design
  • Symbols: Reusable graphical components library
  • Clients: HTML5, .NET SmartClient, mobile deployment

Designer Workspace Interface

ComponentFunctionFeatures
Navigation TreeModule accessQuick shortcuts, search, hierarchical browsing
Design CanvasContext-sensitive editingIntelliSense, validation, real-time preview
Properties PanelObject configurationDynamic property grid, tooltips, examples
Output WindowSystem feedbackBuild results, errors, search results
Top ToolbarCommon operationsUndo/redo, cut/copy/paste, find, export

Object Model Integration

All configured objects inherit from .NET classes, providing:

  • Native properties and methods without custom coding
  • Direct access to .NET functionality (e.g., DateTime.DayOfWeek)
  • Runtime statistics (e.g., Script.Task.LastCPUTime)
  • Seamless integration with external .NET assemblies

Feature Highlights

Development Productivity

  • IntelliSense everywhere: Auto-completion for all tag names and object references
  • Real-time validation: Red borders and tooltips for invalid entries
  • Refactoring support: Rename objects with automatic reference updates
  • Cross-reference tools: Find all uses of any object instantly
  • Version control: Built-in change tracking and comparison

Unified Configuration

  • Single environment: All modules configured in one interface
  • Consistent UI: Same patterns across all configuration tables
  • Context menus: Right-click access to relevant operations
  • Drag-drop support: Move items between panels and modules
  • Keyboard shortcuts: Ctrl+S save, F5 test mode, standard editing

Testing and Validation

  • Test Mode: Run solution without leaving Designer
  • Online configuration: Modify running solutions safely
  • Simulation tools: Test without field devices connected
  • Error checking: Automatic validation on save
  • Performance monitoring: Real-time resource usage display

Collaboration Features

  • Multi-user support: Concurrent engineering on same solution
  • Change tracking: Automatic logging of all modifications
  • User permissions: Role-based access to configuration areas
  • Import/Export: Excel, CSV for bulk operations
  • Documentation: Integrated help and examples

Module Integration

  • Namespace organization: Logical grouping (Tag, Alarm, Device, Script)
  • Shared object model: Consistent properties across modules
  • Event-driven updates: Changes propagate automatically
  • Unified database: Single SQL store for all configurations
  • Cross-module references: Direct linking between components


Designer & Modules (Concept)




Overview



The Designer is the configuration workspace for your solution—where you define tags, devices, datasets, alarms, scripts, displays, and security. It supports offline and online editing in a unified, cross-platform UI. See the workspace layoutsketch on page 1 for the main regions (Navigation Tree, Canvas, Properties, Output). 



What you can do



  • Configure UNS/Tags, Devices, Datasets/SQL, Alarms, Scripts, Displays, and Security from a single workspace. 

  • Use Test Mode to validate behavior without leaving Designer. 

  • Navigate fast via Solution Explorer and quick shortcuts (Home, Tags/UNS, Draw, Runtime). 

  • Inspect cross-references, errors, and build output in the bottom panels. 

  • Benefit from tooltips, validation, IntelliSense, and refactoring across editors. 




Modules organized by the Four Pillars



Use this model to avoid a long flat list and give users a mental map. (Each item links to its module reference.)


  • Define Your Data

    UNS & Tags, Datasets/Queries, Data Explorer tools. 

  • Connect & Collect

    Devices (protocol drivers, OPC UA/DA, MQTT Sparkplug B), Connections/Monitors. 

  • Monitor & Act

    Alarms (Items/Groups/Areas, Notifications), Historian (SQL/Canary, store-and-forward), Security (users, groups, AD/LDAP). 

  • Visualize & Share

    Displays (desktop & web), Reports/Forms/WebData. 



Tip: In the Solution Explorer table (Reference), keep these pillar groupings by section so users can scan: Solution, Runtime, UNS, Devices, Alarms, Historian, Datasets, Reports, Scripts, Security, Displays, Data Explorer, Track Changes. (See page 3 for the full child-page matrix.) 



Key concepts & terms



  • Solution (.dbsln): encrypted SQL file storing all configuration. 

  • Modular architecture: changes in one module won’t break others. 

  • Unified Namespace (UNS): central semantic model for tags and assets. 




How it fits at runtime



Designer produces the configuration your Runtime executes; clients (desktop & web) visualize and interact with the running system. Designer’s Test Mode lets you validate behavior before publishing to Runtime. (See “Runtime execution” and “Display/HMI clients” callouts on page 1.) 



Interface at a glance



  • Navigation Tree (modules by pillar) • Design CanvasProperties PanelOutput/Errors/Cross-Ref. Diagram on page 1. 

  • Quick navigation: Home, UNS/Tags, Draw (Displays), Runtime; plus Switch menu to Solution Management, docs, forum, and training. 




Configuration at a glance



  1. Open a solution in Designer.

  2. Work pillar-by-pillar: Define data → Connect devices → Monitor/Act → Visualize/Share.

  3. Run/Test from Designer; then publish to Runtime. 




See also



  • Solution Center (Concept): launchpad for create/open/license/run.

  • Runtime & Clients (Concept): execution and client connections.

  • Designer Environment (Reference): UI details, toolbars, shortcuts, child pages. 






Notes



  • This keeps Overview short and moves value into What you can do—the same pattern we used for Solution Center.

  • The pillar mapping mirrors the Process/Application modules split and the Define/Setup/Runtime tiles shown in the Designer reference intro image (page 1), making the concept page consistent with the reference UI. 



Want me to generate the matching Modules (Reference) index grouped by the four pillars (with one-line summaries for each module)?

  • Designer Workspace (configuration environment)
  • All functional modules (Tags, Historian, Security, etc.)
  • Development tools
  • Runtime execution
  • Display/HMI clients (Web, Mobile, Desktop)
  • Utilities and tools

The Designer is where you configure your solution: tags, devices, datasets, alarms, scripts, displays, and security. It supports offline and online configuration and a unified, cross-platform UI.


On this page


  • What you configure here

  • Offline vs. online editing

  • Saving & deploying changes (high level)


Workspace Layout

???????????????????????????????????????????????????????????
?  Menu Bar            [File][Edit][View][Tools][Help]    ?
???????????????????????????????????????????????????????????
?              ?                        ?                 ?
?  Navigation  ?     Design Canvas      ?   Properties    ?
?     Tree     ?                        ?     Panel       ?
?              ?   (Context-Sensitive)  ?                 ?
? ? Solution   ?                        ?  Tag: Temp      ?
?   ? UNS      ?                        ?  Type: Float    ?
?     • Tags   ?                        ?  Value: 75.5    ?
?   ? Devices  ?                        ?                 ?
?   ? Displays ?                        ?                 ?
???????????????????????????????????????????????????????????
?  Output Window      [Build][Errors][Search Results]     ?
???????????????????????????????????????????????????????????

Key Designer Features

FeatureLocationPurpose
Tag EditorUNS → TagsCreate and configure tags
Display DesignerDisplays → PagesBuild HMI screens
Device ConfigurationDevices → ChannelsSetup communications
Script EditorScripts → TasksWrite custom logic
Test ModeToolbar → Run TestTest without leaving Designer

Navigation Tips

  • Double-click items to edit
  • Right-click for context menus
  • Drag-drop between panels
  • Ctrl+S saves current item
  • F5 starts test mode



Unified Namespace And Tags

Build real-time data models, like Tags and Templates. Connect seamlessly to external systems using Dynamic ExternalTags for on-demand data connectivity. Asset modeling allows for the creation of a hierarchical view of the data.

Historian

Easily store and access time-series data. Our platform includes an SQL historian engine, Canary Historian, at no extra cost. It seamlessly integrates with other historian tools like OSIsoft PI and InfluxDB. Plus, it offers out-of-the-box store-and-forward functionality.

Security

Control access to project configuration and user security effortlessly. Enable FDA compliance applications, integrate with Active Directory, LDAP, and more for user security. Define access to displays and objects based on user profiles and security groups with ease.

Devices

Access over 60 native communication protocol drivers for PLCs, transmitters, and field devices effortlessly. Our platform fully supports OPC UA and DA for both server and client execution, along with emerging standards like MQTT SparkPlug B.

Alarms

Easily organize Tags into Groups and Areas for setting Alarm conditions, Audit-Trail, and notifications via email, SMS, or voice. Visualize alarms online and in the historian. Store data agnostically on any selected Database provider.

Datasets

Effortlessly handle multiple connections with SQL databases, customize processes with queries, and tailor tables for real-time tag values. Manage recipes and data files in ASCII, UNICODE, or XML formats with ease.

Scripts

Enable powerful server-side and client-side scripting with high performance. Use languages like C#, VB .NET, Python, and JavaScript. Easily develop multi-threading applications with parallel execution and add references to externally developed classes.

Reports

Generate Text (Plain, XML or JSON), PDF, or HTML5 reports directly without relying on external tools. Additionally, utilize web services to interact with external applications or systems. Access, manipulate, and share data using standardized communication protocols like HTTP and RESTful APIs. This facilitates integration with various software systems such as ERP, BI tools, and custom applications, enhancing data sharing and collaboration.

Displays

Effortlessly design User Interface Displays using our advanced drawing tool, featuring a wide range of customizable Symbols and Graphical components. Whether you need a Responsive Dashboard, a traditional Process Diagram, or high-performance SCADA Graphics, we've got you covered. Deploy your displays seamlessly in HTML5 or secure .NET SmartClient to desktop, mobile, or web clients. Enhance user experience with features like Language Localization, dynamic Engineering Units conversion, and dynamic theme color schemes.


Data Explorer

Perform data mining and monitoring from various data sources, including MQTT Brokers, OPC-UA, PLCs and SQL databases.

Track Changes

Automatically maintain a log of Solution configuration changes, cross-reference tables, and Version Control Information.


Modules Namespaces 

Object Model

In most systems, you usually have to go through the hassle of creating Tags or Variables and writing code to display information about what's happening in your application, like how much CPU is being used by the latest task.

Using our platform, things are way simpler. All those things you need to keep track of, like Tags, AlarmGroups, and ScriptTasks, are actually classes that extend from .NET classes. This means that when you configure your project, you get to use all the properties and methods created by our platform, as well as those already built into the .NET classes.

Take the Tag DateTime, for example. In other systems, you'd need to write code and methods to convert strings to DateTime formats or figure out what day of the week a specific date falls on. But with our platform, the DateTime Tag is just an instance of the .NET class DateTime. That means your project can easily tap into all the properties and methods that come with it, right out of the box.


Examples

Finding the weekday of date time event: simply access the property Tag.DateTimeExample.Value.DayOfWeek,

Finding the amount of CPU used the last time a calculation was executed: simply access the property Script.Task.Example1.LastCPUTime

Namespaces

All the Modules, tools and objects used in a project are organized in accessible namespaces. Some of main namespaces are:

Tags: Group of variables of the real-time database

Alarms: Provides access to all information about the management of Alarms. 

Devices: Includes information on all field devices and its communication status.