TwinCAT 3 HMI

Leading Edge Automation Technology

Josef Papenfort
TwinCAT Product Management
Agenda

1. Motivation
2. Efficient Engineering for Configuration and Programming
3. Use Cases
4. Roadmap
5. Summary
Agenda

1. Motivation
2. Efficient Engineering for Configuration and Programming
3. Use Cases
4. Roadmap
5. Summary
Base technology HTML5

Platform-
Performance
independence

Future-proofed Responsive
design
Components

 TwinCAT HMI Creator

 WYSIWYG Editor

 TwinCAT HMI Framework

 Control library

 TwinCAT HMI Server

 Web server

 TwinCAT HMI Client

 Any HTML5 browser
Agenda

1. Motivation
2. Efficient Engineering for Configuration and Programming
3. Use Cases
4. Roadmap
5. Summary
 Visual Studio® Integration

 TwinCAT Integration

 WYSIWYG Editor

 HTML5 Design

 Source Code Control

 Live Engineering
WYSIWYG-Editor

 Graphical editor
 HTML5 skills not necessary
 Standard controls
 Users controls
 3th party controls
Templates

 Pre-defined project templates

and page templates
 Modern HTML5 design
 Customizable for corporate
design
Extensibility

 Controls
 User controls
 JavaScript
 3rd party
 Server extensions
 C++
 .NET
 Themes
Agenda

 Product
 Engineering
 Architecture
 Scenarios
 Roadmap
Client-Server

HTML5 Browser

TwinCAT HMI Client

Visual Studio®
TwinCAT HMI Project TwinCAT HMI Framework
TwinCAT HMI TwinCAT 3
Content Custom … Controls API Logic …
TwinCAT HMI Creator
Logic TwinCAT HMI Framework System Manager Programming
Processing

HTTP(S), WS(S)
Deploy
HTTP(S) WS(S)

TwinCAT HMI Server

WWW Root
TwinCAT HMI Server Extension TwinCAT HMI Server Extension

Events
TwinCAT HMI User Management
TwinCAT HMI Custom Extension
Events User …
Custom …
Project Framework Management Extension

ADS
Protocols

TwinCAT Runtimes 3th Party Runtimes

Agenda

1. Motivation
2. Efficient Engineering for Configuration and Programming
3. Use Cases
4. Roadmap
5. Summary
Using same design on different devices
TwinCAT HMI automatically adapts to your needs
Operating systems, browsers, devices: it’s your choice.
TwinCAT HMI automatically adapts to your needs.

Flexible and secure

 free choice of resolution, screen
size and orientation
 support for all CPU
performance classes
 secure authentication and user
management
Using same architecture with different scenarios
Local client

Panel

DVI/USB

TwinCAT HMI Client

TwinCAT HMI Server

TwinCAT Runtime
PC
Multi-client

Panel PC Mobile Device Mobile Device

TwinCAT HMI Client 2 TwinCAT HMI Client 3 TwinCAT HMI Client 4

HTTP(S), WS(S)

TwinCAT HMI Client 1

TwinCAT HMI Server

TwinCAT Runtime
Panel PC
Multi-runtime

Panel PC Mobile Device

TwinCAT HMI Client 1 TwinCAT HMI Client 2

HTTP(S), WS(S)

PC
TwinCAT HMI Server

ADS

TwinCAT Runtime 1 TwinCAT Runtime 2 TwinCAT Runtime n

PC PC PC
Multi-server

Panel PC
TwinCAT HMI Client

HTTP(S), WS(S)

TwinCAT HMI Server 1 TwinCAT HMI Server 2 TwinCAT HMI Server n

TwinCAT Runtime 1 TwinCAT Runtime 2 TwinCAT Runtime n

PC PC PC
Multi-protocol

Panel PC Panel PC

TwinCAT HMI Client TwinCAT HMI Client

TwinCAT HMI Server

HTTP(S), WS(S) TwinCAT HMI Server Extensions

PLC
ADS PLC
OPC PLC
UA BACnet …
PLC

…
IO PLC C++ Functions 3rd Party BACnet devices …
IOT / Analytics
DB / FTP / Mail
Telecontrol
TCPIP / Modbus
…
Agenda

1. Motivation
2. Efficient Engineering for Configuration and Programming
3. Use Cases
4. Roadmap
5. Summary
TwinCAT HMI Status

2015 2016 2017

Release Release
Version 1.0 Version 1.1
Pilot2 (Q3) (Q2)
(Q2)
Pilot1
(Q1)

Presentation
(SPS IPC Drives)
Features V1.0

TwinCAT HMI TwinCAT HMI TwinCAT HMI

Creator Framework Server
 Visual Studio®  Controls  ADS
integration  Standard  OPC UA
 TwinCAT integration  Charting, Events..  Scope
 WYSIWYG editor  User Controls  Security
 Source Code Control  Complex datatypes  User Management
 Package Management  Internationalisation  Recipe Management
 Project templates  Language  Eventlogger
 Themes  Units, formats  Historical data
 Graphic library  Extensible with  Extensible with
 Free scalable (SVG)  HTML5  C++
 Branch specific  JavaScript  .NET
Agenda

1. Motivation
2. Efficient Engineering for Configuration and Programming
3. Use Cases
4. Roadmap
5. Summary
TwinCAT HMI

Summary

 Efficient engineering
 HTML5, JavaScript
 Platform independence
 Web-based
 Flexible architecture
 Modular extensibility
Thank you!

21.06.2016 27