WebIQ has a lot of features already built in. Gone are the days when you had to program everything from scratch, write a lot of code and have it only working on Windows. With its modern HTML5 web technology you can essentially do everything you can do on any other website (and that’s a lot!) and in addition visualize and control PLC data in any modern web browser easily.
Also, web development is quite simple, there are a lot of resources available online to get you started and to get help.
But then again – most of the time there’s no need to write any code at all – just click and configure!
Drag & Drop and Configuration Instead Of Writing Code
With its more than 50 built-in widgets that can be styled extensively and all delivered in both light and dark styles WebIQ comes ready to start building your web HMI from the start.
Whether its input our output widgets, gauges or trend displays, recipe widgets or buttons – WebIQ has it all:
- Alarm widgets
- Buttons and switches of multiple types
- Input fields, dropdowns, date and time inputs, checkbox, slider
- Image and image changer widgets
- Text and label widgets
- Duration, progress info, quality display
- Radial and linear gauges
- Trend display widgets
- User management widgets
- Recipe management widgets
- Heartbeat widget (show PLC connectivity status)
- iFrame and HTML widgets to display external content
- Composite widgets to create your own widget groups to reuse over and over
Data Recorder & Trend Functionalities
WebIQ includes a data recorder that stores the data in the built-in SQLite database. With each database capable of containing up to 281 TB of data you will be able to record a lot of data. For visualizing reocded data trend widgets are included that allow you to visualize data – either current data or historic data.
Video: TrendDisplay² – available from WebIQ 2.13
Style Your Widgets Code-Free
There’s no need to write a single line of code to create these Radial Gauge widget designs. Not only is the Radial Gauge widget included with WebIQ, you can also configure the widget easily by changing the design settings like font styles and sizes, positions and colors for ultimate flexibility. And if you want to re-use your creation in another project simply export the widget and import it in your next project!
Great for Programmers, Too!
While WebIQ Designer has been created to make it easy to create, edit and style an HMI without any programming knowledge, programming is also possible and allows you to basically do anything WebIQ has to offer from the most basic level upwards.
Whether you already have CSS knowledge and want to create your own custom CSS classes to style widgets with CSS or you want to create your own UI Actions and LocalScripts – both of which are written in standard JavaScript – all of that is possible!
With the integrated code editor – which is the same one that’s powering Microsoft’s Visual Studio Code – editing of CSS and JavaScript files is very efficient with included syntax checks and auto-complete – and an optional dark mode!
As WebIQ is built with open web technologies from the ground up including external JavaScript and CSS libraries is easy and well documented.
Creating custom widgets that provide an advantage over your competition with HTML, CSS and JavaScript only is also an option many customers utilize.
Web technology is not only easy to learn – web developers are easier to find than specialists in other programming languages most often used for legacy non-web-based HMI systems.
There is probably also no question unanswered online regarding web technology so it’s easy to find answers to questions you might have regarding HTML, CSS and JavaScript with a simple Google query. And of course we’re also available for support on demand!
Responsive Design in a Breeze
Surely one of the most important reasons for switching from a legacy HMI to a modern web HMI for many companies is responsive design – being able to use the HMI on different devices in different locations – on your smartphone, on a tablet, on different machine displays and from anywhere on the planet.
WebIQ has built in responsive layouting features that make it easy to make your web HMI react to different display sizes – all of which is built on top of modern web technology using features like flex layout and wrapping:
Theming Support
As WebIQ is based fully on open web technologies custom styling of the widgets is not only possible directly inside WebIQ Designer using the built-in instance styling, it’s also possible to use custom CSS code to style the WebIQ widgets as desired.
In addition, WebIQ also has built-in support for theming with both normal and inverted styles for all of the widgets. With this it’s also possible to create multiple themes for the same HMI just like day and night themes we have created for STADLER.
Here is another HMI which illustrates how to easily change the styling for different theme-like effects.
Hint: Use the slider in the middle do see the two themes in action.
WebIQ Designer: WYSIWYG Editor
Creating web HMIs with WebIQ is easy with WebIQ Designer and its included WYSIWYG (“What You See Is What You Get”) editor that allows you to see the current HMI directly.
Instant Preview on Mobile Devices
Whenver you change something it will be visible immediately and can also be tested directly in any browser or even on a smarthpone or tablet in your local network – no need to publish or compile anything: just open the preview address on your phone and see the current HMI as it is visible in WebIQ. If you now change something in your HMI in WebIQ Designer – like adding a widget – just reload the HMI on your smartphone and you’ll see the changes immediately! That makes testing for mobile devices easy!
The image below shows WebIQ Designer’s Layout Manager with the widget list and hierarchy open at the same time – with normal use you can of course see a lot more of your HMI than in this screenshot.
There’s so much more!
Honestly, we could go on and on to show you more of what WebIQ has to offer. But frankly there’s an even better way for you – why not try WebIQ for yourself now? It’s free, unconditional and you can test it without any limitations at all for 30 days. And if you’d like to extend the test period just drop us as a line and we’ll send you another 3o-day license key for free.
