Evaluate the AutomationView desktop suite free for 30 days. No credit card required. Claim trial key →
arrow_back Back to Articles

Inside SIMATIC AX WinCC Unified Elements: A Guide to Code-Based HMI

calendar_month
person Carvalho Raphael

Inside SIMATIC AX WinCC Unified Elements: A Guide to Code-Based HMI

Automation News
%%{init: {'theme':'dark', 'themeVariables': { 'background': '#001c38' }}}%%
flowchart LR
    classDef blueFill fill:#2563eb,color:#ffffff,stroke-width:0px;
    classDef greenFill fill:#16a34a,color:#ffffff,stroke-width:0px;
    classDef redFill fill:#dc2626,color:#ffffff,stroke-width:0px;

    A["IT Engineering (Git/YAML)"]:::blueFill --> B["SIMATIC AX Server"]:::redFill
    C["PLC Logic (ST/SCL)"]:::greenFill --> B
    B --> D["WinCC Unified Elements HMI"]:::blueFill
AutomationView Icon AutomationView

Key Takeaways:

  • Siemens SIMATIC AX WinCC Unified Elements brings IT-centric, code-based workflows to HMI engineering.
  • Engineers can now use YAML configurations and Git version control for visualization projects.
  • This shift addresses the bottleneck of manual drag-and-drop HMI updates in large-scale deployments.

For decades, industrial automation engineers have relied on visual, drag-and-drop editors to design Human-Machine Interfaces (HMIs). While intuitive for small projects, this monolithic approach becomes a massive bottleneck when scaling across hundreds of machines or integrating with modern IT/OT convergence pipelines. With the recent launch of SIMATIC AX WinCC Unified Elements, Siemens is fundamentally shifting this paradigm by introducing code-based workflows into the visualization layer.

The Bottleneck of Traditional Drag-and-Drop HMI

In traditional SCADA and HMI development, every button, script, and variable binding must be manually placed and configured through a proprietary graphical interface. When deploying a fleet of standardized machines, a minor update (such as changing a pump icon or updating an alarm threshold) often requires manual edits across multiple screens. Furthermore, version control in these environments typically consists of copying binary project files, making peer reviews and automated testing nearly impossible.

Automation engineers face severe friction when trying to apply modern DevOps practices to these legacy tools. As industrial projects grow in complexity, the gap between IT software engineering capabilities and OT reality becomes a significant liability. Managing concurrent edits from multiple developers often results in corrupted project files or untrackable logic changes.

Enter SIMATIC AX WinCC Unified Elements

Siemens designed SIMATIC AX (Automation eXpansion) to bridge the IT/OT gap by bringing software development best practices to the OT floor. The addition of WinCC Unified Elements to this ecosystem allows engineers to define visualization components using text-based formats, specifically YAML.

By defining HMI screens in code, teams can treat visualization exactly like they treat advanced PLC logic. This unlocks the ability to use standard IT tools like Visual Studio Code, Git repositories, and CI/CD pipelines for HMI deployment.

flowchart TD
    classDef primary fill:#2563eb,color:#ffffff,stroke-width:0px;
    classDef secondary fill:#16a34a,color:#ffffff,stroke-width:0px;
    
    subgraph it_tools ["IT Toolchain"]
        A["VS Code Editor"]:::primary
        B["Git Version Control"]:::primary
        C["CI/CD Pipeline"]:::primary
    end
    
    subgraph ot_execution ["OT Execution"]
        D["SIMATIC AX WinCC Unified Elements"]:::secondary
        E["Unified Comfort Panel"]:::secondary
    end
    
    A -->|Commit YAML| B
    B -->|Trigger Build| C
    C -->|Deploy| D
    D -->|Render HMI| E

Integrating Code-Based HMI into the Plant Floor

The transition to code-based HMI engineering requires a shift in mindset. Instead of manually drawing a tank level indicator, an engineer writes a YAML configuration that binds an SVG component directly to the PLC tag structure. This enables programmatic generation of screens and guarantees consistency across deployments.

Automated Generation and Scalability

One of the most powerful aspects of SIMATIC AX WinCC Unified Elements is programmatic generation. If a plant adds 50 new pumps, an engineer can script the generation of the corresponding HMI faceplates rather than drawing them individually. This drastically reduces engineering hours and eliminates human error during repetitive tasks. It also allows OEMs to maintain a single repository of truth for their machine configurations.

Version Control and Peer Review

Because the HMI configuration is stored as plain text, teams can finally implement meaningful pull requests. When an engineer modifies an alarm screen, the changes can be clearly reviewed in a Git diff before being merged into the production branch. This brings a level of quality assurance previously unseen in standard OT visualization. Rolling back to a previous stable state becomes a matter of executing a simple Git command rather than restoring an entire virtual machine image.

Comparing HMI Engineering Approaches

To understand the impact of this shift, consider the differences between legacy methods and the new SIMATIC AX workflow.

Feature Traditional HMI (Drag-and-Drop) SIMATIC AX WinCC Unified Elements
Configuration Binary project files (.ap18, etc.) Text-based files (YAML)
Version Control Manual file backups or proprietary servers Standard Git (Diffs, Pull Requests)
Bulk Updates Manual iteration across screens Programmatic generation via scripts
Editor Independence Requires specific TIA Portal installation Any IDE (VS Code, Notepad++)

Overcoming Security and Deployment Hurdles

A common concern when introducing IT tools to the OT environment is cybersecurity. Fortunately, the text-based nature of this workflow enhances security auditing. Changes are cryptographically signed via Git commits, providing an immutable audit trail of who changed what, and when. Furthermore, the compilation and deployment processes can be executed locally, meaning the facility does not need to expose sensitive control networks to cloud-based compilation services.

Bridging the Gap with Standard Web Technologies

WinCC Unified is already built on modern web technologies (HTML5, SVG, JavaScript). By exposing the configuration layer through SIMATIC AX, Siemens is fully leveraging this web-native architecture. Engineers can integrate custom web controls seamlessly, ensuring that the interface is not only functional but visually robust.

For teams looking to standardize their automation deployments, adopting this code-based approach is a strategic necessity. It aligns perfectly with the broader industry trend of Software-Defined Automation, where hardware becomes commoditized and software dictates functionality.

Conclusion

The introduction of SIMATIC AX WinCC Unified Elements marks a critical maturation point for industrial visualization. By abandoning rigid, binary-driven editors in favor of code-based, IT-friendly workflows, Siemens is empowering engineers to build scalable, maintainable, and highly robust HMI systems. As manufacturing continues to digitize, mastering these IT/OT converged toolchains will be non-negotiable.

Ready to standardize your PLC and HMI deployments? Explore our AutomationView Store for advanced tools and resources designed to streamline your engineering workflows.

Frequently Asked Questions

Can I still use drag-and-drop with WinCC Unified?

Yes. TIA Portal continues to offer the standard visual editor for WinCC Unified. The SIMATIC AX approach provides an alternative, code-based workflow tailored for IT/OT converged teams and large-scale standardization.

What programming languages are supported?

The configuration primarily utilizes YAML for structural definitions, while standard web technologies like JavaScript and SVG handle dynamic scripting and custom graphics.

Does this require an active internet connection to compile?

No. The SIMATIC AX toolchain can be executed locally or within your facility’s internal CI/CD pipelines, ensuring full compliance with strict industrial cybersecurity requirements.

Share this article

Stay Updated with Automation News

Get the latest articles and news delivered directly to your inbox.

Log in to Subscribe

You must be registered and logged in to manage subscriptions.

Recommended for you

Inside Siemens Industrial AI Suite & Edge Management v2.0

Automation News
%%{init: {'theme':'dark', 'themeVariables': { 'background': '#001c38' }}}%%
flowchart LR
    classDef blue fill:#2563eb,color:#ffffff,stroke:none
    classDef green fill:#16a34a,color:#ffffff,stroke:none
    classDef red fill:#dc2626,color:#ffffff,stroke:none

    A["IT Infrastructure"]:::blue -->|Deploys Models| B["Siemens Industrial AI Suite"]:::green
    B -->|Inference Execution| C["Industrial Edge v2.0"]:::red
    C -->|Real-time Control| D["SIMATIC Hardware"]:::blue
AutomationView Icon AutomationView
calendar_month

Inside Siemens Industrial AI Suite & Edge Management v2.0

The Siemens Industrial AI Suite has reached general availability, launching in tandem with a major architectural overhaul in Industrial Edge Management v2.0. For automation engineers accustomed to isolating their control networks from enterprise IT infrastructure, this combined release signals a fundamental structural shift. We are moving past conceptual machine learning demonstrations and stepping directly into […]

Read Article arrow_forward

Deep Dive: Integrating HTML5 Web Components into Modern SCADA Systems

HMI
%%{init: {'theme':'dark', 'themeVariables': { 'background': '#001c38' }}}%%
flowchart LR
    A["Legacy HMI"] -.-> B["Proprietary Plugin"]
    B -.-> C["Vendor Lock-In"]
    D["Modern SCADA"] -->|HTML5 + SVG| E["Web Server"]
    E -->|WebSockets| F["Any Browser/Device"]
    
    style A fill:#e74c3c,stroke:#c0392b,color:#fff
    style B fill:#e74c3c,stroke:#c0392b,color:#fff
    style C fill:#c0392b,stroke:#a1281a,color:#fff
    style D fill:#2ecc71,stroke:#27ae60,color:#fff
    style E fill:#3498db,stroke:#2980b9,color:#fff
    style F fill:#9b59b6,stroke:#8e44ad,color:#fff
AutomationView Icon AutomationView
calendar_month

Deep Dive: Integrating HTML5 Web Components into Modern SCADA Systems

The industrial landscape is aggressively pivoting away from proprietary HMI plugins like ActiveX or Java applets. By transitioning to standard web technologies, automation engineers unlock responsive, hardware-agnostic control panels accessible from any authorized device. This guide unpacks the technical framework required for seamless HTML5 SCADA integration. The Middleware Layer: Bridging OPC UA to WebSockets Traditional […]

Read Article arrow_forward