TEOS – The Easy Operation System

oystar line view
oystar dashboard
oystar header

The project One HMI shows the development of a uniform human-machine interface for the OYSTAR group. With its 10 manufacturing companies, the international OYSTAR group is one of the market leaders in the packaging industry. We were commissioned to create a uniform operation concept and software design for the requirements of 12 different technologies, 36 machine types, and 3 monitor sizes. This example shows how we apply our experience, knowledge, and team spirit to complete this ambitious project in a very short time. Now, the design is being used on OYSTAR machines under the product name ›TEOS - The Easy Operation System‹.

Download project summary (PDF)

The project was awarded the Red Dot Award: Communication Design 2011, the iF communication design award 2012 in gold and it has been nominated for the German Design Award 2013.


oystar responsive design
oystar information architecture
oystar different screen sizes
oystar mobile application

Responsive Design for different kinds of devices

Graphical classification of displays and features

Optimized for customized operator panels with different sizes

Adapted for mobile devices


Focused on our Customer Needs

At the beginning of the project there were 12 applications to be put to the test. Criteria such as simplicity of use, role functionality and adaptabilty for individual usage environments were important considerations. Just as important were the analyses which we undertook directly with OYSTAR’S customers. With the machines running and work taking place as normal, we were able to see and understand just how the complex workflows and production processes took place and were able to handle and design accordingly.

One Concise Control Concept

Through a survey of machine users, service technicians and developers, we researched the requirements of the different user types. Using this knowledge, we developed a control concept to suit every machine.

Using wireframes – schematically simplified drafts – we defined the fundamentals for the design of the interface. With the help of flow charts and in consultation with the client, we structured the information architecture.

We’ve used a modern wide screen format as the basis for our screen design. All the interface functions are allocated their own particular field on the screen: The most important information about the production process and what’s happening with the machine can be recognised at a glance using the status bar. The main navigation toolbar is situated ergonomically at the right-hand side of the screen.

With the development of the Human Machine Interface, we have taken into account many different principles in order to optimise user friendliness. These were defined at the start of the project and were the basis for all the structural and creative decisions that followed. Simplicity of use was our utmost priority at every stage.

Focusing the low-level user
The low-level user has been considered in all our structural decisions. Their everyday tasks have been prioritised. Depending on the level of the user, the interface can be extended to include other functions.

Differentiated Dialogue System
The information that is generated from the system is treated differently than the dialogue that the user opens. This simplifies communication with the machine and helps to avoid errors, maximising safety.

Easy to Customise
Little helpers for the production process, widgets, are customised to the requirements of the various types of users. Information about the production process, temperature or statistics – all available at a glance.

An Intelligent Machine Assistence System
Correct and fast reactions when it comes to errors save time and money. The context dependent assistant helps even inexperienced operators with step-by-step instructions in how to solve any problem that occur.

Visuals for the Parameter Input
Animated visuals help with setting up and optimise the stages of production. The advantage is direct feedback over the interface. The graphics are self-explanatory across all languages.

Increasing Functions using the Multi-touch screen
Using gestures and two hand operations on the touch screen, the natural interaction between the user and the machine can be increased, optimising efficiency.

Machine Linearisation
The consecutive stages of production from a machine are shown as simplified modules. In this way even complicated machines can be depicted in an easy-to-understand way.

Customized Operator Panel

The aim of the custom designed ONE HMI panel by Prime Cube was making operation easier, more ergonomic and more intuitive. It is designed as a stand-alone system for support arm installation. The stainless steel housing is IP65 protected all-around. Due to seamless integration of the glass front, the device is easily to clean. An operator uses the software's GUI intuitively with the multi-touch capable, capacitive touch screen. Display sizes range from 25 cm over 39 cm to 53 cm. Defined operations can be proceeded directly with capacitive controls or electromechanical devices. All device types provide fanless cooling thanks to Intel Atom CPU and the use of especially energy-efficient components.
Right from the start, HMI Project was involved in the industrial design process in an advisory function. This ensured the optimum harmonization of hardware and software design.

Ergonomical Interface Design

The ONE HMI Interface features a coherent and easy to use surface with high quality images. The systemised structuring can be adapted for any use and is easy to tailor to individual needs. The concise surface layout is quick and easy to learn, thus simplifying the handling of the machine. Every stage in the development process has taken place according to DIN EN ISO 9241 -210.

Touch sensitive Controls
Having looked at ergonomic studies, we have designed the touch screen with adequate space between the controls ensuring control errors kept to a minimum.

Intuitive controlling
Objects like buttons and input fields are depicted 3-dimensionally, making it easier for the user to observe and recognise what they are doing. Depending on the level of the user, only the information which they need for their particular tasks are shown.

Self explanatory Icons
We have developed a set of easy-to-use self-explanatory monochrome icons to serve all the important functions and processes. These simple 2-dimensional images help the user navigating through the interface and help fast cognition.

Logical Pictograms
The sometimes extremely complex machine modules are represented in simple pictograms. Basic functions and production processes from the modules are depicted in reduced form, making observation of the production process simpler.

Harmonious Colour concept
The interface has bright richly contrasting colours and tones, making it easier to read and more interesting to look at. The colour scheme is based on the colours in the customers own corporate design. The muted colours are differentiated using different tones. Prime colours signal when important information needs the immediate attention of the user.

Effective Implementation

Important Information by Prototyping
A trial run using a prototype was a great help in the development phase. This was implemented by GTI-control in a parallel project. Here, we could not only try out the design but also test typical action and interaction steps using reference users. We were thus able to integrate the insight gained in our design process to further optimize usability.

Online Wiki Styleguide
The styleguide has been provided as a dokuWiki site which you can access any time on the internet. Here you can find out all the information you need in order to implement the HMI interface software. It gives you all the exact measurements and a clearly laid-out download area. The online style guide is the tool you need for guaranteeing successful implementation of the creative elements. Here you can experience the consistency of the concept and get the look and feel of all OYSTAR’s applications. Using the community function, effective communications between designers and developers can be made accessible to anyone involved.

Growing Library with Use Cases
A special feature is the use case library. Special solutions and upgrades that develop during the implementation are documented here. It also serves as a source of reference for all the developers working abroad.

Sharing Components
The online styleguide is also used as a platform for developers to share software components. In this way effort is spared and synergy can be put to better use!

Future-oriented Concepts

Visualization and evaluation of monitoring data across production lines significantly contribute to the optimization of work processes and machine utilization. Preventive maintenance, i.e. the advance identification of pending mechanical and electrical problems, can help to avoid expensive downtimes and reduce the stock keeping of spare parts. By means of mobile devices, the operator has a comfortable control center view of all machines at any time – from almost any place.
RF-ID allows for unambiguous identification of users or of the position of an output device in the machine workshop.